展示问题优化

src/util/lib/province.js

@@ -1 +1,37 @@
-var provinceData=[{"label":"北京市","value":"11"},{"label":"天津市","value":"12"},{"label":"河北省","value":"13"},{"label":"山西省","value":"14"},{"label":"内蒙古自治区","value":"15"},{"label":"辽宁省","value":"21"},{"label":"吉林省","value":"22"},{"label":"黑龙江省","value":"23"},{"label":"上海市","value":"31"},{"label":"江苏省","value":"32"},{"label":"浙江省","value":"33"},{"label":"安徽省","value":"34"},{"label":"福建省","value":"35"},{"label":"江西省","value":"36"},{"label":"山东省","value":"37"},{"label":"河南省","value":"41"},{"label":"湖北省","value":"42"},{"label":"湖南省","value":"43"},{"label":"广东省","value":"44"},{"label":"广西壮族自治区","value":"45"},{"label":"海南省","value":"46"},{"label":"重庆市","value":"50"},{"label":"四川省","value":"51"},{"label":"贵州省","value":"52"},{"label":"云南省","value":"53"},{"label":"西藏自治区","value":"54"},{"label":"陕西省","value":"61"},{"label":"甘肃省","value":"62"},{"label":"青海省","value":"63"},{"label":"宁夏回族自治区","value":"64"},{"label":"新疆维吾尔自治区","value":"65"},{"label":"台湾","value":"66"},{"label":"香港","value":"67"},{"label":"澳门","value":"68"}];export default provinceData;
+var provinceData = [
+  { label: '北京市', value: '11' },
+  { label: '天津市', value: '12' },
+  { label: '河北省', value: '13' },
+  { label: '山西省', value: '14' },
+  { label: '内蒙古自治区', value: '15' },
+  { label: '辽宁省', value: '21' },
+  { label: '吉林省', value: '22' },
+  { label: '黑龙江省', value: '23' },
+  { label: '上海市', value: '31' },
+  { label: '江苏省', value: '32' },
+  { label: '浙江省', value: '33' },
+  { label: '安徽省', value: '34' },
+  { label: '福建省', value: '35' },
+  { label: '江西省', value: '36' },
+  { label: '山东省', value: '37' },
+  { label: '河南省', value: '41' },
+  { label: '湖北省', value: '42' },
+  { label: '湖南省', value: '43' },
+  { label: '广东省', value: '44' },
+  { label: '广西壮族自治区', value: '45' },
+  { label: '海南省', value: '46' },
+  { label: '重庆市', value: '50' },
+  { label: '四川省', value: '51' },
+  { label: '贵州省', value: '52' },
+  { label: '云南省', value: '53' },
+  { label: '西藏自治区', value: '54' },
+  { label: '陕西省', value: '61' },
+  { label: '甘肃省', value: '62' },
+  { label: '青海省', value: '63' },
+  { label: '宁夏回族自治区', value: '64' },
+  { label: '新疆维吾尔自治区', value: '65' },
+  { label: '台湾', value: '66' },
+  { label: '香港', value: '67' },
+  { label: '澳门', value: '68' }
+];
+export default provinceData;

src/views/admin/assignPoints/quota/taskAudit.vue

@@ -3,40 +3,15 @@
     <div>
       <Card class="cardTitle">
         <p>
-          <el-button type="primary" @click="backPage" style="width: 80px"
-            >返回</el-button
-          >
-          <el-tooltip
-            class="item"
-            effect="dark"
-            content="请在批量审核前务必已查看各个任务详情，并确认任务完成情况符合任务要求。"
-            placement="top"
-            v-if="examineShow"
-          >
-            <el-button
-              type="primary"
-              @click="examineBtnPl"
-              style="width: 100px;margin-left: 20px;"
-              >批量审核</el-button
-            >
+          <el-button type="primary" @click="backPage" style="width: 80px">返回</el-button>
+          <el-tooltip class="item" effect="dark" content="请在批量审核前务必已查看各个任务详情，并确认任务完成情况符合任务要求。" placement="top" v-if="examineShow">
+            <el-button type="primary" @click="examineBtnPl" style="width: 100px; margin-left: 20px">批量审核</el-button>
           </el-tooltip>
 
-          <el-button
-            v-if="examineShow"
-            type="primary"
-            @click="exportWord"
-            style="width: 100px; float:right; margin-left: 20px;"
-            >导出</el-button
-          >
+          <el-button v-if="examineShow" type="primary" @click="exportWord" style="width: 100px; float: right; margin-left: 20px">导出</el-button>
 
           <!-- v-if="examineShow" -->
-          <el-button
-            v-if="examineShow"
-            type="primary"
-            @click="quickAuditClick"
-            style="float:right;"
-            >快捷审核模式</el-button
-          >
+          <el-button v-if="examineShow" type="primary" @click="quickAuditClick" style="float: right">快捷审核模式</el-button>
         </p>
       </Card>
 
@@ -64,28 +39,14 @@
             >审核
           </el-button>
 
-          <el-button
-            type="text"
-            size="small"
-            icon="el-icon-view"
-            @click="lookBtn(scope.row, scope.index)"
-            >查看
-          </el-button>
+          <el-button type="text" size="small" icon="el-icon-view" @click="lookBtn(scope.row, scope.index)">查看 </el-button>
         </template>
         <!-- 拒绝的 -->
         <template slot="taskStatus" slot-scope="scope">
-          <div style="line-height: 16px;">
+          <div style="line-height: 16px">
             <span>{{ getTaskStatusVal(scope.row.taskStatus) }}</span>
-            <el-tooltip
-              class="item"
-              effect="dark"
-              :content="'拒绝原因：' + (scope.row.taskStatusInfo || '无')"
-              placement="top-start"
-            >
-              <i
-                v-if="scope.row.taskStatus === '4'"
-                class="el-icon-question f16 ml2"
-              ></i>
+            <el-tooltip class="item" effect="dark" :content="'拒绝原因：' + (scope.row.taskStatusInfo || '无')" placement="top-start">
+              <i v-if="scope.row.taskStatus === '4'" class="el-icon-question f16 ml2"></i>
             </el-tooltip>
           </div>
         </template>
@@ -96,12 +57,7 @@
         </template>
         <template slot="taskTypeIdSearch">
           <el-select v-model="taskTypeId" placeholder="任务类型">
-            <el-option
-              :label="item.taskTypeName"
-              :value="item.id"
-              v-for="item in taskList"
-              :key="item.id"
-            ></el-option>
+            <el-option :label="item.taskTypeName" :value="item.id" v-for="item in taskList" :key="item.id"></el-option>
           </el-select>
         </template>
 
@@ -109,60 +65,20 @@
           {{ getName && getName(scope.row) }}
         </template>
       </avue-crud>
-      <el-dialog
-        v-if="showDialog"
-        title="审核"
-        :visible.sync="showDialog"
-        top="12vh"
-        width="50%"
-        center
-        :before-close="handleClose"
-        class="review-dialog"
-      >
-        <el-form
-          :model="taskForm"
-          :rules="rules"
-          ref="taskForm"
-          label-width="100px"
-          class="demo-ruleForm"
-        >
+      <el-dialog v-if="showDialog" title="审核" :visible.sync="showDialog" top="12vh" width="50%" center :before-close="handleClose" class="review-dialog">
+        <el-form :model="taskForm" :rules="rules" ref="taskForm" label-width="100px" class="demo-ruleForm">
           <p v-if="atypismData.length" class="teskDetailsty">不一致信息</p>
-          <el-table
-            v-if="atypismData.length"
-            :data="atypismData"
-            border
-            style="width: 100%; margin-bottom:20px;"
-          >
-            <el-table-column
-              prop="name"
-              label="信息项"
-              width="180"
-              align="center"
-            >
-            </el-table-column>
-            <el-table-column
-              prop="oldData"
-              label="系统数据"
-              width="180"
-              align="center"
-            >
-            </el-table-column>
-            <el-table-column prop="newData" label="调研数据" align="center">
-            </el-table-column>
+          <el-table v-if="atypismData.length" :data="atypismData" border style="width: 100%; margin-bottom: 20px">
+            <el-table-column prop="name" label="信息项" width="180" align="center"> </el-table-column>
+            <el-table-column prop="oldData" label="系统数据" width="180" align="center"> </el-table-column>
+            <el-table-column prop="newData" label="调研数据" align="center"> </el-table-column>
           </el-table>
           <p v-show="singleFlag" class="teskDetailsty">服务详情</p>
           <div v-if="singleFlag && showDialog">
-            <task-detail
-              :id="examineVal"
-              @getSurveyTaskInfoById="getSurveyTaskInfoById"
-            />
+            <task-detail :id="examineVal" @getSurveyTaskInfoById="getSurveyTaskInfoById" />
           </div>
           <p class="teskDetailsty">审批意见</p>
-          <el-form-item
-            label="审批意见:"
-            prop="taskStatus"
-            class="formitem-box"
-          >
+          <el-form-item label="审批意见:" prop="taskStatus" class="formitem-box">
             <el-radio-group v-model="taskForm.taskStatus">
               <el-radio label="3">通过</el-radio>
               <el-radio label="4">拒绝</el-radio>
@@ -181,159 +97,89 @@
               }
             ]"
           >
-            <el-input
-              type="textarea"
-              v-model="taskForm.taskStatusInfo"
-            ></el-input>
+            <el-input type="textarea" v-model="taskForm.taskStatusInfo"></el-input>
           </el-form-item>
-          <refuseReason
-            v-if="taskForm.taskStatus === '4'"
-            @selectRefuseReason="selectRefuseReason"
-          />
+          <refuseReason v-if="taskForm.taskStatus === '4'" @selectRefuseReason="selectRefuseReason" />
         </el-form>
         <span slot="footer" class="dialog-footer">
           <el-button @click="handleClose">取 消</el-button>
-          <el-button type="primary" @click="sureBtn('taskForm')"
-            >确 定</el-button
-          >
+          <el-button type="primary" @click="sureBtn('taskForm')">确 定</el-button>
         </span>
       </el-dialog>
     </div>
 
     <!-- 导出弹窗 -->
-    <el-dialog
-      title="导出"
-      :visible.sync="exportDig"
-      width="30%"
-      :close-on-click-modal="false"
-      center
-    >
+    <el-dialog title="导出" :visible.sync="exportDig" width="30%" :close-on-click-modal="false" center>
       <template>
         <div class="down-item">
           <span>word格式：</span>
           <template v-if="wordStatus && wordStatus.status === 'NOT_GENERATE'">
-            <el-button
-              class="first"
-              @click="taskExport('word')"
-              :loading="wordLoading"
-              >生成报告</el-button
-            >
+            <el-button class="first" @click="taskExport('word')" :loading="wordLoading">生成报告</el-button>
           </template>
-          <template
-            v-else-if="wordStatus && wordStatus.status === 'GENERATING'"
-          >
+          <template v-else-if="wordStatus && wordStatus.status === 'GENERATING'">
             <el-button class="first" :loading="true">报告生成中...</el-button>
           </template>
-          <template
-            v-else-if="
-              wordStatus &&
-                (wordStatus.status === 'GENERATED' ||
-                  wordStatus.status === 'ERROR')
-            "
-          >
+          <template v-else-if="wordStatus && (wordStatus.status === 'GENERATED' || wordStatus.status === 'ERROR')">
             <el-button @click="taskExport('word')">重新导出</el-button>
-            <el-button
-              @click="downloadTask('word')"
-              v-if="wordStatus.status === 'GENERATED'"
-              >下载报告</el-button
-            >
-            <el-button
-              disabled
-              :title="wordStatus.errorMsg"
-              v-else-if="wordStatus.status === 'ERROR'"
-              >导出失败</el-button
-            >
+            <el-button @click="downloadTask('word')" v-if="wordStatus.status === 'GENERATED'">下载报告</el-button>
+            <el-button disabled :title="wordStatus.errorMsg" v-else-if="wordStatus.status === 'ERROR'">导出失败</el-button>
           </template>
           <div class="title-msg">
-            <p v-if="wordStatus && wordStatus.status === 'GENERATED'">
-              下载截止日期：{{ wordStatus.ttl }}
-            </p>
-            <p v-if="wordStatus && wordStatus.status === 'ERROR'">
-              本次导出失败：{{ wordStatus.errorMsg }}
-            </p>
+            <p v-if="wordStatus && wordStatus.status === 'GENERATED'">下载截止日期：{{ wordStatus.ttl }}</p>
+            <p v-if="wordStatus && wordStatus.status === 'ERROR'">本次导出失败：{{ wordStatus.errorMsg }}</p>
           </div>
         </div>
         <div class="down-item">
           <span>excel格式：</span>
           <template v-if="excelStatus && excelStatus.status === 'NOT_GENERATE'">
-            <el-button
-              class="first"
-              @click="taskExport('excel')"
-              :loading="excelLoading"
-              >生成报告</el-button
-            >
+            <el-button class="first" @click="taskExport('excel')" :loading="excelLoading">生成报告</el-button>
           </template>
           <template v-if="excelStatus && excelStatus.status === 'GENERATING'">
             <el-button class="first" :loading="true">报告生成中...</el-button>
           </template>
-          <template
-            v-else-if="
-              excelStatus &&
-                (excelStatus.status === 'GENERATED' ||
-                  excelStatus.status === 'ERROR')
-            "
-          >
+          <template v-else-if="excelStatus && (excelStatus.status === 'GENERATED' || excelStatus.status === 'ERROR')">
             <el-button @click="taskExport('excel')">重新导出</el-button>
-            <el-button
-              @click="downloadTask('excel')"
-              v-if="excelStatus.status === 'GENERATED'"
-              >下载报告</el-button
-            >
-            <el-button
-              disabled
-              :title="excelStatus.errorMsg"
-              v-else-if="excelStatus.status === 'ERROR'"
-              >导出失败</el-button
-            >
+            <el-button @click="downloadTask('excel')" v-if="excelStatus.status === 'GENERATED'">下载报告</el-button>
+            <el-button disabled :title="excelStatus.errorMsg" v-else-if="excelStatus.status === 'ERROR'">导出失败</el-button>
           </template>
           <div class="title-msg">
-            <p v-if="excelStatus && excelStatus.status === 'GENERATED'">
-              下载截止日期：{{ excelStatus.ttl }}
-            </p>
-            <p v-if="excelStatus && excelStatus.status === 'ERROR'">
-              本次导出失败：{{ excelStatus.errorMsg }}
-            </p>
+            <p v-if="excelStatus && excelStatus.status === 'GENERATED'">下载截止日期：{{ excelStatus.ttl }}</p>
+            <p v-if="excelStatus && excelStatus.status === 'ERROR'">本次导出失败：{{ excelStatus.errorMsg }}</p>
           </div>
         </div>
       </template>
       <span slot="footer" class="dialog-footer">
         注意： 1.报告将于24小时之内生成完毕，请注意下载。<br />
-        <i style="margin-left:62px"></i
-        >2.报告汇总为封面+任务数据汇总+任务列表明细。
+        <i style="margin-left: 62px"></i>2.报告汇总为封面+任务数据汇总+任务列表明细。
         <br />
-        <i style="margin-left:10px"></i>3.报告详情为每条任务的任务详情+图片。
+        <i style="margin-left: 10px"></i>3.报告详情为每条任务的任务详情+图片。
       </span>
     </el-dialog>
   </basic-container>
 </template>
 
 <script>
-import { taskAuditData } from "@/const/crud/assignPoints/quota/taskAudit";
-import {
-  getWmTaskList,
-  approvalTask,
-  getTaskList,
-  reviewTask
-} from "@/api/assignPoints/currency/taskAudit";
+import { taskAuditData } from '@/const/crud/assignPoints/quota/taskAudit';
+import { getWmTaskList, approvalTask, getTaskList, reviewTask } from '@/api/assignPoints/currency/taskAudit';
 
-import Config from "@/settings";
-import taskDetail from "@/components/taskDetail";
-import taskApi from "@/api/taskDetail/task";
-import refuseReason from "@/components/refuseReason";
-import { getDictType } from "@/api/common";
-import { mapGetters } from "vuex";
+import Config from '@/settings';
+import taskDetail from '@/components/taskDetail/index.vue';
+import taskApi from '@/api/taskDetail/task';
+import refuseReason from '@/components/refuseReason';
+import { getDictType } from '@/api/common';
+import { mapGetters } from 'vuex';
 
 export default {
-  name: "taskAudit",
+  name: 'taskAudit',
   components: {
     taskDetail,
     refuseReason
   },
   data() {
     return {
-      currentRow: "",
+      currentRow: '',
       form: {},
-      taskTypeId: "",
+      taskTypeId: '',
       taskList: [],
       singleFlag: false,
       tableData: [],
@@ -347,24 +193,22 @@ export default {
       packageIds: null,
       showDialog: false,
       taskForm: {
-        taskStatusInfo: ""
+        taskStatusInfo: ''
       },
-      taskDetail: "",
+      taskDetail: '',
       examineShow: false,
       showReview: true,
       scorePackageStatus: null,
       rules: {
-        taskStatus: [
-          { required: true, message: "请选择审批意见", trigger: "change" }
-        ]
+        taskStatus: [{ required: true, message: '请选择审批意见', trigger: 'change' }]
         // taskStatusInfo: [
         //   { required: true, message: "请输入审批说明", trigger: "blur" }
         // ]
       },
       tableLoading: false,
       searchForm: {},
-      examineVal: "",
-      jfbID: "",
+      examineVal: '',
+      jfbID: '',
       atypismData: [],
       selection: [],
       exportDig: false,
@@ -377,7 +221,7 @@ export default {
     };
   },
   computed: {
-    ...mapGetters(["userInfo"]),
+    ...mapGetters(['userInfo']),
     totalScore() {
       return this.selection.reduce((pre, cur) => {
         return pre + (cur.score || 0);
@@ -401,49 +245,47 @@ export default {
     this.getStatus();
   },
   mounted() {
-    if (this.$route.query.type == "taskAudit") {
+    if (this.$route.query.type == 'taskAudit') {
       this.examineShow = true;
     } else {
       this.examineShow = false;
     }
-    if (this.$route.query.page == "teamPoints") {
+    if (this.$route.query.page == 'teamPoints') {
       this.showReview = false;
     }
     if (this.$route.query.scorePackageStatus) {
-      this.scorePackageStatus = this.$route.query.scorePackageStatus + "";
+      this.scorePackageStatus = this.$route.query.scorePackageStatus + '';
     }
   },
   methods: {
     getTaskStatusVal(taskStatus) {
       taskStatus = String(taskStatus).trim();
-      const curr = this.task_status_dict.find(
-        item => item.value == Number(taskStatus)
-      );
+      const curr = this.task_status_dict.find((item) => item.value == Number(taskStatus));
       if (curr) {
         return curr.label;
       }
     },
 
     getTaskStatusDict() {
-      getDictType({ type: "task_status" }).then(res => {
+      getDictType({ type: 'task_status' }).then((res) => {
         this.task_status_dict = res.data.data;
       });
     },
     selectRefuseReason(refuseReason) {
       let info;
       if (this.taskForm.taskStatusInfo) {
-        info = this.taskForm.taskStatusInfo + refuseReason + "；";
+        info = this.taskForm.taskStatusInfo + refuseReason + '；';
       } else {
-        info = refuseReason + "；";
+        info = refuseReason + '；';
       }
 
-      this.$set(this.taskForm, "taskStatusInfo", info);
+      this.$set(this.taskForm, 'taskStatusInfo', info);
     },
     getStatus() {
-      taskApi.wordStatus(this.$route.query.id).then(res => {
+      taskApi.wordStatus(this.$route.query.id).then((res) => {
         this.wordStatus = res.data.data;
       });
-      taskApi.excelStatus(this.$route.query.id).then(res => {
+      taskApi.excelStatus(this.$route.query.id).then((res) => {
         this.excelStatus = res.data.data;
       });
     },
@@ -452,11 +294,11 @@ export default {
       this.exportDig = true;
     },
     async taskExport(type) {
-      if (type === "word") {
+      if (type === 'word') {
         this.wordLoading = true;
         let res = await taskApi.wordReport(this.$route.query.id);
         if (res.data.code != 0) {
-          this.$message.error("导出失败");
+          this.$message.error('导出失败');
           return false;
         }
         this.$message.success(res.data.data);
@@ -464,11 +306,11 @@ export default {
         this.getStatus();
         this.wordLoading = false;
       }
-      if (type === "excel") {
+      if (type === 'excel') {
         this.excelLoading = true;
         let res = await taskApi.excelReport(this.$route.query.id);
         if (res.data.code != 0) {
-          this.$message.error("导出失败");
+          this.$message.error('导出失败');
           return false;
         }
         this.$message.success(res.data.data);
@@ -479,40 +321,37 @@ export default {
     },
     downloadTask(type) {
       let latestUrl;
-      if (type === "word") {
+      if (type === 'word') {
         latestUrl = this.wordStatus.latestUrl;
-      } else if (type === "excel") {
+      } else if (type === 'excel') {
         latestUrl = this.excelStatus.latestUrl;
       }
-      let a = document.createElement("a");
+      let a = document.createElement('a');
       a.href = latestUrl;
       a.click();
-      this.$message.success("导出汇总报告成功");
+      this.$message.success('导出汇总报告成功');
       this.exportDig = false;
     },
     quickAuditClick() {
       let id = this.$route.query.id;
       this.$router.push({
-        path: "/admin/assignPoints/quota/quickAudit?id=" + id + "&type=1"
+        path: '/admin/assignPoints/quota/quickAudit?id=' + id + '&type=1'
       });
     },
     async getTaskList() {
-      const res = await getTaskList(
-        this.$route.query.id,
-        this.$route.query.taskStatus == "2" ? "2" : ""
-      );
+      const res = await getTaskList(this.$route.query.id, this.$route.query.taskStatus == '2' ? '2' : '');
       this.taskList = res.data.data;
     },
     getName(row) {
       let id = row.taskTypeId;
-      let curr = this.taskList.find(item => item.id == id);
+      let curr = this.taskList.find((item) => item.id == id);
       return curr.taskTypeName;
     },
     // 复row选框选中的值
     selectionChange(selection, row) {
       this.selection = selection;
       this.isHasAudit = false;
-      this.packageIds = "";
+      this.packageIds = '';
       if (undefined != selection) {
         for (var i = 0; i < selection.length; i++) {
           if (selection[i].taskStatus > 0) {
@@ -521,7 +360,7 @@ export default {
 
           this.packageIds += selection[i].id;
           if (i < selection.length - 1) {
-            this.packageIds += ",";
+            this.packageIds += ',';
           }
         }
       }
@@ -532,7 +371,7 @@ export default {
       getWmTaskList(
         Object.assign(
           {
-            taskStatus: this.$route.query.taskStatus == "2" ? "2" : "",
+            taskStatus: this.$route.query.taskStatus == '2' ? '2' : '',
             scorePackageId: this.$route.query.id,
             current: page.currentPage,
             size: page.pageSize
@@ -541,7 +380,7 @@ export default {
           this.searchForm
         )
       )
-        .then(response => {
+        .then((response) => {
           this.tableData = [];
           this.tableData = response.data.data.records;
           this.page.total = response.data.data.total;
@@ -564,7 +403,7 @@ export default {
       done();
     },
     searchReset() {
-      this.taskTypeId = "";
+      this.taskTypeId = '';
     },
     // 返回按钮
     backPage() {
@@ -579,8 +418,7 @@ export default {
       this.jfbID = row.scorePackageId;
       this.showDialog = true;
       this.singleFlag = true;
-      this.taskDetail =
-        Config.outsideUrl + "/h5/#/pages/task/task-detail/index?id=" + row.id;
+      this.taskDetail = Config.outsideUrl + '/h5/#/pages/task/task-detail/index?id=' + row.id;
     },
 
     //批量审核按钮
@@ -589,11 +427,11 @@ export default {
       this.currentRow = this.tableData[0];
       this.singleFlag = false;
       if (this.examineVal == null) {
-        this.$message.error("请选择需要审核的任务");
+        this.$message.error('请选择需要审核的任务');
         this.examineVal = null;
         return false;
-      } else if (this.examineVal == "") {
-        this.$message.error("请选择需要审核的任务");
+      } else if (this.examineVal == '') {
+        this.$message.error('请选择需要审核的任务');
         this.examineVal = null;
         return false;
       } else {
@@ -602,7 +440,7 @@ export default {
     },
     // 弹窗确定按钮
     sureBtn(formName) {
-      this.$refs[formName].validate(valid => {
+      this.$refs[formName].validate((valid) => {
         if (valid) {
           this.taskForm.id = this.examineVal;
           this.taskForm.scorePackageId = this.jfbID;
@@ -613,7 +451,7 @@ export default {
             nodeId: this.currentRow.checkState.curNodeId
           };
           approvalTask(args)
-            .then(response => {
+            .then((response) => {
               this.showDialog = false;
               this.getList(this.page);
               this.tableLoading = false;
@@ -623,17 +461,19 @@ export default {
               this.tableLoading = false;
             });
         } else {
-          console.log("error submit!!");
+          console.log('error submit!!');
           return false;
         }
       });
     },
     // 查看
     lookBtn(row, index) {
+      console.log('row', row);
+
       window.open(
-        Config.outsideUrl + "/h5/#/pages/task/task-detail/index?id=" + row.id,
-        "newwindow",
-        "height=500, width=400, top=200, left=300, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no"
+        Config.outsideUrl + '/h5/#/pages/task/task-detail/index?id=' + row.id,
+        'newwindow',
+        'height=500, width=400, top=200, left=300, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no'
       );
     },
 
@@ -642,7 +482,7 @@ export default {
       this.singleFlag = false;
       this.atypismData = [];
       this.taskForm = {};
-      this.examineVal = "";
+      this.examineVal = '';
     },
 
     // 分页查询
@@ -650,7 +490,7 @@ export default {
     currentChange() {},
     // 获取不一致信息
     getSurveyTaskInfoById(id) {
-      taskApi.getSurveyTaskInfoById(id).then(res => {
+      taskApi.getSurveyTaskInfoById(id).then((res) => {
         this.atypismData = res.data.data.compareList;
       });
     }
@@ -681,7 +521,7 @@ export default {
 }
 </style>
 
-<style>
+<style scoped>
 .teskDetailsty {
   width: 100%;
   height: 30px;

src/views/serviceManagement/servicesToBeReviewed/components/TaskDetail.vue

@@ -0,0 +1,436 @@
+<template>
+  <div class="task-box">
+    <!-- 分享的图片展示 -->
+
+    <el-image v-if="showImg" style="width: 100px; height: 100px" :src="taskInfo.shareImgUrl" :preview-src-list="[taskInfo.shareImgUrl]"> </el-image>
+    <template v-if="configList && configList.length > 0">
+      <div style="max-height: 270px; overflow: auto">
+        <div v-for="item in configList" :key="item.id" class="field-box">
+          <template v-if="item.taskFiledType == 'domain' || item.taskFiledType == 'select' || item.taskFiledType == 'tree'">
+            <div class="title-value">{{ item.taskFiledValue }}：</div>
+            <div class="desc-value" v-show="!(item.taskTypeId == '19' && item.taskFiledKey == 'temp3')">
+              {{ getDesc(item) }}
+            </div>
+          </template>
+          <!-- 城市选择 -->
+          <template v-if="item.taskFiledType === 'area'">
+            <div class="title-value">{{ item.taskFiledValue }}：</div>
+            <div class="desc-value">
+              {{ getAddress(item) }}
+            </div>
+          </template>
+          <!-- 文字输入 -->
+          <template v-if="item.taskFiledType == 'text' || item.taskFiledType == 'inputautoselect' || item.taskFiledType == 'map' || item.taskFiledType == 'mapwithimg'">
+            <div class="title-value">{{ item.taskFiledValue }}：</div>
+            <div class="desc-value">
+              {{ wmTaskContent[item.taskFiledKey] || '--' }}
+            </div>
+            <!-- 用temp17存储打卡图片 -->
+            <div v-if="item.taskFiledType == 'mapwithimg' && !!wmTaskContent['temp17']" class="location-img">
+              <div class="field-text">位置打卡图片</div>
+              <div class="img-box">
+                <el-image class="img-item" :src="baseUrl + wmTaskContent['temp17']" :preview-src-list="getPreviewList([baseUrl + wmTaskContent['temp17']], 0)"> </el-image>
+              </div>
+            </div>
+          </template>
+          <!-- 时间 -->
+          <template v-if="item.taskFiledType == 'datetime'">
+            <div class="title-value">{{ item.taskFiledValue }}：</div>
+            <div class="desc-value">
+              {{ wmTaskContent[item.taskFiledKey] || '--' }}
+            </div>
+          </template>
+          <!-- 日期范围 -->
+          <template v-if="item.taskFiledType == 'datatimerange'">
+            <div class="title-value">{{ item.taskFiledValue }}：</div>
+            <div class="desc-value">
+              {{ wmTaskContent[item.taskFiledKey] }}
+            </div>
+          </template>
+          <!-- 签名 -->
+          <div v-if="item.taskFiledType == 'sign'" class="divline" style="width: 100%; height: 15px; background-color: #e9e9e9; margin-bottom: 5px"></div>
+          <template v-if="item.taskFiledType == 'sign'">
+            <div class="upload-field">
+              <div class="field-text" :class="{ required: item.isMustfill == '1' }">{{ item.taskFiledValue }}：</div>
+              <!-- 上传组件 -->
+              <div class="img-box">
+                <el-image
+                  :key="index"
+                  class="img-item"
+                  :src="baseUrl + wmTaskContent[item.taskFiledKey]"
+                  :preview-src-list="getPreviewList([baseUrl + wmTaskContent[item.taskFiledKey]], 0)"
+                >
+                </el-image>
+              </div>
+            </div>
+          </template>
+          <!-- 图片上传 -->
+          <div v-if="item.taskFiledType == 'img'" class="divline" style="width: 100%; height: 15px; background-color: #e9e9e9; margin-bottom: 5px"></div>
+          <template v-if="item.taskFiledType == 'img'">
+            <div class="upload-field">
+              <div class="field-text" :class="{ required: item.isMustfill == '1' }">
+                {{ item.taskFiledValue }}：
+                <!-- {{ getImgList(wmTaskContent[item.taskFiledKey], item) }} -->
+              </div>
+              <!-- 上传组件 -->
+              <div class="img-box" v-if="item.imgList">
+                <div v-for="(iItem, index) in item.imgList" :key="index" class="img-box-content">
+                  <span class="type">{{ iItem.type }}</span>
+                  <el-image class="img-item" lazy :src="iItem.url" :preview-src-list="getPreviewList(item.previewList, index)" />
+                </div>
+              </div>
+            </div>
+          </template>
+          <!-- 文件类型 -->
+          <template v-if="item.taskFiledType === 'fileurl'">
+            <div class="upload-field">
+              <div class="field-text" :class="{ required: item.isMustfill == '1' }">
+                {{ item.taskFiledValue }}：
+                {{ getFileList(wmTaskContent[item.taskFiledKey], item) }}
+              </div>
+              <div v-if="item.fileList" class="pl60 pr60">
+                <!-- 图片文件 -->
+                <div class="img-box">
+                  <template v-for="(iItem, index) in item.fileList">
+                    <el-image
+                      v-if="imgTypeList.includes(iItem.url.split('.')[1])"
+                      :key="index"
+                      class="img-item"
+                      :src="iItem.url"
+                      :preview-src-list="
+                        getPreviewList(
+                          item.fileList.map((ele) => ele.url),
+                          index
+                        )
+                      "
+                    >
+                    </el-image>
+                  </template>
+                </div>
+                <!-- 其他文件 -->
+                <div class="file-box">
+                  <template v-for="(iItem, index) in item.fileList">
+                    <div v-if="!imgTypeList.includes(iItem.url.split('.')[1])" :key="index" class="df_sb file-item">
+                      <span>{{ iItem.fileName }}</span>
+                      <span @click="downloadFn(iItem)">下载</span>
+                    </div>
+                  </template>
+                </div>
+              </div>
+            </div>
+          </template>
+          <!-- 金额 -->
+          <template v-if="item.taskFiledType == 'money'">
+            <div class="title-value">{{ item.taskFiledValue }}：</div>
+            <div class="desc-value">
+              {{ wmTaskContent[item.taskFiledKey] || '--' }}
+            </div>
+          </template>
+          <!-- 数字 -->
+          <template v-if="item.taskFiledType == 'number'">
+            <div class="title-value">{{ item.taskFiledValue }}：</div>
+            <div class="desc-value">
+              {{ wmTaskContent[item.taskFiledKey] || '--' }}
+            </div>
+          </template>
+          <!-- 长文本 -->
+          <template v-if="item.taskFiledType == 'longtext'">
+            <div class="longtext-box">
+              <div class="field-text" :class="{ required: item.isMustfill == '1' }">{{ item.taskFiledValue }}：</div>
+              <textarea class="textarea-box" :disabled="true" :value="wmTaskContent[item.taskFiledKey] || '--'" :maxlength="item.taskFiledMaxsize" />
+            </div>
+          </template>
+        </div>
+      </div>
+    </template>
+  </div>
+</template>
+
+<script>
+import taskApi from '@/api/taskDetail/task';
+import commonApi from '@/api/taskDetail/common';
+import provinces from '@/util/lib/province';
+import citys from '@/util/lib/city';
+import areas from '@/util/lib/area';
+import request from '@/router/axios';
+
+export default {
+  name: 'index',
+  data() {
+    return {
+      baseUrl: process.env.VUE_APP_URL,
+      showImg: false, // 是否显示只展示图片，分享用到
+      taskInfo: {},
+      wmTaskContent: {},
+      taskTypeId: 0, // 任务类型id
+      configList: [], // 配置列表
+      dictList: [], //字典
+      imgTypeList: ['jpeg', 'jpg', 'png', 'git', 'bmp'] // 能查看的文件类型
+    };
+  },
+  props: {
+    id: {
+      type: String
+    }
+  },
+
+  methods: {
+    // 获取地址
+    getAddress(item) {
+      if (item.taskFiledType == 'area') {
+        let e = this.wmTaskContent[item.taskFiledKey];
+        if (!e) return '--';
+        let arr = e.split(',');
+        let provincesName = '';
+        let provincesIndex = '';
+        let cityName = '';
+        let cityIndex = '';
+        let areasName = '';
+        // 如果为数字，方形，不为数组则展示
+        var n = parseInt(arr[0]);
+        // 如果不为数字，则返回
+        if (isNaN(n)) {
+          return arr[0];
+        }
+        if (arr[0]) {
+          provinces.map((v, k) => {
+            if (v.value + '0000' == arr[0]) {
+              provincesName = v.label;
+              provincesIndex = k;
+            }
+          });
+        }
+        if (arr[1]) {
+          citys[provincesIndex].map((v, k) => {
+            if (v.value + '00' == arr[1]) {
+              cityName = v.label;
+              cityIndex = k;
+            }
+          });
+        }
+        if (arr[2]) {
+          areas[provincesIndex][cityIndex].map((v, k) => {
+            if (v.value == arr[2]) {
+              areasName = v.label;
+            }
+          });
+        }
+        return `${provincesName}-${cityName}-${areasName}`;
+      }
+    },
+    // 获取详情
+    getDesc(item) {
+      // 拜访类任务
+      const arr = ['51', '52', '53'];
+      if (arr.includes(item.taskTypeId) && item.taskFiledKey === 'temp24') {
+        return this.wmTaskContent['temp24label'];
+      }
+      // 获取需要转换的字符串（例如 '1,2,3'）
+      const contentValue = this.wmTaskContent[item.taskFiledKey];
+      if (!contentValue) return '--';
+      // 获取字典表对应数组
+      const itemList = this.dictList[item.dictGroupName] || [];
+      // 按逗号拆分成数组
+      const valueArray = contentValue.split(',');
+      // 将每个拆分值找到对应的 label
+      const result = valueArray.map((val) => {
+        const foundItem = itemList.find((dictItem) => dictItem.value === val);
+        return foundItem ? foundItem.label : null;
+      });
+      // 如果有任意一个值无法找到对应的 label，则直接返回 '--'
+      if (result.some((label) => label === null)) {
+        return '--';
+      }
+      // 否则，使用逗号拼接并返回
+      return result.join(',');
+    },
+
+    // 得出图片
+    // 得出图片
+    getImgList(urlStr, item) {
+      // 如果字段类型不是图片或没有 urlStr，则直接返回空数组
+      if (item.taskFiledType !== 'img' || !urlStr) return [[], []];
+
+      // 将字符串按逗号拆分为数组
+      const urlArr = urlStr.split(',');
+      // 如果拆分后为空，也返回空数组
+      if (!urlArr.length) return [[], []];
+
+      // 使用 reduce 一次性构建 imgList 和 previewList
+      const [imgList, previewList] = urlArr.reduce(
+        (acc, curUrl) => {
+          let [imgListAcc, previewListAcc] = acc;
+          let type = '无';
+          let newUrl = curUrl;
+
+          if (curUrl.includes(';1')) {
+            type = '拍照';
+            newUrl = curUrl.replace(';1', '');
+          } else if (curUrl.includes(';2')) {
+            type = '相册';
+            newUrl = curUrl.replace(';2', '');
+          }
+
+          const fullUrl = process.env.VUE_APP_URL + newUrl;
+          imgListAcc.push({ type, url: fullUrl });
+          previewListAcc.push(fullUrl);
+
+          return [imgListAcc, previewListAcc];
+        },
+        [[], []]
+      );
+
+      return [imgList, previewList];
+    },
+
+    // 得出文件 jsonStr: temp字符串
+    getFileList(jsonStr, item) {
+      if (item.taskFiledType !== 'fileurl') return '';
+      if (!jsonStr) return '';
+      const parseFileList = JSON.parse(jsonStr);
+      if (!parseFileList) return '';
+      let fileList = [];
+      parseFileList.forEach((fileItem) => {
+        fileList.push({
+          fileName: fileItem.fileName,
+          url: process.env.VUE_APP_URL + fileItem.url
+        });
+      });
+      item.fileList = parseFileList;
+      return '';
+    },
+    // 下载文件
+    downloadFn(item) {
+      request({
+        url: item.url,
+        method: 'get',
+        responseType: 'blob'
+      }).then((response) => {
+        // 处理返回的文件流
+        const blob = response.data;
+        const link = document.createElement('a');
+        link.href = URL.createObjectURL(blob);
+        link.download = item.fileName;
+        document.body.appendChild(link);
+        link.click();
+        window.setTimeout(function () {
+          URL.revokeObjectURL(blob);
+          document.body.removeChild(link);
+        }, 0);
+      });
+    },
+    // 获取任务详情
+    async getTaskInfoById(id) {
+      try {
+        const res = await taskApi.getTaskInfoById(id);
+        const { data } = res.data;
+        this.wmTaskContent = data.wmTaskContent;
+        this.taskInfo = data.taskInfo;
+        this.taskTypeId = data.taskType;
+        this.getTaskContentConfigByTaskTypeId(data.taskType);
+      } catch (e) {
+        console.log(e);
+      }
+    },
+    // 获取配置
+    async getTaskContentConfigByTaskTypeId(value) {
+      try {
+        let res = await commonApi.getTaskContentConfigByTaskTypeId(value);
+        let { config, dict } = res.data.data;
+        this.configList = config;
+        this.dictList = dict;
+        this.configList.forEach((item) => {
+          item.taskFiledType = item.taskFiledType.trim();
+          if (item.taskFiledType == 'img') {
+            let imgArr = this.getImgList(this.wmTaskContent[item.taskFiledKey], item);
+            item.imgList = imgArr[0];
+            item.previewList = imgArr[1];
+          }
+        });
+      } catch (e) {
+        console.log(e);
+      }
+      this.getMapAddress();
+      // uni.hideLoading();
+    },
+    getPreviewList(imgList, index) {
+      // 解决el-image大图预览定位图片不准确的问题
+      return imgList.slice(index).concat(imgList.slice(0, index));
+    }
+  },
+  mounted() {
+    this.getTaskInfoById(this.id);
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.field-box {
+  //display: flex;
+  padding: 0 20px 10px;
+  overflow: hidden;
+  .title-value {
+    //width: 50%;
+    float: left;
+  }
+  .desc-value {
+    float: left;
+  }
+  .upload-field {
+    .img-box {
+      padding-top: 10px;
+      display: flex;
+      flex-wrap: wrap;
+    }
+    .file-box {
+      .file-item {
+        padding: 2px 8px;
+        cursor: pointer;
+        &:hover {
+          background-color: #f5f7fa;
+          color: #2d8cf0;
+        }
+      }
+    }
+  }
+  .img-box-content {
+    padding-top: 15px;
+    position: relative;
+
+    .type {
+      font-size: 12px;
+      position: absolute;
+      top: -3px;
+    }
+  }
+  .img-item {
+    width: 100px;
+    height: 100px;
+    margin-right: 10px;
+  }
+  .longtext-box {
+    width: 50%;
+    .textarea-box {
+      margin-top: 10px !important;
+      width: 100%;
+    }
+  }
+}
+
+.sign-in-box {
+  padding: 10px 20px;
+}
+
+.detail-info {
+  ul {
+    list-style: none;
+    li {
+      span {
+        min-width: 80px;
+      }
+      display: flex;
+      margin-bottom: 5px;
+    }
+  }
+}
+</style>

src/views/serviceManagement/servicesToBeReviewed/index.vue

@@ -115,10 +115,12 @@
         <vxe-table-column field="skuName" title="关联产品名称" width="200"></vxe-table-column>
         <vxe-table-column field="provAbbr" title="执行包所属省份" width="130"></vxe-table-column>
         <vxe-table-column title="操作" fixed="right" width="130">
-          <div class="btns">
-            <el-button type="text">审核</el-button>
-            <el-button type="text">服务详情</el-button>
-          </div>
+          <template slot-scope="scope">
+            <div class="btns">
+              <el-button type="text" @click="reviewBtn(scope.row)">审核</el-button>
+              <el-button type="text" @click="serviceDetail(scope.row)">服务详情</el-button>
+            </div>
+          </template>
         </vxe-table-column>
       </vxe-table>
     </div>
@@ -132,6 +134,46 @@
       :layouts="['PrevJump', 'PrevPage', 'JumpNumber', 'NextPage', 'NextJump', 'Sizes', 'FullJump', 'Total']"
     >
     </vxe-pager>
+
+    <!-- 审核弹窗 -->
+
+    <el-dialog title="审核" :close-on-click-modal="false" :visible.sync="reviewDialog" top="12vh" width="50%" :before-close="handleClose" center>
+      <div class="reviewContent">
+        <div class="review-detail">
+          <div class="teskDetailsty">服务详情</div>
+          <TaskDetail :id="examineVal" />
+        </div>
+        <div class="teskDetailsty">审批意见</div>
+        <el-form :model="taskForm" :rules="rules" ref="taskForm" label-width="100px">
+          <el-form-item label="审批意见:" prop="taskStatus" class="formitem-box">
+            <el-radio-group v-model="taskForm.taskStatus">
+              <el-radio label="3">通过</el-radio>
+              <el-radio label="4">拒绝</el-radio>
+            </el-radio-group>
+          </el-form-item>
+
+          <el-form-item
+            label="意见说明:"
+            prop="taskStatusInfo"
+            class="formitem-box"
+            :rules="[
+              {
+                required: taskForm.taskStatus == 3 ? false : true,
+                message: '请输入审批说明',
+                trigger: 'blur'
+              }
+            ]"
+          >
+            <el-input type="textarea" v-model="taskForm.taskStatusInfo"></el-input>
+          </el-form-item>
+          <refuseReason @selectRefuseReason="selectRefuseReason" />
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+      </span>
+    </el-dialog>
   </basic-container>
 </template>
 
@@ -142,9 +184,11 @@ import { getDictType } from '@/api/common';
 import abbreviationsProvinces from '@/const/abbreviationsProvinces.js';
 import dayjs from 'dayjs';
 import { mapGetters } from 'vuex';
-import color from '@/mixins/color';
+import TaskDetail from './components/TaskDetail.vue';
+import refuseReason from '@/components/refuseReason';
 
 export default {
+  components: { TaskDetail, refuseReason, TaskDetail },
   data() {
     return {
       tableOptin,
@@ -179,7 +223,17 @@ export default {
         total: 0, // 总页数
         currentPage: 1, // 当前页数
         pageSize: 300 // 每页显示多少条
-      }
+      },
+      reviewDialog: false,
+      taskForm: {
+        taskStatus: '',
+        taskStatusInfo: ''
+      },
+      rules: {
+        taskStatus: [{ required: true, message: '请选择审批意见', trigger: 'change' }]
+      },
+      singleFlag: false,
+      examineVal: ''
     };
   },
   computed: {
@@ -324,6 +378,31 @@ export default {
       this.totalScore = records.reduce((pre, cur) => {
         return pre + (Number(cur.taskScore) || 0);
       }, 0);
+    },
+
+    selectRefuseReason(refuseReason) {
+      let info;
+      if (this.taskForm.taskStatusInfo) {
+        info = this.taskForm.taskStatusInfo + refuseReason + '；';
+      } else {
+        info = refuseReason + '；';
+      }
+
+      this.$set(this.taskForm, 'taskStatusInfo', info);
+    },
+    reviewBtn(row) {
+      console.log('row', row);
+      this.singleFlag = true;
+      this.examineVal = row.taskId;
+      this.reviewDialog = true;
+    },
+    handleClose() {},
+    serviceDetail(row) {
+      window.open(
+        Config.outsideUrl + '/h5/#/pages/task/task-detail/index?id=' + row.taskId,
+        'newwindow',
+        'height=500, width=400, top=200, left=300, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no'
+      );
     }
   }
 };
@@ -348,4 +427,14 @@ export default {
 .table {
   height: calc(100vh - 300px);
 }
+.teskDetailsty {
+  width: 100%;
+  height: 30px;
+  line-height: 30px;
+  font-size: 16px;
+  font-weight: 600;
+  color: #333333;
+  border-bottom: 1px solid #d7d6d5;
+  margin: 0 0 10px 0;
+}
 </style>