修改

pages/index/Staffmanagement.vue

@@ -76,8 +76,8 @@
     </view>
 
 
-    <u-popup :round="10" :show="show" @close="close" @open="open">
+    <u-popup :round="10" :show="show" @close="close" :mask-click="false" @open="open">
-      <view class="pop-box">
+      <view class="pop-box scrollable-content">
         <view class="s-title">添加员工</view>
         <view class="on-input">
           <view class="s-huix">姓名：</view>
@@ -87,8 +87,57 @@
           <view class="s-huix">电话：</view>
           <view class=""><input v-model="phoneNum" type="text" placeholder="请输入手机号"></view>
         </view>
+        <view class="on-input">
+          <view class="s-huix">学历：</view>
+          <view class="" @click="showEducation = true"><input v-model="educationText" type="text"
+                                                              placeholder="请选择学历"></view>
+        </view>
+        <view class="on-input">
+          <view class="s-huix">身份证号：</view>
+          <view class=""><input v-model="idNumber" type="text" placeholder="请输入身份证号"></view>
+        </view>
+        <view class="on-input">
+          <view class="s-huix">入职时间：</view>
+          <view class="" @click="showJoinedDate = true"><input :value="formattedJoinedDate" type="text"
+                                                               placeholder="请选择入职时间"></view>
+        </view>
+        <view class="on-input">
+          <view class="s-huix">转正时间：</view>
+          <view class="" @click="showFormalDate = true"><input :value="formattedFormalDate" type="text"
+                                                               placeholder="请选择转正时间"></view>
+        </view>
+        <view class="on-input">
+          <view class="s-huix">购买保险时间：</view>
+          <view class="" @click="showSafeDate = true"><input :value="formattedSafeDate" type="text"
+                                                             placeholder="请选择购买保险时间"></view>
+        </view>
+        <view class="on-input">
+          <view class="s-huix">附件：</view>
+          <view class="" @click="addFile"><input type="text" placeholder="添加附件"></view>
+        </view>
+        <view v-for="(item, index) in files">
+          <view class="on-input">
+            <view class="s-huix">名称：</view>
+            <view class=""><input v-model="item.name" type="text" placeholder="请输入附件名称"></view>
+          </view>
+          <u-upload v-if="!item.fileUrl"
+                    @afterRead="uploadFilePromise($event, index)"
+                    name="6"
+                    multiple
+                    :maxCount="1"
+                    width="100%"
+                    height="140px"
+          >
+          </u-upload>
+          <view v-else class="image-container">
+            <image :src="item.fileUrl" style="width: 100%;height: 140px;"></image>
+            <view @click="deletedUrl(index)" class="close-button">
+              <text>x</text>
+            </view>
+          </view>
+        </view>
         <view class="">
-          <view class="s-huix">岗位：</view>
+          <view class="s-huix" style="text-align: left">岗位：</view>
           <view class="warp-flax">
             <view class="flasxbox" :class="{ 'gwcss' : gwindex == index }" v-for="(item,index) in  renList"
                   :key="index" @click="xgang(index,item.id)">
@@ -102,12 +151,43 @@
         </view>
       </view>
     </u-popup>
+
+    <u-picker :show="showEducation" ref="uPicker" :columns="educations"
+              @confirm="chooseEducation" @cancel="showEducation = false"
+              keyName="label"></u-picker>
+
+    <u-datetime-picker
+        :show="showJoinedDate"
+        v-model="joinedDate"
+        @cancel="showJoinedDate = false"
+        @confirm="chooseJoinDate"
+        mode="date"
+        return-type='string'
+    ></u-datetime-picker>
+    <u-datetime-picker
+        :show="showFormalDate"
+        v-model="formalDate"
+        @cancel="showFormalDate = false"
+        @confirm="chooseFormalDate"
+        mode="date"
+        return-type='string'
+    ></u-datetime-picker>
+    <u-datetime-picker
+        :show="showSafeDate"
+        v-model="safeDate"
+        @cancel="showSafeDate = false"
+        @confirm="chooseSafeDate"
+        mode="date"
+        return-type='string'
+    ></u-datetime-picker>
   </view>
 </template>
 
 <script>
 import config from '@/config'
 import request from '../../utils/request';
+import {getDictDataByType, formatDate} from "../../utils/utils";
+import upload from '@/utils/upload.js'
 
 export default {
   data() {
@@ -144,6 +224,18 @@ export default {
       gwid: 0,
       roleId: undefined,
       addRoleId: undefined,
+      education: null,
+      educationText: null,
+      idNumber: null,
+      joinedDate: null,
+      formalDate: null,
+      safeDate: null,
+      educations: [],
+      showEducation: false,
+      showJoinedDate: false,
+      showFormalDate: false,
+      showSafeDate: false,
+      files: []
     }
   },
   onLoad() {
@@ -173,7 +265,58 @@ export default {
     this.partnerId = uni.getStorageSync('partnerId')
     // this.getindex()
   },
+  computed: {
+    formattedJoinedDate() {
+      if (!this.joinedDate) return '';
+      return formatDate(this.joinedDate); // 确保formatDate返回'yyyy-MM-dd'格式
+    },
+    formattedFormalDate() {
+      if (!this.formalDate) return '';
+      return formatDate(this.formalDate); // 确保formatDate返回'yyyy-MM-dd'格式
+    },
+    formattedSafeDate() {
+      if (!this.safeDate) return '';
+      return formatDate(this.safeDate); // 确保formatDate返回'yyyy-MM-dd'格式
+    },
+  },
   methods: {
+    uploadFilePromise(event, index) {
+      upload({
+        url: '/common/upload',
+        filePath: event.file[0].url,
+      }).then((res) => {
+        this.files[index].name = event.file[0].name
+        this.files[index].fileUrl = config.baseImageUrl + "/" + res.data.url
+      })
+    },
+    deletedUrl(index) {
+      this.files.splice(index, 1)
+    },
+    addFile() {
+      if (this.files.length === 0 || this.files[0].fileUrl !== null) {
+        this.files.unshift({
+          name: "未命名",
+          fileUrl: null
+        })
+      }
+    },
+    chooseJoinDate(e) {
+      this.joinedDate = formatDate(e.value)
+      this.showJoinedDate = false
+    },
+    chooseFormalDate(e) {
+      this.formalDate = formatDate(e.value)
+      this.showFormalDate = false
+    },
+    chooseSafeDate(e) {
+      this.safeDate = formatDate(e.value)
+      this.showSafeDate = false
+    },
+    chooseEducation(e) {
+      this.educationText = e.value[0].label
+      this.education = e.value[0].value
+      this.showEducation = false
+    },
     toInfo(item) {
       request({
         url: '/company/staff/getByUserId?id=' + item.id,
@@ -224,6 +367,7 @@ export default {
     },
     showpopup() {
       this.show = true
+      this.educations = [getDictDataByType("company_staff_edu")]
     },
     async getindex() {
       if (this.workName != '') {
@@ -336,7 +480,6 @@ export default {
         userType: '01',
         roleId: this.gwid,
         password: '123456'
-
       }
       let res = await request({
         url: '/system/user/create',
@@ -355,6 +498,26 @@ export default {
             roleIds: roleIds
           }
         })
+
+        const staffData = {
+          userId: res.data,
+          name: this.realName,
+          tel: this.phoneNum,
+          joinedDate: this.joinedDate,
+          idNumber: this.idNumber,
+          education: this.education,
+          formalDate: this.formalDate,
+          safeDate: this.safeDate,
+          fileNames: this.files.length > 0 ? this.files.map(item => item.name).join(",") : "",
+          fileUrls: this.files.length > 0 ? this.files.map(item => {
+            return item.fileUrl.replace(config.baseImageUrl + "/", "")
+          }).join(",") : ""
+        }
+        const staffRes = await request({
+          url: '/company/staff/createByExistUser',
+          method: 'post',
+          data: staffData
+        })
         uni.showToast({
           title: "添加成功"
         })
@@ -512,7 +675,8 @@ export default {
 }
 
 .s-huix {
-  width: 20%;
+  width: 30%;
+  text-align: right;
 }
 
 .s-img {
@@ -620,6 +784,7 @@ export default {
   box-sizing: border-box;
   padding-bottom: 5px;
   margin: 10px;
+  justify-content: space-between;
 }
 
 .tjiao {
@@ -669,4 +834,38 @@ export default {
   box-sizing: border-box;
   white-space: nowrap;
 }
+
+.on-input input {
+  text-align: right;
+  padding-right: 1rem
+}
+
+/* 添加到你的样式文件中 */
+.image-container {
+  position: relative; /* 使子元素可以相对于此容器进行绝对定位 */
+  width: 100%;
+  height: 140px;
+}
+
+.close-button {
+  position: absolute;
+  top: 5px; /* 调整距离顶部的距离 */
+  right: 5px; /* 调整距离右侧的距离 */
+  width: 24px; /* 圆的直径 */
+  height: 24px;
+  background-color: #ff0000;
+  color: white;
+  border-radius: 50%; /* 使按钮呈现圆形 */
+  display: flex;
+  //align-items: center;
+  justify-content: center;
+  font-size: 16px; /* 调整“X”的字体大小 */
+  cursor: pointer; /* 鼠标悬停时显示为指针 */
+}
+
+.scrollable-content {
+  max-height: calc(80vh - 40px); /* 设置最大高度为视口高度的80%，减去弹出框的圆角和边距 */
+  overflow-y: auto; /* 启用垂直滚动 */
+  padding: 15px; /* 保持与现有padding一致 */
+}
 </style>