报名页样式修改

src/config/api.js

@@ -1,18 +1,9 @@
 import axios from 'axios';
 
-const defaultwbs = `https://test.tall.wiki/gateway/defaultwbs`;
+const defaultwbs = `https://test.tall.wiki/gateway/sports`;
 
-// 查询考勤信息
+// 查询用户信息
-export const clockQuery = params => axios.post(`${defaultwbs}/clock/query`, params);
+export const getUserInfo = params => axios.post(`${defaultwbs}/player/info`, params);
 
-// 查询考勤信息
+// 报名信息提交
-export const clockPunch = params => axios.post(`${defaultwbs}/clock/punch`, params);
+export const submitSignUp = params => axios.post(`${defaultwbs}/player/apply`, params);
-
-// 查询所有成员
-export const queryChecker = params => axios.post(`${defaultwbs}/deliver/queryChecker`, params);
-
-// 查询所有成员
-export const clockAudit = params => axios.post(`${defaultwbs}/clock/audit`, params);
-
-// 导出考勤excel
-export const clockExport = params => axios.post(`${defaultwbs}/clock/export`, params);

src/views/Apply/apply.vue

@@ -17,15 +17,28 @@
             <div>
               <div class="flex justify-between items-center h-12 border-b">
                 <label class="text-sm text-gray-400">姓名<span class="text-red-500 ml-1 align-middle">*</span></label>
-                <input class="text-sm text-right outline-none" id="name" type="text" placeholder="请输入您的姓名" />
+                <input class="text-sm text-right outline-none" id="name" v-model="name" type="text" placeholder="请输入您的姓名" />
               </div>
               <div class="flex justify-between items-center h-12 border-b">
                 <label class="text-sm text-gray-400">身份证号<span class="text-red-500 ml-1 align-middle">*</span></label>
-                <input class="text-sm text-right outline-none" id="idNumber" type="text" placeholder="请输入您的身份证号" />
+                <input
+                  class="text-sm text-right outline-none"
+                  id="idNumber"
+                  v-model="idCard"
+                  type="text"
+                  placeholder="请输入您的身份证号"
+                />
               </div>
               <div class="flex justify-between items-center h-12 border-b">
                 <label class="text-sm text-gray-400">年龄</label>
-                <input class="text-sm text-right outline-none" id="age" value="age" type="number" placeholder="请输入您的年龄" />
+                <input
+                  class="text-sm text-right outline-none"
+                  id="age"
+                  v-model="age"
+                  value="age"
+                  type="number"
+                  placeholder="请输入您的年龄"
+                />
               </div>
               <div class="flex justify-between items-center h-12 border-b">
                 <label class="text-sm text-gray-400">性别</label>
@@ -49,11 +62,11 @@
           <div class="bg-white pl-4 pr-4">
             <div class="flex justify-between items-center h-12 border-b">
               <label class="text-sm text-gray-400">地址</label>
-              <input class="text-sm text-right outline-none" id="address" type="text" placeholder="请输入您的详细地址" />
+              <input class="text-sm text-right outline-none" id="address" v-model="address" type="text" placeholder="请输入您的详细地址" />
             </div>
             <div class="flex justify-between items-center h-12 border-b">
               <label class="text-sm text-gray-400">电话<span class="text-red-500 ml-1 align-middle">*</span></label>
-              <input class="text-sm text-right outline-none" id="phone" type="text" placeholder="请输入您的电话" />
+              <input class="text-sm text-right outline-none" id="phone" v-model="phone" type="text" placeholder="请输入您的电话" />
             </div>
           </div>
           <div class="h-12 pl-4 text-sm" style="line-height: 3rem; color: #595959">培训信息</div>
@@ -67,7 +80,7 @@
                 </div>
               </div>
             </div>
-            <div class="flex justify-between items-center h-12 border-b">
+            <!-- <div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
               <label class="text-sm text-gray-400">培训项目<span class="text-red-500 ml-1 align-middle">*</span></label>
               <div class="flex flex-nowrap rounded-md startBtnBox" onclick="show()">
                 <div class="startBtn text-sm text-gray-400">请选择培训项目</div>
@@ -75,10 +88,10 @@
                   <img style="width: 15px" src="https://www.tall.wiki/staticrec/icon/right.svg" />
                 </div>
               </div>
-            </div>
+            </div> -->
           </div>
           <div class="apply pl-8 pr-8">
-            <button class="bg-blue-500 text-white text-base apply-btn" onclick="p1449944565128896512.immediatelyApply()">立即报名</button>
+            <button class="bg-blue-500 text-white text-base apply-btn" onclick="submitSignUp()">立即报名</button>
           </div>
         </form>
         <div class="w-screen h-screen fixed z-10 statusChoose bg-black bg-opacity-50" style="display: none; top: 0; left: 0">
@@ -98,37 +111,20 @@
 
 <script>
 import { mapState, mapMutations } from 'vuex';
-import { clockQuery, clockPunch, clockAudit } from '@/config/api';
+import { getUserInfo, submitSignUp } from '@/config/api';
-
-const columns = [
-  { title: '姓名', dataIndex: 'memberName', key: 'memberName', align: 'center', width: '16%' },
-  { title: '早', dataIndex: 'morning', key: 'morning', scopedSlots: { customRender: 'morning' }, align: 'center', width: '27%' },
-  { title: '晚', dataIndex: 'night', key: 'night', scopedSlots: { customRender: 'night' }, align: 'center', width: '27%' },
-  {
-    title: '审核人',
-    dataIndex: 'checkerName',
-    key: 'checkerName',
-    scopedSlots: { customRender: 'checkerName' },
-    align: 'center',
-    width: '30%',
-  },
-];
 
 export default {
   data() {
     return {
-      columns,
-      clockInfos: [],
-      options: null,
-      checkerId: undefined,
-      placement: 'left',
       timer: null,
-      chooseTime: '',
+      name: '',
-      auditOptions: null,
+      idCard: '',
-      morningLoading: false,
+      age: '',
-      nightLoading: false,
+      gender: 0,
-      today: this.$moment(new Date()).format('YYYY-MM-DD'),
+      position: 1,
-      selectedDate: '', // 当前选择的日期
+      address: '',
+      phone: '',
+      targetId: 1,
     };
   },
 
@@ -147,14 +143,6 @@ export default {
         // });
       }
     }, 300);
-
-    const time = this.$moment(Date.now()).format('YYYY-MM-DD');
-    if (!this.startTime) {
-      this.setStartTime(this.$moment(`${time} 00:00`).format('x') - 0);
-    }
-    if (!this.endTime) {
-      this.setEndTime(this.$moment(`${time} 23:59`).format('x') - 0);
-    }
   },
 
   methods: {
@@ -163,31 +151,31 @@ export default {
     async setParams() {
       const { projectId, startTime, endTime, memberIdList, roleId } = this;
       const params = { param: { projectId, memberIdList, startTime, endTime, roleId } };
-      await this.getClockQuery(params);
+      await this.getUserInfo();
     },
 
     /**
-     * 查询考勤信息
+     * 报名
-     * @param {string} projectId
-     * @param {array} memberIdList
-     * @param {string} startTime
-     * @param {string} endTime
      */
-    async getClockQuery(params) {
+    async submitSignUp() {
       try {
-        const res = await clockQuery(params);
+        const params = {
+          param: {
+            projectId: this.projectId,
+            name: this.name,
+            idCard: this.idCard,
+            age: this.age,
+            gender: this.gender,
+            position: this.position,
+            address: this.address,
+            phone: this.phone,
+            targetId: this.targetId,
+          },
+        };
+        const res = await submitSignUp(params);
         const { code, msg, data } = res.data;
         if (code === 200) {
-          data.forEach(item => {
+          console.log(data);
-            item.recordList.forEach(clcok => {
-              clcok.morningVisible = false;
-              clcok.nightVisible = false;
-              clcok.showNightTime = false;
-              clcok.showMorningTime = false;
-            });
-          });
-
-          this.clockInfos = [...data];
         } else {
           this.$message.error(msg || '获取失败');
           throw msg;
@@ -197,146 +185,29 @@ export default {
       }
     },
 
-    // 选择审核人
-    chooseChecker(value) {
-      this.checkerId = value;
-    },
-
-    // 打卡
-    checkTime(listIndex, index, clockType, id, memberId, checkerId, clockTime) {
-      const time = Date.now();
-      const selectTime = this.$moment(time).format('HH:mm');
-      if (clockType === 0) {
-        this.clockInfos[listIndex].recordList[index].morning = selectTime;
-      } else {
-        this.clockInfos[listIndex].recordList[index].night = selectTime;
-      }
-      const dateTime = this.$moment(`${clockTime} ${selectTime}`).format('x') - 0;
-      const params = { param: { checkerId: this.checkerId || checkerId || this.checkers[0].memberId, clockType, dateTime, id, memberId } };
-      this.handleClockPunch(params);
-    },
-
     /**
-     * 打卡
+     * 个人信息
-     * @param {string} checkerId 审核员id
-     * @param {array} clockType 打卡类型(0-早,1-晚)
-     * @param {string} dateTime 打卡时间
-     * @param {string} id 记录id(没有则不传)
-     * @param {string} memberId 考勤信息中的成员id
      */
-    async handleClockPunch(params) {
+    async getUserInfo() {
       try {
-        if (params.param.clockType === 0) {
+        const params = { param: { projectId: this.projectId } };
-          this.morningLoading = true;
+        const res = await getUserInfo(params);
-        } else {
+        const { code, msg, data } = res.data;
-          this.nightLoading = true;
+        if (code === 200 && data) {
-        }
+          this.name = data.name;
-        const res = await clockPunch(params);
+          this.idCard = data.idCard;
-        const { code, msg } = res.data;
+          this.age = data.age;
-        if (code === 200) {
+          this.gender = data.gender;
-          this.$message.success('打卡成功');
+          this.position = data.position;
-          const options = { startTime: this.startTime, endTime: this.endTime, memberIdList: this.memberIdList };
+          this.address = data.address;
-          this.setParams(options);
+          this.phone = data.phone;
-        } else {
+          this.targetId = data.targetId;
-          this.$message.error(msg || '打卡失败');
-          throw msg;
-        }
-        if (params.param.clockType === 0) {
-          this.morningLoading = false;
-        } else {
-          this.nightLoading = false;
-        }
-      } catch (error) {
-        if (params.param.clockType === 0) {
-          this.morningLoading = false;
-        } else {
-          this.nightLoading = false;
-        }
-        throw error || '打卡失败';
-      }
-    },
-
-    changeVisible(index, status, type) {
-      if (status !== 0) {
-        this.clockInfos.forEach(item => {
-          item.recordList.forEach((clcok, i) => {
-            if (i === index && type === 'morningVisible') {
-              clcok.morningVisible = !clcok.morningVisible;
-              clcok.nightVisible = false;
-            } else if (i === index && type === 'nightVisible') {
-              clcok.morningVisible = false;
-              clcok.nightVisible = !clcok.nightVisible;
-            } else {
-              clcok.morningVisible = false;
-              clcok.nightVisible = false;
-            }
-          });
-        });
-      }
-    },
-
-    // 修改
-    changeStatus(id, type, record, visible, show, selectedDate) {
-      record[visible] = false;
-      record[show] = true;
-      this.selectedDate = selectedDate;
-      this.auditOptions = { id, type };
-    },
-    // 选择修改时间
-    timeChange(time) {
-      let updateTime = this.$moment(time).format('HH:mm:ss');
-      let updateDate = this.selectedDate + ' ' + updateTime;
-      this.chooseTime = this.$moment(updateDate).format('x');
-    },
-    async openChange(open, record, show, timeType) {
-      if (!open && this.chooseTime) {
-        this.auditOptions[timeType] = this.chooseTime;
-        this.auditOptions.projectId = this.projectId;
-        const params = { param: this.auditOptions };
-        await this.handleClockAudit(params, record, show);
-      }
-      if (!open && !this.chooseTime) {
-        record[show] = false;
-      }
-    },
-
-    // 驳回
-    async rejectStatus(id, type, timeType, time, record, show) {
-      record[show] = false;
-      const params = { param: { id, type, [timeType]: time, projectId: this.projectId } };
-      await this.handleClockAudit(params, record, show);
-    },
-
-    // 取消
-    cancel(record, type) {
-      record[type] = false;
-    },
-
-    /**
-     * 审核打卡
-     * @param {string} id 打卡记录id
-     * @param {string} morning 早打卡时间
-     * @param {string} night 晚打卡时间
-     * @param {string} projectId 项目id
-     * @param {string} type 审批类型(0-修改,1-驳回,2-通过)
-     */
-    async handleClockAudit(params, record, show) {
-      try {
-        const res = await clockAudit(params);
-        const { code, msg } = res.data;
-        if (code === 200) {
-          this.$message.success(params.param.type === 0 ? '修改成功' : params.param.type === 1 ? '驳回成功' : '审核通过');
-          record[show] = false;
-          this.auditOptions = null;
-          this.chooseTime = '';
-          const options = { startTime: this.startTime, endTime: this.endTime, memberIdList: this.memberIdList };
-          this.setParams(options);
         } else {
-          this.$message.error(msg || '审核失败');
+          this.$message.error(msg || '获取失败');
           throw msg;
         }
       } catch (error) {
-        throw error || '审核失败';
+        throw error || '获取失败';
       }
     },
   },