update

src/components/archives/workInfo.vue

 <template>
-<div>
-    <button>测试</button>
-    <van-button type="primary">主要按钮</van-button>
-    <van-button type="info">信息按钮</van-button>
-    <!-- <van-cell title="单元格" is-link /> -->
-</div>
+  <div class="content">
+    <div class="tip">1</div>
+    <div class="title">工作信息</div>
+    <div class="nav">
+      <p>派遣公司</p>
+      <p>用工单位</p>
+      <p>工作地点</p>
+      <p>工作职位</p>
+      <p>入职时间</p>
+    </div>
+    <div class="info">
+      <p>北京金色华勤数据服务有限公司</p>
+      <p>北京金色华勤数据服务有限公司</p>
+      <p>福国际大厦A座88层市场推广专员2019-11-22</p>
+      <p>北京金色华勤数据服务有限公司</p>
+      <p>北京金色华勤数据服务有限公司</p>
+    </div>
+  </div>
 </template>
 
 <script lang="ts">
 import Vue from "vue";
-import { Button } from 'vant';
+// import { Button } from 'vant';
 import { Component } from "vue-property-decorator";
 
 @Component({
-  components:{
-    // [Cell.name]: Cell,
-    [Button.name]:Button
-  }
+  //   components:{
+  //     // [Cell.name]: Cell,
+  //     [Button.name]:Button
+  //   }
 })
-
 export default class workInfo extends Vue {}
 </script>
 
 <style lang="less" scoped>
+.content {
+  margin-top: 10px;
+  display: grid;
+  align-items: center;
+  grid-template-columns :20px 118px 1fr;
+  grid-template-areas:
+    "tip title ."
+    ". nav info";
+
+  .tip {
+    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;
+    }
+  }
+  .info {
+    grid-area: info;
+    display: grid;
+    grid-template-rows: minmax(30px,auto);
+    p {
+      font-size: 14px;
+      color: rgba(61, 64, 71, 1);
+      line-height: 30px;
+    }
+  }
+}
 </style>
\ No newline at end of file