目标管理-增加查看按钮。

src/views/business/spd/target/targetMk/index.vue

@@ -6,61 +6,35 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-form-item label="单据状态" prop="status">
-                <el-select
-                  size="mini"
-                  v-model="queryParams.status"
-                  clearable
-                >
-                  <el-option
-                    v-for="dict in dict.type.sys_status"
-                    :key="dict.value"
-                    :label="dict.label"
-                    :value="dict.value"
-                  ></el-option>
+                <el-select size="mini" v-model="queryParams.status" clearable>
+                  <el-option v-for="dict in dict.type.sys_status" :key="dict.value" :label="dict.label"
+                    :value="dict.value"></el-option>
                 </el-select>
               </el-form-item>
             </el-col>
             <el-col :span="1.5">
               <el-form-item label="单据编号">
-                <el-input
-                  v-model="queryParams.code"
-                  size="mini"
-                  clearable
-                  style="width: 200px"
-                />
+                <el-input v-model="queryParams.code" size="mini" clearable style="width: 200px" />
               </el-form-item>
             </el-col>
             <el-col :span="1.5">
               <el-form-item label="目标名称">
-                <el-input
-                  v-model="queryParams.name"
-                  size="mini"
-                  clearable
-                  style="width: 200px"
-                />
+                <el-input v-model="queryParams.name" size="mini" clearable style="width: 200px" />
               </el-form-item>
             </el-col>
             <el-col :span="1.5">
               <el-form-item label="单据日期">
-                <el-date-picker
-                  size="mini"
-                  v-model="dateRange"
-                  style="width: 240px"
-                  value-format="yyyy-MM-dd"
-                  type="daterange"
-                  range-separator="-"
-                  start-placeholder="开始"
-                  end-placeholder="结束"
-                ></el-date-picker>
+                <el-date-picker size="mini" v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd"
+                  type="daterange" range-separator="-" start-placeholder="开始" end-placeholder="结束"></el-date-picker>
               </el-form-item>
             </el-col>
             <el-col :span="1.5">
               <el-form-item label="模板" prop="template">
-                <dr-popover-select size="mini" v-model="queryParams.templateName" title="模板" type="MK_TARGET_TEMPLATE_PARAM" :dataMapping="{
+                <dr-popover-select size="mini" v-model="queryParams.templateName" title="模板"
+                  type="MK_TARGET_TEMPLATE_PARAM" :dataMapping="{
                     template: 'id',
                     templateName: 'name',
-                  }" :source.sync="queryParams"
-                >
+                  }" :source.sync="queryParams">
                 </dr-popover-select>
               </el-form-item>
             </el-col>
@@ -93,59 +67,48 @@
           </el-row>
           <CollapseTransition>
             <div v-show="expanded">
-              
+
             </div>
           </CollapseTransition>
         </el-form>
-        <el-divider class="lines"><i style="cursor: pointer;" :class="expanded?'el-icon-arrow-up':'el-icon-arrow-down'" @click="drop"></i></el-divider>
-      
+        <el-divider class="lines"><i style="cursor: pointer;" :class="expanded?'el-icon-arrow-up':'el-icon-arrow-down'"
+            @click="drop"></i></el-divider>
+
         <div class="btn_grooup">
           <el-button type="primary" size="mini" @click="useAdd">新增</el-button>
           <!-- <TemplateDownload/>
           <el-button type="primary" size="mini" @click="useUpload">导入</el-button> -->
         </div>
 
-        <el-table 
-          v-loading="loading"
-          :data="tableList"
-          @selection-change="useSelectionRow"
-          @row-dblclick="useDoubleClick"
-          height="600px"
-          v-horizontal-scroll
-        >
-          <el-table-column label="序号" type="index" width="50" align="center" fixed/>
-          <el-table-column show-overflow-tooltip label="单据编号" align="center" width="200" prop="code"/>
-          <el-table-column show-overflow-tooltip label="单据日期" align="center" width="200" prop="date"/>
-          <el-table-column show-overflow-tooltip label="目标名称" align="center" width="200" prop="name"/>
+        <el-table v-loading="loading" :data="tableList" @selection-change="useSelectionRow"
+          @row-dblclick="useDoubleClick" height="600px" v-horizontal-scroll>
+          <el-table-column label="序号" type="index" width="50" align="center" fixed />
+          <el-table-column show-overflow-tooltip label="单据编号" align="center" width="200" prop="code" />
+          <el-table-column show-overflow-tooltip label="单据日期" align="center" width="200" prop="date" />
+          <el-table-column show-overflow-tooltip label="目标名称" align="center" width="200" prop="name" />
           <el-table-column show-overflow-tooltip label="状态" align="center" width="200" prop="status">
             <template slot-scope="scope">
-              <dict-tag
-                :options="dict.type.sys_status"
-                :value="scope.row.status"
-              />
+              <dict-tag :options="dict.type.sys_status" :value="scope.row.status" />
             </template>
           </el-table-column>
-          <el-table-column show-overflow-tooltip label="年度" align="center" width="200" prop="templateData.year"/>
-          <el-table-column show-overflow-tooltip label="模板" align="center" width="200" prop="templateData.name"/>
-          <el-table-column show-overflow-tooltip label="开始日期" align="center" width="200" prop="templateData.startTime" />
-          <el-table-column show-overflow-tooltip label="结束日期" align="center" width="200" prop="templateData.deadlineTime" />
+          <el-table-column show-overflow-tooltip label="年度" align="center" width="200" prop="templateData.year" />
+          <el-table-column show-overflow-tooltip label="模板" align="center" width="200" prop="templateData.name" />
+          <el-table-column show-overflow-tooltip label="开始日期" align="center" width="200"
+            prop="templateData.startTime" />
+          <el-table-column show-overflow-tooltip label="结束日期" align="center" width="200"
+            prop="templateData.deadlineTime" />
           <el-table-column show-overflow-tooltip label="周期" align="center" width="200" prop="templateData.cycle">
             <template slot-scope="scope">
-              <dict-tag
-                :options="dict.type.mk_periodic_unit"
-                :value="scope.row.templateData.cycle"
-              />
+              <dict-tag :options="dict.type.mk_periodic_unit" :value="scope.row.templateData.cycle" />
             </template>
           </el-table-column>
-          <el-table-column show-overflow-tooltip label="维度" align="center" min-width="200" prop="templateData.dimensionalitys">
+          <el-table-column show-overflow-tooltip label="维度" align="center" min-width="200"
+            prop="templateData.dimensionalitys">
             <template slot-scope="scope">
               <div style="display:flex;">
                 <span v-for="o in scope.row.templateData.dimensionalitys">
-                  <dict-tag
-                    :options="dict.type.mk_dimensionality"
-                    :value="o.dimensionality"
-                    />
-                  </span>
+                  <dict-tag :options="dict.type.mk_dimensionality" :value="o.dimensionality" />
+                </span>
               </div>
             </template>
           </el-table-column>
@@ -153,10 +116,7 @@
             <template slot-scope="scope">
               <div style="display:flex;">
                 <span v-for="o in scope.row.templateData.indexs">
-                  <dict-tag
-                    :options="dict.type.mk_index_type"
-                    :value="o.target"
-                  />
+                  <dict-tag :options="dict.type.mk_index_type" :value="o.target" />
                 </span>
               </div>
             </template>
@@ -167,221 +127,235 @@
           <el-table-column show-overflow-tooltip label="修改时间" align="center" width="200" prop="updateTime" />
           <el-table-column fixed="right" label="操作" align="center" width="150">
             <template slot-scope="scope">
-              <div v-if="scope.row.status == '0' || scope.row.status == '3'">
-                <el-button type="text" size="mini" @click="useSubmit(scope.row)">提交</el-button>
-                <el-button type="text" size="mini" @click="useEdit(scope.row)">编辑</el-button>
-                <el-button type="text" size="mini" @click="useDel(scope.row)">删除</el-button>
-              </div>
-              <div v-if="scope.row.status == '1'">
-                <el-button type="text" size="mini" @click="useRevocation(scope.row)">收回</el-button>
-              </div>
+              <el-button size="mini" type="text" @click="useDoubleClick(scope.row)">查看
+              </el-button>
+              <el-button v-if="scope.row.status == '0' || scope.row.status == '3'" type="text" size="mini"
+                @click="useSubmit(scope.row)">提交</el-button>
+              <el-button v-if="scope.row.status == '0' || scope.row.status == '3'" type="text" size="mini"
+                @click="useEdit(scope.row)">编辑</el-button>
+              <el-button v-if="scope.row.status == '0' || scope.row.status == '3'" type="text" size="mini"
+                @click="useDel(scope.row)">删除</el-button>
+              <el-button v-if="scope.row.status == '1'" type="text" size="mini" @click="useRevocation(scope.row)">收回
+              </el-button>
             </template>
           </el-table-column>
         </el-table>
 
-        <el-pagination
-          background
-          @size-change="useChangePageSize"
-          @current-change="useCurrentChange"
-          :current-page="queryParams.pageNum"
-          :page-sizes="[10, 20, 50, 100]"
-          :page-size="10"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total=total>
+        <el-pagination background @size-change="useChangePageSize" @current-change="useCurrentChange"
+          :current-page="queryParams.pageNum" :page-sizes="[10, 20, 50, 100]" :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper" :total=total>
         </el-pagination>
       </el-card>
     </div>
-    <Add v-model="isList" v-if="!isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="useSearch"/>
+    <Add v-model="isList" v-if="!isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="useSearch" />
   </div>
 </template>
 
 <script>
-import Add from './add.vue'
-import TemplateDownload from './templateDownload.vue'
-import CollapseTransition from '@/components/MyCollapse/collapse.vue'
-import { listTarget,delTarget,submitTarget } from "@/api/business/spd/starget/target";
-import { rebacktWork } from '@/api/purchase/workSpace.js'
-export default {
-  name: 'target',
-  dicts: [
-    "sys_status","mk_periodic_unit","mk_dimensionality","mk_index_type",'oa_templete_id'
-  ],
-  components: { Add,TemplateDownload,CollapseTransition},
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      expanded: false,
-      // 页面配置
-      isList: true,
-      // 页面状态
-      page: '',
-      // 搜索框参数
-      queryParams: {
-        status: '',
-        code: '',
-        name: '',
-        template:'',
-        templateName:'',
-        year:'',
-        pageNum: 1,
-        pageSize: 10
-      },
-      // 查询日期范围
-      dateRange: [],
-      //总条数
-      total: 0,
-      //列表数据
-      tableList:[],
-      disable: false,
-      rowDetail:{},
-      openTemplateDownload:false,
-    }
-  },
-  created() {
-    this.getList(this.queryParams)
-  },
-  methods: {
-    //新增
-    useAdd(){
-      this.isList = false
-      this.page = 'add'
-      this.disable = false
+  import Add from './add.vue'
+  import TemplateDownload from './templateDownload.vue'
+  import CollapseTransition from '@/components/MyCollapse/collapse.vue'
+  import {
+    listTarget,
+    delTarget,
+    submitTarget
+  } from "@/api/business/spd/starget/target";
+  import {
+    rebacktWork
+  } from '@/api/purchase/workSpace.js'
+  export default {
+    name: 'target',
+    dicts: [
+      "sys_status", "mk_periodic_unit", "mk_dimensionality", "mk_index_type", 'oa_templete_id'
+    ],
+    components: {
+      Add,
+      TemplateDownload,
+      CollapseTransition
     },
-    //提交
-    async useSubmit(row){
-      this.$modal.loading("提交中...");
-      try {
-        const {msg, code} = await submitTarget(row.id);
-        if (code === 200) {
-          this.$modal.notifySuccess("提交成功");
-          this.$modal.closeLoading();
-          row.status = '1'
-          // this.getList(this.queryParams)
-        }
-      }catch (err) {
-        console.error(err);
-        this.$modal.closeLoading();
+    data() {
+      return {
+        // 遮罩层
+        loading: true,
+        expanded: false,
+        // 页面配置
+        isList: true,
+        // 页面状态
+        page: '',
+        // 搜索框参数
+        queryParams: {
+          status: '',
+          code: '',
+          name: '',
+          template: '',
+          templateName: '',
+          year: '',
+          pageNum: 1,
+          pageSize: 10
+        },
+        // 查询日期范围
+        dateRange: [],
+        //总条数
+        total: 0,
+        //列表数据
+        tableList: [],
+        disable: false,
+        rowDetail: {},
+        openTemplateDownload: false,
       }
     },
-    //撤回
-    useRevocation(row){
-      this.$modal.loading("收回中...");
-      let params = {
-        billCode: row.code, 
-        fdId: row.flowId, 
-        fdTemplateId: this.dict.type.oa_templete_id.find(item => {
-          return item.label == "营销目标"
-        }).value,
-        billMaker: row.createBy 
-      }
-      rebacktWork(params).then(res => {
-        if (res.code === 200) {
-          this.$modal.notifySuccess("收回成功");
+    created() {
+      this.getList(this.queryParams)
+    },
+    methods: {
+      //新增
+      useAdd() {
+        this.isList = false
+        this.page = 'add'
+        this.disable = false
+      },
+      //提交
+      async useSubmit(row) {
+        this.$modal.loading("提交中...");
+        try {
+          const {
+            msg,
+            code
+          } = await submitTarget(row.id);
+          if (code === 200) {
+            this.$modal.notifySuccess("提交成功");
+            this.$modal.closeLoading();
+            row.status = '1'
+            // this.getList(this.queryParams)
+          }
+        } catch (err) {
+          console.error(err);
           this.$modal.closeLoading();
-          row.status = '0'
-          // this.getList(this.queryParams)
         }
-      }).catch(err => {
-        this.$modal.closeLoading();
-      })
-    },
-    //修改
-    useEdit(row){
-      this.isList = false
-      this.page = 'edit'
-      this.rowDetail = row
-      this.disable = false
-    },
-    //删除
-    useDel(row){
-      this.$modal.confirm('确认删除选择数据').then(() => {
-        delTarget(row.id).then(res => {
+      },
+      //撤回
+      useRevocation(row) {
+        this.$modal.loading("收回中...");
+        let params = {
+          billCode: row.code,
+          fdId: row.flowId,
+          fdTemplateId: this.dict.type.oa_templete_id.find(item => {
+            return item.label == "营销目标"
+          }).value,
+          billMaker: row.createBy
+        }
+        rebacktWork(params).then(res => {
           if (res.code === 200) {
-            this.$modal.msgSuccess("删除成功");
-            this.getList(this.queryParams)
+            this.$modal.notifySuccess("收回成功");
+            this.$modal.closeLoading();
+            row.status = '0'
+            // this.getList(this.queryParams)
           }
+        }).catch(err => {
+          this.$modal.closeLoading();
         })
-      }).catch(() => {})
-    },
-    //查看
-    useSee(){
+      },
+      //修改
+      useEdit(row) {
+        this.isList = false
+        this.page = 'edit'
+        this.rowDetail = row
+        this.disable = false
+      },
+      //删除
+      useDel(row) {
+        this.$modal.confirm('确认删除选择数据').then(() => {
+          delTarget(row.id).then(res => {
+            if (res.code === 200) {
+              this.$modal.msgSuccess("删除成功");
+              this.getList(this.queryParams)
+            }
+          })
+        }).catch(() => {})
+      },
+      //查看
+      useSee() {
 
-    },
-    //选择列
-    useSelectionRow(){
+      },
+      //选择列
+      useSelectionRow() {
 
-    },
-    //双击
-    useDoubleClick(row){
-      this.isList = false
-      this.page = 'see'
-      this.rowDetail = row
-      this.disable = false
-    },
-    //改变一页显示条数
-    useChangePageSize(val){
-      this.queryParams.pageSize = val
-      this.getList(this.queryParams)
-    },
-    //翻页
-    useCurrentChange(val){
-      this.queryParams.pageNum = val
-      this.getList(this.queryParams)
-    },
-    //搜索
-    useSearch() {
-      this.getList(this.queryParams)
-    },
-    //重置
-    useReset(){
-      this.dateRange = [];
-      this.queryParams = {
-        code: '',
-        name: '',
-        template:'',
-        templateName:'',
-        year:'',
-        pageNum: 1,
-        pageSize: 10
-      }
-      this.getList(this.queryParams)
-    },
-    //查询列表
-    getList(params){
-      this.loading = true;
-      listTarget(this.addDateRange(params, this.dateRange)).then(res => {
-        if (res.code === 200) {
-          this.tableList = res.rows;
-          this.total = res.total;
-          this.loading = false;
+      },
+      //双击
+      useDoubleClick(row) {
+        this.isList = false
+        this.page = 'see'
+        this.rowDetail = row
+        this.disable = false
+      },
+      //改变一页显示条数
+      useChangePageSize(val) {
+        this.queryParams.pageSize = val
+        this.getList(this.queryParams)
+      },
+      //翻页
+      useCurrentChange(val) {
+        this.queryParams.pageNum = val
+        this.getList(this.queryParams)
+      },
+      //搜索
+      useSearch() {
+        this.getList(this.queryParams)
+      },
+      //重置
+      useReset() {
+        this.dateRange = [];
+        this.queryParams = {
+          code: '',
+          name: '',
+          template: '',
+          templateName: '',
+          year: '',
+          pageNum: 1,
+          pageSize: 10
         }
-      })
-    },
-    drop() {
-      this.expanded = !this.expanded
-    },
-  }
-};
+        this.getList(this.queryParams)
+      },
+      //查询列表
+      getList(params) {
+        this.loading = true;
+        listTarget(this.addDateRange(params, this.dateRange)).then(res => {
+          if (res.code === 200) {
+            this.tableList = res.rows;
+            this.total = res.total;
+            this.loading = false;
+          }
+        })
+      },
+      drop() {
+        this.expanded = !this.expanded
+      },
+    }
+  };
+
 </script>
 
 <style lang="scss" scoped>
-#deliveryAddressList {
-  height: calc(100vh - 84px);
-  padding: 12px;
-  box-sizing: border-box;
-  overflow-y: scroll;
-}
-.btn_grooup {
-  margin-bottom: 10px;
-  display: flex;
-  justify-content: flex-end;
-}
-.lines {
-  margin-top: 0;
-}
-.el-pagination {
-  margin-top: 10px;
-  text-align: right;
-}
+  #deliveryAddressList {
+    height: calc(100vh - 84px);
+    padding: 12px;
+    box-sizing: border-box;
+    overflow-y: scroll;
+  }
+
+  .btn_grooup {
+    margin-bottom: 10px;
+    display: flex;
+    justify-content: flex-end;
+  }
+
+  .lines {
+    margin-top: 0;
+  }
+
+  .el-pagination {
+    margin-top: 10px;
+    text-align: right;
+  }
+
 </style>