From d734bfc34f65b6cd036b5f21b718294152fecacf Mon Sep 17 00:00:00 2001
From: RuoYi <yzz_ivy@163.com>
Date: 星期四, 17 二月 2022 11:56:11 +0800
Subject: [PATCH] 修复分页组件请求两次问题(I4SQOR)

---
 ruoyi-ui/src/views/system/dict/data.vue |  234 ++++++++++++++++++++++++++++++++++++++++++++-------------
 1 files changed, 179 insertions(+), 55 deletions(-)

diff --git a/ruoyi-ui/src/views/system/dict/data.vue b/ruoyi-ui/src/views/system/dict/data.vue
index 8c4db3f..c08c28a 100644
--- a/ruoyi-ui/src/views/system/dict/data.vue
+++ b/ruoyi-ui/src/views/system/dict/data.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
-    <el-form :inline="true">
-      <el-form-item label="瀛楀吀鍚嶇О">
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="瀛楀吀鍚嶇О" prop="dictType">
         <el-select v-model="queryParams.dictType" size="small">
           <el-option
             v-for="item in typeOptions"
@@ -11,7 +11,7 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="瀛楀吀鏍囩">
+      <el-form-item label="瀛楀吀鏍囩" prop="dictLabel">
         <el-input
           v-model="queryParams.dictLabel"
           placeholder="璇疯緭鍏ュ瓧鍏告爣绛�"
@@ -20,28 +20,93 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="鐘舵��">
+      <el-form-item label="鐘舵��" prop="status">
         <el-select v-model="queryParams.status" placeholder="鏁版嵁鐘舵��" clearable size="small">
           <el-option
-            v-for="dict in statusOptions"
-            :key="dict.dictValue"
-            :label="dict.dictLabel"
-            :value="dict.dictValue"
+            v-for="dict in dict.type.sys_normal_disable"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
           />
         </el-select>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鎼滅储</el-button>
-        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:dict:add']">鏂板</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button>
       </el-form-item>
     </el-form>
 
-    <el-table v-loading="loading" :data="dataList" style="width: 100%;">
+    <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="['system:dict: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="['system:dict: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="['system:dict:remove']"
+        >鍒犻櫎</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['system:dict:export']"
+        >瀵煎嚭</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-close"
+          size="mini"
+          @click="handleClose"
+        >鍏抽棴</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="瀛楀吀缂栫爜" align="center" prop="dictCode" />
-      <el-table-column label="瀛楀吀鏍囩" align="center" prop="dictLabel" />
+      <el-table-column label="瀛楀吀鏍囩" align="center" prop="dictLabel">
+        <template slot-scope="scope">
+          <span v-if="scope.row.listClass == '' || scope.row.listClass == 'default'">{{scope.row.dictLabel}}</span>
+          <el-tag v-else :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass">{{scope.row.dictLabel}}</el-tag>
+        </template>
+      </el-table-column>
       <el-table-column label="瀛楀吀閿��" align="center" prop="dictValue" />
       <el-table-column label="瀛楀吀鎺掑簭" align="center" prop="dictSort" />
-      <el-table-column label="鐘舵��" align="center" prop="status" :formatter="statusFormat" />
+      <el-table-column label="鐘舵��" align="center" prop="status">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
+        </template>
+      </el-table-column>
       <el-table-column label="澶囨敞" align="center" prop="remark" :show-overflow-tooltip="true" />
       <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="180">
         <template slot-scope="scope">
@@ -50,10 +115,10 @@
       </el-table-column>
       <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button 
-            size="mini" 
-            type="text" 
-            icon="el-icon-edit" 
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['system:dict:edit']"
           >淇敼</el-button>
@@ -77,7 +142,7 @@
     />
 
     <!-- 娣诲姞鎴栦慨鏀瑰弬鏁伴厤缃璇濇 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px">
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="瀛楀吀绫诲瀷">
           <el-input v-model="form.dictType" :disabled="true" />
@@ -88,16 +153,29 @@
         <el-form-item label="鏁版嵁閿��" prop="dictValue">
           <el-input v-model="form.dictValue" placeholder="璇疯緭鍏ユ暟鎹敭鍊�" />
         </el-form-item>
+        <el-form-item label="鏍峰紡灞炴��" prop="cssClass">
+          <el-input v-model="form.cssClass" placeholder="璇疯緭鍏ユ牱寮忓睘鎬�" />
+        </el-form-item>
         <el-form-item label="鏄剧ず鎺掑簭" prop="dictSort">
           <el-input-number v-model="form.dictSort" controls-position="right" :min="0" />
+        </el-form-item>
+        <el-form-item label="鍥炴樉鏍峰紡" prop="listClass">
+          <el-select v-model="form.listClass">
+            <el-option
+              v-for="item in listClassOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="鐘舵��" prop="status">
           <el-radio-group v-model="form.status">
             <el-radio
-              v-for="dict in statusOptions"
-              :key="dict.dictValue"
-              :label="dict.dictValue"
-            >{{dict.dictLabel}}</el-radio>
+              v-for="dict in dict.type.sys_normal_disable"
+              :key="dict.value"
+              :label="dict.value"
+            >{{dict.label}}</el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="澶囨敞" prop="remark">
@@ -117,20 +195,57 @@
 import { listType, getType } from "@/api/system/dict/type";
 
 export default {
+  name: "Data",
+  dicts: ['sys_normal_disable'],
   data() {
     return {
       // 閬僵灞�
       loading: true,
+      // 閫変腑鏁扮粍
+      ids: [],
+      // 闈炲崟涓鐢�
+      single: true,
+      // 闈炲涓鐢�
+      multiple: true,
+      // 鏄剧ず鎼滅储鏉′欢
+      showSearch: true,
       // 鎬绘潯鏁�
       total: 0,
       // 瀛楀吀琛ㄦ牸鏁版嵁
       dataList: [],
+      // 榛樿瀛楀吀绫诲瀷
+      defaultDictType: "",
       // 寮瑰嚭灞傛爣棰�
       title: "",
       // 鏄惁鏄剧ず寮瑰嚭灞�
       open: false,
-      // 鐘舵�佹暟鎹瓧鍏�
-      statusOptions: [],
+      // 鏁版嵁鏍囩鍥炴樉鏍峰紡
+      listClassOptions: [
+        {
+          value: "default",
+          label: "榛樿"
+        },
+        {
+          value: "primary",
+          label: "涓昏"
+        },
+        {
+          value: "success",
+          label: "鎴愬姛"
+        },
+        {
+          value: "info",
+          label: "淇℃伅"
+        },
+        {
+          value: "warning",
+          label: "璀﹀憡"
+        },
+        {
+          value: "danger",
+          label: "鍗遍櫓"
+        }
+      ],
       // 绫诲瀷鏁版嵁瀛楀吀
       typeOptions: [],
       // 鏌ヨ鍙傛暟
@@ -161,15 +276,13 @@
     const dictId = this.$route.params && this.$route.params.dictId;
     this.getType(dictId);
     this.getTypeList();
-    this.getDicts("sys_normal_disable").then(response => {
-      this.statusOptions = response.data;
-    });
   },
   methods: {
     /** 鏌ヨ瀛楀吀绫诲瀷璇︾粏 */
     getType(dictId) {
       getType(dictId).then(response => {
         this.queryParams.dictType = response.data.dictType;
+        this.defaultDictType = response.data.dictType;
         this.getList();
       });
     },
@@ -188,10 +301,6 @@
         this.loading = false;
       });
     },
-    // 鏁版嵁鐘舵�佸瓧鍏哥炕璇�
-    statusFormat(row, column) {
-      return this.selectDictLabel(this.statusOptions, row.status);
-    },
     // 鍙栨秷鎸夐挳
     cancel() {
       this.open = false;
@@ -203,6 +312,8 @@
         dictCode: undefined,
         dictLabel: undefined,
         dictValue: undefined,
+        cssClass: undefined,
+        listClass: 'default',
         dictSort: 0,
         status: "0",
         remark: undefined
@@ -214,6 +325,17 @@
       this.queryParams.pageNum = 1;
       this.getList();
     },
+    /** 杩斿洖鎸夐挳鎿嶄綔 */
+    handleClose() {
+      const obj = { path: "/system/dict" };
+      this.$tab.closeOpenPage(obj);
+    },
+    /** 閲嶇疆鎸夐挳鎿嶄綔 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.queryParams.dictType = this.defaultDictType;
+      this.handleQuery();
+    },
     /** 鏂板鎸夐挳鎿嶄綔 */
     handleAdd() {
       this.reset();
@@ -221,10 +343,17 @@
       this.title = "娣诲姞瀛楀吀鏁版嵁";
       this.form.dictType = this.queryParams.dictType;
     },
+    // 澶氶�夋閫変腑鏁版嵁
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.dictCode)
+      this.single = selection.length!=1
+      this.multiple = !selection.length
+    },
     /** 淇敼鎸夐挳鎿嶄綔 */
     handleUpdate(row) {
       this.reset();
-      getData(row.dictCode).then(response => {
+      const dictCode = row.dictCode || this.ids
+      getData(dictCode).then(response => {
         this.form = response.data;
         this.open = true;
         this.title = "淇敼瀛楀吀鏁版嵁";
@@ -236,23 +365,15 @@
         if (valid) {
           if (this.form.dictCode != undefined) {
             updateData(this.form).then(response => {
-              if (response.code === 200) {
-                this.msgSuccess("淇敼鎴愬姛");
-                this.open = false;
-                this.getList();
-              } else {
-                this.msgError(response.msg);
-              }
+              this.$modal.msgSuccess("淇敼鎴愬姛");
+              this.open = false;
+              this.getList();
             });
           } else {
             addData(this.form).then(response => {
-              if (response.code === 200) {
-                this.msgSuccess("鏂板鎴愬姛");
-                this.open = false;
-                this.getList();
-              } else {
-                this.msgError(response.msg);
-              }
+              this.$modal.msgSuccess("鏂板鎴愬姛");
+              this.open = false;
+              this.getList();
             });
           }
         }
@@ -260,16 +381,19 @@
     },
     /** 鍒犻櫎鎸夐挳鎿嶄綔 */
     handleDelete(row) {
-      this.$confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.dictLabel + '"鐨勬暟鎹」?', "璀﹀憡", {
-          confirmButtonText: "纭畾",
-          cancelButtonText: "鍙栨秷",
-          type: "warning"
-        }).then(function() {
-          return delData(row.dictCode);
-        }).then(() => {
-          this.getList();
-          this.msgSuccess("鍒犻櫎鎴愬姛");
-        }).catch(function() {});
+      const dictCodes = row.dictCode || this.ids;
+      this.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栫爜涓�"' + dictCodes + '"鐨勬暟鎹」锛�').then(function() {
+        return delData(dictCodes);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+      }).catch(() => {});
+    },
+    /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+    handleExport() {
+      this.download('system/dict/data/export', {
+        ...this.queryParams
+      }, `data_${new Date().getTime()}.xlsx`)
     }
   }
 };

--
Gitblit v1.9.3