添加流程模板-流程节点-下拉选择、回显、提醒切换为单选按钮

src/api/wf/PROTEMPLATE.js

@@ -97,3 +97,13 @@ export function updatePro(data) {
     data: data
   })
 }
+
+// 获取用户列表
+export function getUser() {
+  return request({
+    url: '/test/user/list',
+    method: 'get',
+  })
+}
+
+

src/views/wf/index.vue

@@ -78,9 +78,13 @@
       <el-table-column label="流程编码" align="center" prop="procode" />
       <el-table-column label="流程名称" align="center" prop="proname">
         <template slot-scope="scope">
-          <button type="info" @click="showProname(scope.row.id)">
-            {{ scope.row.proname }}
-          </button>
+          <el-button
+            size="mini"
+            type="text"
+            @click="showProname(scope.row.id)"
+            v-hasPermi="['business:PROTEMPLATE:remove']"
+            >{{ scope.row.proname }}</el-button
+          >
         </template>
       </el-table-column>
       <el-table-column label="版本" align="center" prop="version" />
@@ -186,7 +190,7 @@
       </div>
     </el-dialog>
 
-    <!-- 添加或修改流程模板对话框 -->
+    <!-- 列出流程节点对话框 -->
     <el-dialog
       title="流程节点"
       :visible.sync="openProname"
@@ -201,10 +205,10 @@
             icon="el-icon-plus"
             size="mini"
             @click="handleProAdd"
+            v-hasPermi="['business:PRODEFACTION:add']"
             >新增</el-button
           >
         </el-col>
-        
       </el-row>
       <el-table :data="pronameform" style="width: 100%">
         <el-table-column prop="acname" label="节点名称"></el-table-column>
@@ -216,11 +220,27 @@
           prop="dealhours"
           label="办理期限 小时"
         ></el-table-column>
-        <el-table-column prop="exelIds" label="审核人"></el-table-column>
+        <el-table-column prop="exelIds" label="审核人">
+          <template slot-scope="scope">
+            {{ searchUserName(scope.row.exelIds) }}
+          </template>
+        </el-table-column>
         <el-table-column prop="parentnr" label="父级活动"></el-table-column>
         <el-table-column prop="proId" label="流程模板ID"></el-table-column>
-        <el-table-column prop="reemail" label="邮件提醒"></el-table-column>
-        <el-table-column prop="remessage" label="消息提醒"></el-table-column>
+        <el-table-column prop="reemail" label="邮件提醒">
+          <template slot-scope="scope">
+            <span v-if="scope.row.reemail == 1">提醒</span>
+            <span v-else-if="scope.row.reemail == 2">不提醒</span>
+            <span v-else>未知</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="remessage" label="消息提醒">
+          <template slot-scope="scope">
+            <span v-if="scope.row.remessage == 1">提醒</span>
+            <span v-else-if="scope.row.remessage == 2">不提醒</span>
+            <span v-else>未知</span>
+          </template>
+        </el-table-column>
         <el-table-column prop="seqno" label="活动顺序"></el-table-column>
         <el-table-column
           label="操作"
@@ -233,11 +253,13 @@
               type="text"
               icon="el-icon-edit"
               @click="handleProUpdate(scope.row)"
+              v-hasPermi="['business:PRODEFACTION:edit']"
               >修改</el-button
             >
             <el-popconfirm
               title="确定删除吗？"
               @confirm="handleProDelete(scope.row)"
+              v-hasPermi="['business:PRODEFACTION:remove']"
             >
               <el-button
                 slot="reference"
@@ -252,8 +274,13 @@
       </el-table>
     </el-dialog>
 
-     <!-- 添加或修改流程节点对话框 -->
-     <el-dialog :title="Protitle" :visible.sync="openProAddOrEdit" width="60%" append-to-body>
+    <!-- 添加或修改流程节点对话框 -->
+    <el-dialog
+      :title="Protitle"
+      :visible.sync="openProAddOrEdit"
+      width="60%"
+      append-to-body
+    >
       <el-form ref="form2" :model="Proform" label-width="140px">
         <el-form-item label="节点名称" prop="acname">
           <el-input
@@ -287,27 +314,24 @@
           />
         </el-form-item>
         <el-form-item label="审核人" prop="exelIds">
-          <el-input
-            v-model="Proform.exelIds"
-            placeholder="请输入审核人"
-            type="text"
-          />
+          <el-select v-model="selectValue" placeholder="请选择">
+            <el-option
+              v-for="item in this.user"
+              :key="item.value + 'exelIds'"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
         </el-form-item>
-   
-      
+
         <el-form-item label="邮件提醒" prop="reemail">
-          <el-input
-            v-model="Proform.reemail"
-            placeholder="请输入邮件提醒"
-            type="text"
-          />
+          <el-radio v-model="Proform.reemail" label="1">提醒</el-radio>
+          <el-radio v-model="Proform.reemail" label="2">不提醒</el-radio>
         </el-form-item>
         <el-form-item label="消息提醒" prop="remessage">
-          <el-input
-            v-model="Proform.remessage"
-            placeholder="请输入消息提醒"
-            type="text"
-          />
+          <el-radio v-model="Proform.remessage" label="1">提醒</el-radio>
+          <el-radio v-model="Proform.remessage" label="2">不提醒</el-radio>
         </el-form-item>
         <el-form-item label="活动顺序" prop="seqno">
           <el-input
@@ -337,12 +361,16 @@ import {
   getProInfo,
   addPro,
   updatePro,
+  getUser,
 } from "@/api/wf/PROTEMPLATE";
 
 export default {
   name: "PROTEMPLATE",
   data() {
     return {
+      selectValue: "",
+      //用户列表
+      user: [],
       pronameform: [],
       // 根路径
       baseURL: process.env.VUE_APP_BASE_API,
@@ -362,11 +390,11 @@ export default {
       PROTEMPLATEList: [],
       // 弹出层标题
       title: "",
-      Protitle:'',
+      Protitle: "",
       // 是否显示弹出层
       open: false,
       openProname: false,
-      openProAddOrEdit:false,
+      openProAddOrEdit: false,
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -389,7 +417,7 @@ export default {
       },
       // 表单参数
       form: {},
-      Proform:{},
+      Proform: {},
       // 表单校验
       rules: {
         id: [{ required: true, message: "$comment不能为空", trigger: "blur" }],
@@ -430,24 +458,31 @@ export default {
     this.getList();
   },
   methods: {
-    handleProAdd(){   //节点的新增
+    searchUserName(id) {
+      let fined = this.user.find((item) => item.value == id);
+      return fined.label
+    },
+    handleProAdd() {
+      //节点的新增
       this.reset();
-      this.openProAddOrEdit = true
-      this.Protitle = '新增节点'
-      this.Proform.proId = this.PROTEMPLATEID
+      this.openProAddOrEdit = true;
+      this.Protitle = "新增节点";
+      this.Proform.proId = this.PROTEMPLATEID;
     },
-    handleProUpdate(r) {  //节点的修改
+    handleProUpdate(r) {
+      //节点的修改
       this.reset();
-      this.openProAddOrEdit = true
-      getProInfo(r.id).then(res=>{
-      this.Protitle = '修改节点'
-      this.Proform = res.data
-      this.Proform.proId = this.PROTEMPLATEID
-      })
+      this.openProAddOrEdit = true;
+      getProInfo(r.id).then((res) => {
+        this.Protitle = "修改节点";
+        this.Proform = res.data;
+        this.Proform.proId = this.PROTEMPLATEID;
+        this.selectValue = Number(this.Proform.exelIds);
+      });
     },
     handleProDelete(r) {
       delPro(r.id).then((res) => {
-        this.showProname(r.proId)
+        this.showProname(r.proId);
       });
     },
     /** 查询流程模板列表 */
@@ -459,19 +494,31 @@ export default {
         this.loading = false;
       });
     },
+
+    //展示节点列表
     showProname(id) {
       this.openProname = true;
-      this.PROTEMPLATEID = id
-      
-      //获取流程节点
+      this.PROTEMPLATEID = id;
+
+      //获取流程节点列表
       getProcode(id).then((res) => {
         this.pronameform = res.rows;
       });
+
+      this.user = []; //获取并清空用户列表
+      getUser().then((res) => {
+        for (const i in res.data) {
+          this.user.push({
+            value: res.data[i].userId,
+            label: res.data[i].username,
+          });
+        }
+      });
     },
     // 取消按钮
     cancel() {
       this.open = false;
-      this.openProAddOrEdit = false
+      this.openProAddOrEdit = false;
       this.reset();
     },
     // 表单重置
@@ -491,20 +538,21 @@ export default {
       };
 
       this.Proform = {
-        acname:null,
-        approvaltype:null,
-        keyword:null,
-        seqno:null,
-        pronotes:null,
-        exelIds:null,
-        parentnr:null,
-        proId:null,
-        reemail:null,
-        remessage:null,
-        seqno:null,
-      }
+        acname: null,
+        approvaltype: null,
+        keyword: null,
+        seqno: null,
+        pronotes: null,
+        exelIds: null,
+        parentnr: null,
+        proId: null,
+        reemail: null,
+        remessage: null,
+        seqno: null,
+      };
       this.resetForm("form");
       this.resetForm("form2");
+      this.selectValue = "";
     },
     /** 搜索按钮操作 */
     handleQuery() {
@@ -561,17 +609,18 @@ export default {
     /** 提交按钮 流程节点*/
     submitForm2() {
       this.$refs["form2"].validate((valid) => {
+        this.Proform.exelIds = this.selectValue; //审核人
         if (valid) {
           if (this.Proform.id != null) {
             updatePro(this.Proform).then((response) => {
               this.$modal.msgSuccess("修改成功");
-              this.openProAddOrEdit = false
+              this.openProAddOrEdit = false;
               this.showProname(this.PROTEMPLATEID);
             });
           } else {
             addPro(this.Proform).then((response) => {
               this.$modal.msgSuccess("新增成功");
-              this.openProAddOrEdit = false
+              this.openProAddOrEdit = false;
               this.open = false;
               this.showProname(this.PROTEMPLATEID);
             });