Skip to content

frontend / qqxb-self-service

Go to a project
Commit 1472093b by lishengfu
Options

update

parent 7bafe2a6
Inline Side-by-side
Showing with 62 additions and 44 deletions
src/components/archives/workInfo.vue
<template> <template>
<div class="content"> <div class="content">
<div class="tip">1</div> <div class="header">
<div class="title">工作信息</div> <div class="tip"></div>
<div class="nav"> <div class="title">工作信息</div>
<p>派遣公司</p>
<p>用工单位</p>
<p>工作地点</p>
<p>工作职位</p>
<p>入职时间</p>
</div> </div>
<div class="info"> <div class="box">
<p>北京金色华勤数据服务有限公司</p> <div class="item">
<p>北京金色华勤数据服务有限公司</p> <span>派遣公司</span>
<p>福国际大厦A座88层市场推广专员2019-11-22</p> <label>北京金色华勤数据服务有限公司</label>
<p>北京金色华勤数据服务有限公司</p> </div>
<p>北京金色华勤数据服务有限公司</p> <div class="item">
<span>用工单位</span>
<label>北京金色华勤数据服务有限公司</label>
</div>
<div class="item">
<span>工作地点</span>
<label>福国际大厦A座88层市场推广专员2019-11-22</label>
</div>
<div class="item">
<span>工作职位</span>
<label>北京金色华勤数据服务有限公司</label>
</div>
<div class="item">
<span>入职时间</span>
<label>北京金色华勤数据服务有限公司</label>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -36,37 +46,45 @@ export default class workInfo extends Vue {} ...@@ -36,37 +46,45 @@ export default class workInfo extends Vue {}
<style lang="less" scoped> <style lang="less" scoped>
.content { .content {
margin-top: 10px; margin-top: 10px;
display: grid; .header {
align-items: center; height: 50px;
grid-template-columns :20px 118px 1fr; display: flex;
grid-template-areas: align-items: center;
"tip title ." .tip {
". nav info"; width: 3px;
height: 16px;
.tip { background: rgba(34, 189, 122, 1);
grid-area: tip;
}
.title {
grid-area: title;
}
.nav {
grid-area: nav;
display: grid;
grid-template-rows: minmax(30px,auto);
p {
font-size: 14px;
color: rgba(149, 152, 158, 1);
line-height: 30px;
} }
} .title {
.info { margin-left: 17px;
grid-area: info; height: 16px;
display: grid; font-size: 16px;
grid-template-rows: minmax(30px,auto); font-weight: 500;
p {
font-size: 14px;
color: rgba(61, 64, 71, 1); color: rgba(61, 64, 71, 1);
line-height: 30px; }
}
.box {
margin: 0 20px;
padding-top: 8px;
border-top: 1px solid #eaeef5;
.item {
display: flex;
align-items: center;
span {
min-width: 98px;
display: block;
font-size: 14px;
color: rgba(149, 152, 158, 1);
line-height: 30px;
text-align: right;
margin-bottom: auto;
}
label {
font-size: 14px;
color: rgba(61, 64, 71, 1);
line-height: 30px;
margin-left: 20px;
}
} }
} }
} }
......
src/views/Archives.vue
...@@ -12,7 +12,7 @@ import workInfo from "@/components/archives/workInfo.vue"; ...@@ -12,7 +12,7 @@ import workInfo from "@/components/archives/workInfo.vue";
@Component({ @Component({
name: "Archives", name: "Archives",
components: { components: {
[workInfo.name]: workInfo workInfo
} }
}) })
export default class archives extends Vue {} export default class archives extends Vue {}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment