tui

attendance-performance-manager-ui/admin/src/views/staff/perform/stat/dialogshow.vue

@@ -4,36 +4,86 @@
     <el-form ref="form" :model="form" :rules="rules" label-width="180px">
       <el-row>
         <el-col :span="8">
-          <Field label="请假类型" :span="24" prop="assessmentType" v-model="form.assessmentType" type="select"
-            :enumData="dict.assessmentType" placeholder="请选择请假类型" />
+          <Field
+            label="请假类型"
+            :span="24"
+            prop="assessmentType"
+            v-model="form.assessmentType"
+            type="select"
+            :enumData="dict.assessmentType"
+            placeholder="请选择请假类型"
+          />
         </el-col>
         <el-col :span="6">
-          <Field label="考比较类型" :span="24" prop="compareScope" v-model="form.compareScope" type="select"
-            :enumData="dict.compareScope" placeholder="请选择考比较类型" />
+          <Field
+            label="考比较类型"
+            :span="24"
+            prop="compareScope"
+            v-model="form.compareScope"
+            type="select"
+            :enumData="dict.compareScope"
+            placeholder="请选择考比较类型"
+          />
         </el-col>
         <el-col :span="6">
-          <Field :span="24" label="比例" prop="ratio" v-model="form.ratio" placeholder="请输入比例" />
+          <Field
+            :span="24"
+            label="比例"
+            prop="ratio"
+            v-model="form.ratio"
+            placeholder="请输入比例"
+          />
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="8">
           <el-form-item label="周期" prop="year">
-            <el-date-picker style="width: 100%;" format="yyyy" value-format="yyyy" v-model="form.year" type="year"
-              placeholder="选择年">
+            <el-date-picker
+              style="width: 100%;"
+              format="yyyy"
+              value-format="yyyy"
+              v-model="form.year"
+              type="year"
+              placeholder="选择年"
+            >
             </el-date-picker>
           </el-form-item>
 
           <!-- <Field label="年" :span="24" prop="year" v-model="form.year" placeholder="请输入年" /> -->
         </el-col>
         <el-col :span="6">
-          <Field label="周期类型" :span="24" prop="periodType" v-model="form.periodType" type="select"
-            :enumData="dict.periodType" @change="periodTypeChange" placeholder="请选择周期类型" />
+          <Field
+            label="周期类型"
+            :span="24"
+            prop="periodType"
+            v-model="form.periodType"
+            type="select"
+            :enumData="dict.periodType"
+            @change="periodTypeChange"
+            placeholder="请选择周期类型"
+          />
         </el-col>
         <el-col :span="6">
-          <Field v-if="form.periodType == 2" label="半年类型" :span="24" prop="halfYear" v-model="form.halfYear" type="select"
-            :enumData="dict.halfYear" placeholder="请选择半年类型" />
-          <Field v-if="form.periodType == 3" label="季度类型" :span="24" prop="quarter" v-model="form.quarter" type="select"
-            :enumData="dict.quarter" placeholder="请选择季度类型" />
+          <Field
+            v-if="form.periodType == 2"
+            label="半年类型"
+            :span="24"
+            prop="halfYear"
+            v-model="form.halfYear"
+            type="select"
+            :enumData="dict.halfYear"
+            placeholder="请选择半年类型"
+          />
+          <Field
+            v-if="form.periodType == 3"
+            label="季度类型"
+            :span="24"
+            prop="quarter"
+            v-model="form.quarter"
+            type="select"
+            :enumData="dict.quarter"
+            placeholder="请选择季度类型"
+          />
         </el-col>
       </el-row>
       <!-- <el-row>
@@ -45,8 +95,19 @@
       <el-row v-if="form.assessmentScope == 1">
         <el-col :span="8">
           <el-form-item label="选择部门">
-            <el-select v-model="deptId" filterable multiple collapse-tags style="width: 100%;" placeholder="请选择">
-              <el-option v-for="item in deptArr" :key="item.id" :label="item.deptName" :value="item.id">
+            <el-select
+              v-model="deptId"
+              filterable
+              multiple
+              style="width: 100%;height: auto;"
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in deptArr"
+                :key="item.id"
+                :label="item.deptName"
+                :value="item.id"
+              >
               </el-option>
             </el-select>
             <!-- <el-button type="primary">选择部门</el-button> -->
@@ -56,8 +117,20 @@
       <el-row v-if="form.assessmentScope == 2">
         <el-col :span="8">
           <el-form-item label="选择个人">
-            <el-select v-model="staffId" filterable multiple collapse-tags style="width: 100%;" placeholder="请选择">
-              <el-option v-for="item in staffArr" :key="item.id" :label="item.name" :value="item.id">
+            <el-select
+              v-model="staffId"
+              filterable
+              multiple
+              collapse-tags
+              style="width: 100%;"
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in staffArr"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              >
               </el-option>
             </el-select>
             <!-- <el-button type="primary">选择个人</el-button> -->
@@ -67,23 +140,44 @@
       <el-row>
         <el-col :span="12">
           <el-form-item label="负责人">
-            <el-row v-for="(item, index) in ownerList" :key="index" :style="{ 'margin-top': index > 0 ? '10px' : '' }">
+            <el-row
+              v-for="(item, index) in ownerList"
+              :key="index"
+              :style="{ 'margin-top': index > 0 ? '10px' : '' }"
+            >
               <el-col :span="8">
-                <el-input v-model="item.ownerName" placeholder="请输入姓名"></el-input>
+                <el-input
+                  v-model="item.ownerName"
+                  placeholder="请输入姓名"
+                ></el-input>
               </el-col>
               <el-col :span="12" style="padding:0 10px">
-                <el-input v-model="item.leaderMobiles" placeholder="请输入电话"></el-input>
+                <el-input
+                  v-model="item.leaderMobiles"
+                  placeholder="请输入电话"
+                ></el-input>
               </el-col>
               <el-col :span="2">
-                <el-button type="primary" icon="el-icon-plus" circle v-if="index == 0" @click="addOwner"></el-button>
-                <el-button type="danger" icon="el-icon-delete" circle v-else @click="delOwner(index)"></el-button>
+                <el-button
+                  type="primary"
+                  icon="el-icon-plus"
+                  circle
+                  v-if="index == 0"
+                  @click="addOwner"
+                ></el-button>
+                <el-button
+                  type="danger"
+                  icon="el-icon-delete"
+                  circle
+                  v-else
+                  @click="delOwner(index)"
+                ></el-button>
               </el-col>
             </el-row>
           </el-form-item>
         </el-col>
       </el-row>
 
-
       <!-- <el-row>
         <Field label="负责人id号" prop="ownerId" v-model="form.ownerId" placeholder="请输入负责人id号" />
         <Field label="负责人名称" prop="ownerName" v-model="form.ownerName" placeholder="请输入负责人名称" />
@@ -112,7 +206,12 @@
       </el-row> -->
     </el-form>
     <div slot="footer" class="dialog-footer">
-      <el-button type="primary" v-if="pageInfo.type !== 'view'" @click="submitForm">确 定</el-button>
+      <el-button
+        type="primary"
+        v-if="pageInfo.type !== 'view'"
+        @click="submitForm"
+        >确 定</el-button
+      >
       <el-button @click="cancel">取 消</el-button>
     </div>
   </el-dialog>
@@ -150,75 +249,74 @@ export default {
         month: [{ required: true, message: "请输入月", trigger: "blur" }],
       },
       // 负责人
-      ownerList: [
-        { ownerId: "", ownerName: "", leaderMobiles: "" }
-      ],
-      deptArr: [],//部门下拉
-      staffArr: [],//人员下拉
-      deptId: [],//部门选中
-      staffId: [],//人员选中数据
+      ownerList: [{ ownerId: "", ownerName: "", leaderMobiles: "" }],
+      deptArr: [], //部门下拉
+      staffArr: [], //人员下拉
+      deptId: [], //部门选中
+      staffId: [], //人员选中数据
     };
   },
   created() {
-    this.deptList()
-    this.staffList()
+    this.deptList();
+    this.staffList();
   },
   methods: {
-    periodTypeChange(){
-      this.form.quarter = ""
-      this.form.halfYear = ""
+    periodTypeChange() {
+      this.form.quarter = "";
+      this.form.halfYear = "";
     },
     beforeSubmit(form) {
       // 个人/部门
-      const perposeStaffList = []//选中人员
-      const perposeDeptList = []//选中部门
-      this.deptId.forEach(element => {
-        perposeDeptList.push({ deptId: element })
+      const perposeStaffList = []; //选中人员
+      const perposeDeptList = []; //选中部门
+      this.deptId.forEach((element) => {
+        perposeDeptList.push({ deptId: element });
       });
-      this.staffId.forEach(element => {
-        perposeStaffList.push({ staffId: element })
+      this.staffId.forEach((element) => {
+        perposeStaffList.push({ staffId: element });
       });
-      form.perposeStaffList = perposeStaffList
-      form.perposeDeptList = perposeDeptList
+      form.perposeStaffList = perposeStaffList;
+      form.perposeDeptList = perposeDeptList;
       // 负责人
-      const leaders = []//名
-      const leaderMobiles = []//电话
-      this.ownerList.forEach(element => {
-        leaders.push(element.ownerName)
-        leaderMobiles.push(element.leaderMobiles)
+      const leaders = []; //名
+      const leaderMobiles = []; //电话
+      this.ownerList.forEach((element) => {
+        leaders.push(element.ownerName);
+        leaderMobiles.push(element.leaderMobiles);
       });
-      form.leaders = leaders.length > 0 ? leaders.join(",") : ""
-      form.leaderMobiles = leaderMobiles.length > 0 ? leaderMobiles.join(',') : ""
+      form.leaders = leaders.length > 0 ? leaders.join(",") : "";
+      form.leaderMobiles =
+        leaderMobiles.length > 0 ? leaderMobiles.join(",") : "";
 
-      console.log(form, "入参")
-      return form
+      console.log(form, "入参");
+      return form;
     },
     // 查询部门列表
     deptList() {
       this.$post("/dept/list", { page: 1, size: -1 }).then((res) => {
-        const { code, data, dict } = res
+        const { code, data, dict } = res;
         if (code == 1) {
-          this.deptArr = data.data
-          console.log(data.data, "部门")
+          this.deptArr = data.data;
+          console.log(data.data, "部门");
         }
       });
     },
     // 查询部门列表
     staffList() {
       this.$post("/staff/list", { page: 1, size: -1 }).then((res) => {
-        const { code, data, dict } = res
+        const { code, data, dict } = res;
         if (code == 1) {
-          this.staffArr = data.data
+          this.staffArr = data.data;
         }
       });
     },
     /** 负责人添加 */
     addOwner() {
-      this.ownerList.push({ ownerId: "", ownerName: "", leaderMobiles: "" })
+      this.ownerList.push({ ownerId: "", ownerName: "", leaderMobiles: "" });
     },
     /** 负责人删除 */
     delOwner(index) {
-      this.ownerList.splice(index, 1)
+      this.ownerList.splice(index, 1);
     },
     /** 编辑 */
     edit(row) {
@@ -255,30 +353,36 @@ export default {
       this.open = true;
       if (this.pageInfo.type == "add") {
         // 新增
-        this.reset()
-        this.form.assessmentScope = this.$parent.query.assessmentScope + ''
+        this.reset();
+        this.form.assessmentScope = this.$parent.query.assessmentScope + "";
       } else {
         // 编辑
-        this.form.year = this.form.year + ''
-        const leaderMobiles = this.form.leaderMobiles.split(',')
+        this.form.year = this.form.year + "";
+        const leaderMobiles = this.form.leaderMobiles.split(",");
         // 回显负责人
-        const ownerList = []
-        this.form.leaders.split(',').forEach((v, i) => {
-          ownerList.push({ ownerId: "", ownerName: v, leaderMobiles: leaderMobiles[i] || '' })
-        })
-        this.ownerList = ownerList
+        const ownerList = [];
+        this.form.leaders.split(",").forEach((v, i) => {
+          ownerList.push({
+            ownerId: "",
+            ownerName: v,
+            leaderMobiles: leaderMobiles[i] || "",
+          });
+        });
+        this.ownerList = ownerList;
         // 回显选中人员
-        const staffId = []
-        this.form.perposeStaffList && this.form.perposeStaffList.forEach(v => {
-          staffId.push(v.staffId)
-        })
-        this.staffId = staffId
+        const staffId = [];
+        this.form.perposeStaffList &&
+          this.form.perposeStaffList.forEach((v) => {
+            staffId.push(v.staffId);
+          });
+        this.staffId = staffId;
         // 回显选中部门
-        const deptId = []
-        this.form.perposeDeptList && this.form.perposeDeptList.forEach(v => {
-          deptId.push(v.deptId)
-        })
-        this.deptId = deptId
+        const deptId = [];
+        this.form.perposeDeptList &&
+          this.form.perposeDeptList.forEach((v) => {
+            deptId.push(v.deptId);
+          });
+        this.deptId = deptId;
       }
     },
 
@@ -293,11 +397,11 @@ export default {
         ownerId: null,
         ownerName: "",
         staffId: null,
-        assessmentType: '1',
-        assessmentScope: '1',
-        compareScope: '1',
+        assessmentType: "1",
+        assessmentScope: "1",
+        compareScope: "1",
         ratio: 0.0,
-        periodType: '1',
+        periodType: "1",
         year: "",
         // month: null,
         halfYear: "",
@@ -306,13 +410,11 @@ export default {
         leaderMobiles: "",
         remark: "",
         perposeStaffList: [],
-        perposeDeptList: []
+        perposeDeptList: [],
       };
-      this.ownerList = [
-        { ownerId: "", ownerName: "", leaderMobiles: "" }
-      ]
-      this.deptId = []
-      this.staffId = []
+      this.ownerList = [{ ownerId: "", ownerName: "", leaderMobiles: "" }];
+      this.deptId = [];
+      this.staffId = [];
       this.resetForm("form");
     },
     resetForm(refName) {