纯正堂配置

src/views/sop/companySopRole/index.vue

@@ -1,86 +1,88 @@
 <template>
   <div class="app-container">
-<!--    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">-->
-<!--      <el-form-item label="销售公司" prop="companyId">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.companyId"-->
-<!--          placeholder="请输入销售公司"-->
-<!--          clearable-->
-<!--          size="small"-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="权限名称" prop="roleName">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.roleName"-->
-<!--          placeholder="请输入权限名称"-->
-<!--          clearable-->
-<!--          size="small"-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item>-->
-<!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
-<!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
-<!--      </el-form-item>-->
-<!--    </el-form>-->
+    <!--    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">-->
+    <!--      <el-form-item label="销售公司" prop="companyId">-->
+    <!--        <el-input-->
+    <!--          v-model="queryParams.companyId"-->
+    <!--          placeholder="请输入销售公司"-->
+    <!--          clearable-->
+    <!--          size="small"-->
+    <!--          @keyup.enter.native="handleQuery"-->
+    <!--        />-->
+    <!--      </el-form-item>-->
+    <!--      <el-form-item label="权限名称" prop="roleName">-->
+    <!--        <el-input-->
+    <!--          v-model="queryParams.roleName"-->
+    <!--          placeholder="请输入权限名称"-->
+    <!--          clearable-->
+    <!--          size="small"-->
+    <!--          @keyup.enter.native="handleQuery"-->
+    <!--        />-->
+    <!--      </el-form-item>-->
+    <!--      <el-form-item>-->
+    <!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
+    <!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
+    <!--      </el-form-item>-->
+    <!--    </el-form>-->
 
-<!--    <el-row :gutter="10" class="mb8">-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="primary"-->
-<!--          plain-->
-<!--          icon="el-icon-plus"-->
-<!--          size="mini"-->
-<!--          @click="handleAdd"-->
-<!--          v-hasPermi="['sop:companySopRole:add']"-->
-<!--        >新增</el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="success"-->
-<!--          plain-->
-<!--          icon="el-icon-edit"-->
-<!--          size="mini"-->
-<!--          :disabled="single"-->
-<!--          @click="handleUpdate"-->
-<!--          v-hasPermi="['sop:companySopRole:edit']"-->
-<!--        >修改</el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="danger"-->
-<!--          plain-->
-<!--          icon="el-icon-delete"-->
-<!--          size="mini"-->
-<!--          :disabled="multiple"-->
-<!--          @click="handleDelete"-->
-<!--          v-hasPermi="['sop:companySopRole:remove']"-->
-<!--        >删除</el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="warning"-->
-<!--          plain-->
-<!--          icon="el-icon-download"-->
-<!--          size="mini"-->
-<!--          :loading="exportLoading"-->
-<!--          @click="handleExport"-->
-<!--          v-hasPermi="['sop:companySopRole:export']"-->
-<!--        >导出</el-button>-->
-<!--      </el-col>-->
-<!--    </el-row>-->
+    <!--    <el-row :gutter="10" class="mb8">-->
+    <!--      <el-col :span="1.5">-->
+    <!--        <el-button-->
+    <!--          type="primary"-->
+    <!--          plain-->
+    <!--          icon="el-icon-plus"-->
+    <!--          size="mini"-->
+    <!--          @click="handleAdd"-->
+    <!--          v-hasPermi="['sop:companySopRole:add']"-->
+    <!--        >新增</el-button>-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="1.5">-->
+    <!--        <el-button-->
+    <!--          type="success"-->
+    <!--          plain-->
+    <!--          icon="el-icon-edit"-->
+    <!--          size="mini"-->
+    <!--          :disabled="single"-->
+    <!--          @click="handleUpdate"-->
+    <!--          v-hasPermi="['sop:companySopRole:edit']"-->
+    <!--        >修改</el-button>-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="1.5">-->
+    <!--        <el-button-->
+    <!--          type="danger"-->
+    <!--          plain-->
+    <!--          icon="el-icon-delete"-->
+    <!--          size="mini"-->
+    <!--          :disabled="multiple"-->
+    <!--          @click="handleDelete"-->
+    <!--          v-hasPermi="['sop:companySopRole:remove']"-->
+    <!--        >删除</el-button>-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="1.5">-->
+    <!--        <el-button-->
+    <!--          type="warning"-->
+    <!--          plain-->
+    <!--          icon="el-icon-download"-->
+    <!--          size="mini"-->
+    <!--          :loading="exportLoading"-->
+    <!--          @click="handleExport"-->
+    <!--          v-hasPermi="['sop:companySopRole:export']"-->
+    <!--        >导出</el-button>-->
+    <!--      </el-col>-->
+    <!--    </el-row>-->
 
     <el-table border v-loading="loading" :data="companySopRoleList">
       <el-table-column label="销售公司" align="center" prop="companyId">
         <template slot-scope="scope">
-          <el-tag v-for="item in companyList" v-if="item.companyId == scope.row.companyId"> {{scope.row.companyName}}</el-tag>
+          <el-tag v-for="item in companyList" v-if="item.companyId == scope.row.companyId">
+            {{ scope.row.companyName }}
+          </el-tag>
         </template>
       </el-table-column>
       <el-table-column label="权限" align="center">
         <template slot-scope="scope">
           <div style="display: flex;flex-flow: wrap;justify-content: flex-start;">
-            <el-tag style="width: 30%;margin: 0 5px" v-for="item in scope.row.rules">{{roleMap[item]}}</el-tag>
+            <el-tag style="width: 30%;margin: 0 5px" v-for="item in scope.row.rules">{{ roleMap[item] }}</el-tag>
           </div>
         </template>
       </el-table-column>
@@ -92,7 +94,8 @@
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['sop:companySopRole:edit']"
-          >修改</el-button>
+          >修改
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -109,7 +112,7 @@
     <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="销售公司" prop="companyId">
-          <el-select filterable  v-model="form.companyId" placeholder="请选择公司名" size="small">
+          <el-select filterable v-model="form.companyId" placeholder="请选择公司名" size="small">
             <el-option
               v-for="item in companyList"
               :key="item.companyId"
@@ -121,7 +124,9 @@
         <el-form-item label="权限" prop="rules">
           <div style="margin: 15px 0;"></div>
           <el-checkbox-group v-model="form.rules" style="display: flex;flex-flow: wrap;justify-content: flex-start;">
-            <el-checkbox style="width: 28%" v-for="item in roleOptions" :label="item.dictValue" :key="item.dictValue">{{item.dictLabel}}</el-checkbox>
+            <el-checkbox style="width: 28%" v-for="item in roleOptions" :label="item.dictValue" :key="item.dictValue">
+              {{ item.dictLabel }}
+            </el-checkbox>
           </el-checkbox-group>
         </el-form-item>
       </el-form>
@@ -134,11 +139,18 @@
 </template>
 
 <script>
-import { listCompanySopRole, getCompanySopRole, delCompanySopRole, addCompanySopRole, updateCompanySopRole, exportCompanySopRole } from "@/api/sop/companySopRole";
-import { getCompanyList } from "@/api/company/company";
+import {
+  listCompanySopRole,
+  getCompanySopRole,
+  delCompanySopRole,
+  addCompanySopRole,
+  updateCompanySopRole,
+  exportCompanySopRole
+} from '@/api/sop/companySopRole'
+import { getCompanyList } from '@/api/company/company'
 
 export default {
-  name: "CompanySopRole",
+  name: 'CompanySopRole',
   data() {
     return {
       // 遮罩层
@@ -160,7 +172,7 @@ export default {
       roleOptions: [],
       roleMap: [],
       // 弹出层标题
-      title: "",
+      title: '',
       // 是否显示弹出层
       open: false,
       companyList: [],
@@ -170,43 +182,42 @@ export default {
         pageSize: 10,
         companyId: null,
         roleName: null,
-        roleValue: null,
+        roleValue: null
       },
       // 表单参数
       form: {},
       // 表单校验
-      rules: {
-      }
-    };
+      rules: {}
+    }
   },
   created() {
-    this.getList();
-    this.getDicts("company_sop_role").then(response => {
-      this.roleOptions = response.data;
+    this.getList()
+    this.getDicts('company_sop_role').then(response => {
+      this.roleOptions = response.data
       this.roleMap = response.data.reduce((obj, item) => {
-        obj[item.dictValue] = item.dictLabel;
-        return obj;
-      }, {});
-    });
+        obj[item.dictValue] = item.dictLabel
+        return obj
+      }, {})
+    })
     getCompanyList().then(response => {
-      this.companyList = response.data;
-    });
+      this.companyList = response.data
+    })
   },
   methods: {
     /** 查询公司SOP权限列表 */
     getList() {
-      this.loading = true;
+      this.loading = true
       listCompanySopRole(this.queryParams).then(response => {
         console.info(response.rows)
-        this.companySopRoleList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
+        this.companySopRoleList = response.rows
+        this.total = response.total
+        this.loading = false
+      })
     },
     // 取消按钮
     cancel() {
-      this.open = false;
-      this.reset();
+      this.open = false
+      this.reset()
     },
     // 表单重置
     reset() {
@@ -221,90 +232,84 @@ export default {
         updateTime: null,
         rules: this.roleOptions.map(e => e.dictValue),
         remark: null
-      };
-      this.resetForm("form");
+      }
+      this.resetForm('form')
     },
     /** 搜索按钮操作 */
     handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
+      this.queryParams.pageNum = 1
+      this.getList()
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
+      this.resetForm('queryForm')
+      this.handleQuery()
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 新增按钮操作 */
     handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加公司SOP权限";
+      this.reset()
+      this.open = true
+      this.title = '添加公司SOP权限'
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      this.reset();
-      if(row.rules && row.rules.length > 0){
-        this.form.rules = row.rules;
+      this.reset()
+      if (row.rules && row.rules.length > 0) {
+        this.form.rules = row.rules
       }
-      this.form.companyId = row.companyId;
-      this.open = true;
-      this.title = "修改公司SOP权限";
+      this.form.companyId = row.companyId
+      this.open = true
+      this.title = '修改公司SOP权限'
     },
     /** 提交按钮 */
     submitForm() {
-      this.$refs["form"].validate(valid => {
+      this.$refs['form'].validate(valid => {
         if (valid) {
-          if (this.form.id != null) {
-            updateCompanySopRole(this.form).then(response => {
-              this.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addCompanySopRole(this.form).then(response => {
-              this.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
+          updateCompanySopRole(this.form).then(response => {
+            this.msgSuccess('修改成功')
+            this.open = false
+            this.getList()
+          })
         }
-      });
+      })
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      const ids = row.id || this.ids;
-      this.$confirm('是否确认删除公司SOP权限编号为"' + ids + '"的数据项?', "警告", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        }).then(function() {
-          return delCompanySopRole(ids);
-        }).then(() => {
-          this.getList();
-          this.msgSuccess("删除成功");
-        }).catch(() => {});
+      const ids = row.id || this.ids
+      this.$confirm('是否确认删除公司SOP权限编号为"' + ids + '"的数据项?', '警告', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(function() {
+        return delCompanySopRole(ids)
+      }).then(() => {
+        this.getList()
+        this.msgSuccess('删除成功')
+      }).catch(() => {
+      })
     },
     /** 导出按钮操作 */
     handleExport() {
-      const queryParams = this.queryParams;
-      this.$confirm('是否确认导出所有公司SOP权限数据项?', "警告", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        }).then(() => {
-          this.exportLoading = true;
-          return exportCompanySopRole(queryParams);
-        }).then(response => {
-          this.download(response.msg);
-          this.exportLoading = false;
-        }).catch(() => {});
-    },
+      const queryParams = this.queryParams
+      this.$confirm('是否确认导出所有公司SOP权限数据项?', '警告', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.exportLoading = true
+        return exportCompanySopRole(queryParams)
+      }).then(response => {
+        this.download(response.msg)
+        this.exportLoading = false
+      }).catch(() => {
+      })
+    }
   }
-};
+}
 </script>