client/src/api/oa/staffRecords/index.ts

@@ -1,5 +1,10 @@
 import request from '@/config/axios'
 
+// 获得员工档案详情
+export const getRecordsDetail = (params) => {
+  return request.get({ url: '/adm/staff-records/detail', params }, '')
+}
+
 // 获得员工档案分页列表
 export const getRecordsPage = (params) => {
   return request.get({ url: '/adm/staff-records/page', params }, '')

client/src/views/OaSystem/mineCenter/rightChild/wdda.vue

@@ -1,4 +1,13 @@
 <script setup lang="ts">
+import { useQuery } from '@tanstack/vue-query'
+import { getRecordsDetail } from '@/api/oa/staffRecords'
+import { useUserStore } from '@/store/modules/user'
+
+const userId = useUserStore().getUser.id // 当前登录的编号
+
+const { data } = useQuery(['fetch-staff-detail'], async () => {
+  return await getRecordsDetail({ userId: 'e62bbc36-1892-41ef-a84d-75706a062ccf' })
+})
 /** 初始化 **/
 onMounted(() => {})
 
@@ -19,120 +28,124 @@ const tableData = [
 </script>
 <template>
   <div class="my-portrait">
-    <div class="my-portrait-item">
-      <div class="title">
-        <i></i>
-        <span>基本信息</span>
-      </div>
-      <div class="my-portrait-card">
-        <ul>
-          <li>
-            <span>出生日期</span>
-            <span>1991-10-26</span>
-          </li>
-          <li>
-            <span>户口性质</span>
-            <span>城镇</span>
-          </li>
-          <li>
-            <span>婚姻状况</span>
-            <span>未婚</span>
-          </li>
-          <li>
-            <span>民族</span>
-            <span>汉族</span>
-          </li>
-          <li>
-            <span>参加工作时间</span>
-            <span>1991-10-26</span>
-          </li>
-          <li>
-            <span>政治面貌</span>
-            <span>党员</span>
-          </li>
-          <li>
-            <span>现居住地址</span>
-            <span>浙江省杭州市萧山区新塘街道荷源府6-2-102</span>
-          </li>
-          <li>
-            <span>户口所在地</span>
-            <span>浙江省杭州市萧山区新塘街道荷源府6-2-102</span>
-          </li>
-        </ul>
-      </div>
-    </div>
-    <div class="my-portrait-item">
-      <div class="title">
-        <i></i>
-        <span>教育信息</span>
+    <!-- <ElResult  title="加载中">
+    </ElResult> -->
+    <div v-if="data">
+      <div class="my-portrait-item">
+        <div class="title">
+          <i></i>
+          <span>基本信息</span>
+        </div>
+        <div class="my-portrait-card">
+          <ul>
+            <li>
+              <span>出生日期</span>
+              <span>{{ data?.birthday }}</span>
+            </li>
+            <li>
+              <span>户口性质</span>
+              <span>{{ data?.hkxz }}</span>
+            </li>
+            <li>
+              <span>婚姻状况</span>
+              <span>{{ data?.hyzk }}</span>
+            </li>
+            <li>
+              <span>民族</span>
+              <span>{{ data?.nation }}</span>
+            </li>
+            <li>
+              <span>参加工作时间</span>
+              <span>{{ data?.cjgzsj }}</span>
+            </li>
+            <li>
+              <span>政治面貌</span>
+              <span>{{ data?.zzmm }}</span>
+            </li>
+            <li>
+              <span>现居住地址</span>
+              <span>{{ data?.xjzdz }}</span>
+            </li>
+            <li>
+              <span>户口所在地</span>
+              <span>{{ data?.hkszd }}</span>
+            </li>
+          </ul>
+        </div>
       </div>
-      <div class="my-portrait-card">
-        <ul>
-          <li>
-            <span>毕业院校</span>
-            <span>浙江水利水电职业技术学院</span>
-          </li>
-          <li>
-            <span>毕业时间</span>
-            <span>2011-10-26</span>
-          </li>
-          <li>
-            <span>最高学历</span>
-            <span>本科</span>
-          </li>
-          <li>
-            <span>专业</span>
-            <span>地质工程</span>
-          </li>
-        </ul>
+      <div class="my-portrait-item">
+        <div class="title">
+          <i></i>
+          <span>教育信息</span>
+        </div>
+        <div class="my-portrait-card">
+          <ul>
+            <li>
+              <span>毕业院校</span>
+              <span>{{ data?.byxx }}</span>
+            </li>
+            <li>
+              <span>毕业时间</span>
+              <span>{{ data?.bysj }}</span>
+            </li>
+            <li>
+              <span>最高学历</span>
+              <span>{{ data?.zgxl }}</span>
+            </li>
+            <li>
+              <span>专业</span>
+              <span>{{ data?.major }}</span>
+            </li>
+          </ul>
+        </div>
       </div>
-    </div>
-    <div class="my-portrait-item">
-      <div class="title">
-        <i></i>
-        <span>紧急联系人信息</span>
-      </div>
-      <div class="my-portrait-card">
-        <ul>
-          <li>
-            <span>紧急联系人姓名</span>
-            <span>张大帅</span>
-          </li>
-          <li>
-            <span>紧急联系人电话</span>
-            <span>15650214899</span>
-          </li>
-        </ul>
-      </div>
-    </div>
-    <div class="my-portrait-item" style="height: 200px">
-      <div class="title">
-        <i></i>
-        <span>技能证书</span>
+      <div class="my-portrait-item">
+        <div class="title">
+          <i></i>
+          <span>紧急联系人信息</span>
+        </div>
+        <div class="my-portrait-card">
+          <ul>
+            <li>
+              <span>紧急联系人姓名</span>
+              <span>{{ data?.jjlxrxm }}</span>
+            </li>
+            <li>
+              <span>紧急联系人电话</span>
+              <span>{{ data?.jjlxrhm }}</span>
+            </li>
+          </ul>
+        </div>
       </div>
+      <div class="my-portrait-item" style="height: 200px">
+        <div class="title">
+          <i></i>
+          <span>技能证书</span>
+        </div>
 
-      <div>
-        <el-table
-          :header-cell-style="{
-            background: '#F2F4F8',
-            color: '#2D333C',
-            height: '46px'
-          }"
-          style="width: 100%; height: 100%"
-          :data="tableData"
-          height="150px"
-        >
-          <el-table-column type="index" width="50" />
-          <el-table-column prop="name" label="证书名称" />
-          <el-table-column prop="level" label="证书等级" />
-          <el-table-column prop="date" label="获得时间" />
-          <el-table-column prop="organization" label="发证机构" />
-          <el-table-column fixed="right" label="操作" width="120">
-            <template #default>
-              <el-button link type="primary" size="small">查看</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
+        <div>
+          <el-table
+            :header-cell-style="{
+              background: '#F2F4F8',
+              color: '#2D333C',
+              height: '46px'
+            }"
+            style="width: 100%; height: 100%"
+            :data="tableData"
+            height="150px"
+          >
+            <el-table-column type="index" width="50" />
+            <el-table-column prop="name" label="证书名称" />
+            <el-table-column prop="level" label="证书等级" />
+            <el-table-column prop="date" label="获得时间" />
+            <el-table-column prop="organization" label="发证机构" />
+            <el-table-column fixed="right" label="操作" width="120">
+              <template #default>
+                <el-button link type="primary" size="small">查看</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
       </div>
     </div>
   </div>

client/src/views/OaSystem/projectCenter/projectBook/deptProject.vue

@@ -95,12 +95,13 @@
     <div class="tableBox">
       <div class="table" ref="tableRef">
         <el-table
+          stripe
           :data="tableData"
           style="width: 100%; height: 100%"
           :style="{ height: tableHeight + 'px' }"
           :header-cell-style="{
-            background: '#F7F8FA',
-            color: '#121518',
+            background: '#E5F0FB',
+            color: '#233755',
             height: '50px'
           }"
         >
@@ -115,12 +116,12 @@
             </template>
           </el-table-column>
           <el-table-column prop="projectTypeName" label="项目类别" width="120" />
-          <el-table-column prop="zrbm" label="责任部门" />
-          <el-table-column prop="xmjl" label="项目经理" />
-          <el-table-column prop="lxsj" label="立项时间" />
-          <el-table-column prop="yssj" label="验收时间" />
-          <el-table-column prop="outputValue" label="合同额" />
-          <el-table-column prop="xmzt" label="项目状态">
+          <el-table-column prop="zrbm" label="责任部门" width="200" />
+          <el-table-column prop="xmjl" label="项目经理" width="120" />
+          <el-table-column prop="lxsj" label="立项时间" width="120" />
+          <el-table-column prop="yssj" label="验收时间" width="120" />
+          <el-table-column prop="outputValue" label="合同额" width="120" />
+          <el-table-column prop="xmzt" label="项目状态" width="120">
             <template #default="scope">
               {{ xmztMap[scope.row.xmzt] }}
             </template>
@@ -267,5 +268,5 @@ onMounted(() => {
 })
 </script>
 <style lang="scss" scoped>
-@import url(./projectBook.scss);
+@import url('./projectBook.scss');
 </style>

client/src/views/OaSystem/projectCenter/projectBook/myProject.vue

@@ -89,12 +89,13 @@
     <div class="tableBox">
       <div class="table" ref="tableRef">
         <el-table
+          stripe
           :data="tableData"
           style="width: 100%; height: 100%"
           :style="{ height: tableHeight + 'px' }"
           :header-cell-style="{
-            background: '#F7F8FA',
-            color: '#121518',
+            background: '#E5F0FB',
+            color: '#233755',
             height: '50px'
           }"
         >
@@ -109,12 +110,12 @@
             </template>
           </el-table-column>
           <el-table-column prop="projectTypeName" label="项目类别" width="120" />
-          <el-table-column prop="zrbm" label="责任部门" />
-          <el-table-column prop="xmjl" label="项目经理" />
-          <el-table-column prop="lxsj" label="立项时间" />
-          <el-table-column prop="yssj" label="验收时间" />
-          <el-table-column prop="outputValue" label="合同额" />
-          <el-table-column prop="xmzt" label="项目状态">
+          <el-table-column prop="zrbm" label="责任部门" width="200" />
+          <el-table-column prop="xmjl" label="项目经理" width="120" />
+          <el-table-column prop="lxsj" label="立项时间" width="120" />
+          <el-table-column prop="yssj" label="验收时间" width="120" />
+          <el-table-column prop="outputValue" label="合同额" width="120" />
+          <el-table-column prop="xmzt" label="项目状态" width="120">
             <template #default="scope">
               {{ xmztMap[scope.row.xmzt] }}
             </template>
@@ -261,5 +262,5 @@ onMounted(() => {
 })
 </script>
 <style lang="scss" scoped>
-@import url(./projectBook.scss);
+@import url('./projectBook.scss');
 </style>

client/src/views/OaSystem/projectCenter/projectBook/projectBook.scss

@@ -1,20 +1,18 @@
 ._ProjectCenterBook {
-  width: calc(100% - 30px);
   height: calc(100% - 30px);
-  background: #FFFFFF;
-  border-radius: 4px 4px 4px 4px;
-  border: 1px solid #DEE0E3;
-  margin: 15px;
+  background: #ffffff;
+  border-radius: 20px;
+  margin-top: 30px;
+  padding: 23px 21px;
 
   .searchBox {
     width: 100%;
-    height: 125px;
-    background: #F7F8FA;
-    border-radius: 4px 4px 0 0;
+    background: #eaf5fd;
+    border-radius: 4px;
     display: flex;
     align-items: center;
     flex-wrap: wrap;
-    padding: 0 20px;
+    padding: 10px 30px;
     box-sizing: border-box;
 
     .form {
@@ -35,15 +33,14 @@
 
   .infoBox {
     width: 100%;
-    height: 55px;
-    background: #EDF2FB;
+    height: 30px;
+    margin: 20px 0;
 
     ul {
       width: 100%;
       height: 100%;
       display: flex;
       align-items: center;
-      padding: 0 20px;
 
       li {
         list-style: none;
@@ -56,25 +53,23 @@
   .tableBox {
     width: 100%;
     height: calc(100% - 180px);
-    padding: 15px 20px;
     position: relative;
 
     .table {
       width: 100%;
       height: calc(100% - 40px);
+      display: block;
 
       .operateBtn {
         width: 54px;
         height: 24px;
-        background: #EBF2FF;
-        border-radius: 16px 16px 16px 16px;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;
 
         span {
-          color: #2E77E6;
+          color: #2e77e6;
         }
       }
     }
@@ -86,13 +81,27 @@
       text-align: right;
     }
   }
+
+  :deep(.el-table) {
+    .el-table__inner-wrapper::before {
+      display: none;
+    }
+    .el-table__header-wrapper {
+      border-radius: 4px;
+    }
+
+    tr.el-table__row--striped td.el-table__cell {
+      background: #f7f7f7;
+    }
+  }
+
   :deep(.el-radio__label),
-  :deep(.el-checkbox__label){
-      font-size: 16px;
+  :deep(.el-checkbox__label) {
+    font-size: 16px;
   }
-  :deep(.el-radio-group){
+  :deep(.el-radio-group) {
     label {
       margin-right: 10px;
     }
   }
-}
+}

client/src/views/OaSystem/projectCenter/projectBook/projectBook.vue

@@ -89,12 +89,13 @@
     <div class="tableBox">
       <div class="table" ref="tableRef">
         <el-table
+          stripe
           :data="tableData"
           style="width: 100%; height: 100%"
           :style="{ height: tableHeight + 'px' }"
           :header-cell-style="{
-            background: '#F7F8FA',
-            color: '#121518',
+            background: '#E5F0FB',
+            color: '#233755',
             height: '50px'
           }"
         >
@@ -109,18 +110,18 @@
             </template>
           </el-table-column>
           <el-table-column prop="projectTypeName" label="项目类别" width="120" />
-          <el-table-column prop="zrbm" label="责任部门" />
-          <el-table-column prop="xmjl" label="项目经理" />
-          <el-table-column prop="lxsj" label="立项时间" />
-          <el-table-column prop="yssj" label="验收时间" />
-          <el-table-column prop="outputValue" label="合同额" />
-          <el-table-column prop="xmzt" label="项目状态">
+          <el-table-column prop="zrbm" label="责任部门" width="200" />
+          <el-table-column prop="xmjl" label="项目经理" width="120" />
+          <el-table-column prop="lxsj" label="立项时间" width="120" />
+          <el-table-column prop="yssj" label="验收时间" width="120" />
+          <el-table-column prop="outputValue" label="合同额" width="120" />
+          <el-table-column prop="xmzt" label="项目状态" width="120">
             <template #default="scope">
               {{ xmztMap[scope.row.xmzt] }}
             </template>
           </el-table-column>
 
-          <el-table-column label="操作" width="80">
+          <el-table-column label="操作" width="80" fixed="right">
             <template #default="scope">
               <div class="operateBtn" @click="operateClick(scope.row)">
                 <span>查看</span>

client/src/views/OaSystem/projectCenter/purchaseContract/deptContract.vue

@@ -117,12 +117,13 @@
     <div class="tableBox">
       <div class="table" ref="tableRef">
         <el-table
+          stripe
           :data="tableData"
           style="width: 100%; height: 100%"
           :style="{ height: tableHeight + 'px' }"
           :header-cell-style="{
-            background: '#F7F8FA',
-            color: '#121518',
+            background: '#E5F0FB',
+            color: '#233755',
             height: '50px'
           }"
         >
@@ -138,18 +139,18 @@
           </el-table-column>
           <el-table-column prop="areaManager" label="区域经理" width="120" />
           <el-table-column prop="clientName" label="委托方" width="180" />
-          <el-table-column prop="mainType" label="合同主类型" width="80">
+          <el-table-column prop="mainType" label="合同主类型" width="200">
             <template #default="scope">
               {{ mainTypeMap[scope.row.mainType] }}
             </template>
           </el-table-column>
-          <el-table-column prop="amountStatus" label="合同状态" width="80">
+          <el-table-column prop="amountStatus" label="合同状态" width="100">
             <template #default="scope">
               {{ amountStatusMap[scope.row.amountStatus] }}
             </template>
           </el-table-column>
           <el-table-column prop="contractAmount" label="合同金额" width="100" />
-          <el-table-column prop="contractAmount" label="已回款金额" width="100" />
+          <el-table-column prop="contractAmount" label="已回款金额" width="200" />
           <el-table-column prop="receivableAmount" label="应收账款" width="100" />
           <el-table-column prop="contractBalance" label="合同余额" width="100" />
           <el-table-column prop="contractOn" label="拿出日期" width="120" />
@@ -301,14 +302,15 @@ onMounted(() => {
 })
 </script>
 <style lang="scss" scoped>
-@import url(./purchaseContract.scss);
+@import url('./purchaseContract.scss');
+
 .purchaseContractBox {
-  margin-top: 20px;
+  position: relative;
   height: calc(100% - 20px);
-  background-color: #fff;
-  border-radius: 20px;
   padding: 20px;
-  position: relative;
+  margin-top: 20px;
   text-align: center;
+  background-color: #fff;
+  border-radius: 20px;
 }
 </style>

client/src/views/OaSystem/projectCenter/purchaseContract/myContract.vue

@@ -117,12 +117,13 @@
     <div class="tableBox">
       <div class="table" ref="tableRef">
         <el-table
+          stripe
           :data="tableData"
           style="width: 100%; height: 100%"
           :style="{ height: tableHeight + 'px' }"
           :header-cell-style="{
-            background: '#F7F8FA',
-            color: '#121518',
+            background: '#E5F0FB',
+            color: '#233755',
             height: '50px'
           }"
         >
@@ -138,18 +139,18 @@
           </el-table-column>
           <el-table-column prop="areaManager" label="区域经理" width="120" />
           <el-table-column prop="clientName" label="委托方" width="180" />
-          <el-table-column prop="mainType" label="合同主类型" width="80">
+          <el-table-column prop="mainType" label="合同主类型" width="200">
             <template #default="scope">
               {{ mainTypeMap[scope.row.mainType] }}
             </template>
           </el-table-column>
-          <el-table-column prop="amountStatus" label="合同状态" width="80">
+          <el-table-column prop="amountStatus" label="合同状态" width="100">
             <template #default="scope">
               {{ amountStatusMap[scope.row.amountStatus] }}
             </template>
           </el-table-column>
           <el-table-column prop="contractAmount" label="合同金额" width="100" />
-          <el-table-column prop="contractAmount" label="已回款金额" width="100" />
+          <el-table-column prop="contractAmount" label="已回款金额" width="200" />
           <el-table-column prop="receivableAmount" label="应收账款" width="100" />
           <el-table-column prop="contractBalance" label="合同余额" width="100" />
           <el-table-column prop="contractOn" label="拿出日期" width="120" />
@@ -301,14 +302,15 @@ onMounted(() => {
 })
 </script>
 <style lang="scss" scoped>
-@import url(./purchaseContract.scss);
+@import url('./purchaseContract.scss');
+
 .purchaseContractBox {
-  margin-top: 20px;
+  position: relative;
   height: calc(100% - 20px);
-  background-color: #fff;
-  border-radius: 20px;
   padding: 20px;
-  position: relative;
+  margin-top: 20px;
   text-align: center;
+  background-color: #fff;
+  border-radius: 20px;
 }
 </style>

client/src/views/OaSystem/projectCenter/purchaseContract/purchaseContract.scss

@@ -1,20 +1,18 @@
 ._PurchaseContractBox {
-  width: calc(100% - 30px);
   height: calc(100% - 30px);
-  background: #FFFFFF;
-  border-radius: 4px 4px 4px 4px;
-  border: 1px solid #DEE0E3;
-  margin: 15px;
+  background: #ffffff;
+  border-radius: 20px;
+  margin-top: 30px;
+  padding: 23px 21px;
 
   .searchBox {
     width: 100%;
-    height: 125px;
-    background: #F7F8FA;
-    border-radius: 4px 4px 0 0;
+    background: #eaf5fd;
+    border-radius: 4px;
     display: flex;
     align-items: center;
     flex-wrap: wrap;
-    padding: 0 20px;
+    padding: 10px 30px;
     box-sizing: border-box;
 
     .form {
@@ -35,15 +33,13 @@
 
   .infoBox {
     width: 100%;
-    height: 55px;
-    background: #EDF2FB;
-
+    height: 30px;
+    margin: 20px 0;
     ul {
       width: 100%;
       height: 100%;
       display: flex;
       align-items: center;
-      padding: 0 20px;
 
       li {
         list-style: none;
@@ -56,25 +52,23 @@
   .tableBox {
     width: 100%;
     height: calc(100% - 180px);
-    padding: 15px 20px;
     position: relative;
 
     .table {
       width: 100%;
       height: calc(100% - 40px);
+      display: block;
 
       .operateBtn {
         width: 54px;
         height: 24px;
-        background: #EBF2FF;
-        border-radius: 16px 16px 16px 16px;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;
 
         span {
-          color: #2E77E6;
+          color: #2e77e6;
         }
       }
     }
@@ -86,13 +80,26 @@
       text-align: right;
     }
   }
+
+  :deep(.el-table) {
+    .el-table__inner-wrapper::before {
+      display: none;
+    }
+    .el-table__header-wrapper {
+      border-radius: 4px;
+    }
+
+    tr.el-table__row--striped td.el-table__cell {
+      background: #f7f7f7;
+    }
+  }
   :deep(.el-radio__label),
-  :deep(.el-checkbox__label){
-      font-size: 16px;
+  :deep(.el-checkbox__label) {
+    font-size: 16px;
   }
-  :deep(.el-radio-group){
+  :deep(.el-radio-group) {
     label {
       margin-right: 10px;
     }
   }
-}
+}

client/src/views/OaSystem/projectCenter/purchaseContract/purchaseContract.vue

@@ -120,9 +120,10 @@
           :data="tableData"
           style="width: 100%; height: 100%"
           :style="{ height: tableHeight + 'px' }"
+          stripe
           :header-cell-style="{
-            background: '#F7F8FA',
-            color: '#121518',
+            background: '#E5F0FB',
+            color: '#233755',
             height: '50px'
           }"
         >
@@ -138,23 +139,23 @@
           </el-table-column>
           <el-table-column prop="areaManager" label="区域经理" width="120" />
           <el-table-column prop="clientName" label="委托方" width="180" />
-          <el-table-column prop="mainType" label="合同主类型" width="80">
+          <el-table-column prop="mainType" label="合同主类型" width="200">
             <template #default="scope">
               {{ mainTypeMap[scope.row.mainType] }}
             </template>
           </el-table-column>
-          <el-table-column prop="amountStatus" label="合同状态" width="80">
+          <el-table-column prop="amountStatus" label="合同状态" width="100">
             <template #default="scope">
               {{ amountStatusMap[scope.row.amountStatus] }}
             </template>
           </el-table-column>
           <el-table-column prop="contractAmount" label="合同金额" width="100" />
-          <el-table-column prop="contractAmount" label="已回款金额" width="100" />
+          <el-table-column prop="contractAmount" label="已回款金额" width="200" />
           <el-table-column prop="receivableAmount" label="应收账款" width="100" />
           <el-table-column prop="contractBalance" label="合同余额" width="100" />
           <el-table-column prop="contractOn" label="拿出日期" width="120" />
           <el-table-column prop="contractOff" label="拿回日期" width="120" />
-          <el-table-column label="操作" width="80">
+          <el-table-column label="操作" fixed="right" width="80">
             <template #default="scope">
               <div class="operateBtn" @click="operateClick(scope.row)">
                 <span>查看</span>
@@ -294,14 +295,15 @@ onMounted(() => {
 })
 </script>
 <style lang="scss" scoped>
-@import url(./purchaseContract.scss);
+@import url('./purchaseContract.scss');
+
 .purchaseContractBox {
-  margin-top: 20px;
+  position: relative;
   height: calc(100% - 20px);
-  background-color: #fff;
-  border-radius: 20px;
   padding: 20px;
-  position: relative;
+  margin-top: 20px;
   text-align: center;
+  background-color: #fff;
+  border-radius: 20px;
 }
 </style>