From e3f49adba47498466684325b8a897de585738c55 Mon Sep 17 00:00:00 2001
From: shikeying <pxzsky@163.com>
Date: 星期一, 17 四月 2023 09:15:56 +0800
Subject: [PATCH] 参数配置功能，使用table组件
---
src/views/system/config/index.vue | 342 ++++++++++++++------------------------------------------
1 files changed, 89 insertions(+), 253 deletions(-)
diff --git a/src/views/system/config/index.vue b/src/views/system/config/index.vue
index 07646b4..d09a315 100644
--- a/src/views/system/config/index.vue
+++ b/src/views/system/config/index.vue
@@ -1,199 +1,75 @@
<template>
- <div class="app-container">
- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
- <el-form-item label="鍙傛暟鍚嶇О" prop="configName">
- <el-input
- v-model="queryParams.configName"
- placeholder="璇疯緭鍏ュ弬鏁板悕绉�"
- clearable
- style="width: 240px"
- @keyup.enter.native="handleQuery"
- />
- </el-form-item>
- <el-form-item label="鍙傛暟閿悕" prop="configKey">
- <el-input
- v-model="queryParams.configKey"
- placeholder="璇疯緭鍏ュ弬鏁� KEY"
- clearable
- style="width: 240px"
- @keyup.enter.native="handleQuery"
- />
- </el-form-item>
- <el-form-item label="绯荤粺鍐呯疆" prop="configType">
- <el-select v-model="queryParams.configType" placeholder="绯荤粺鍐呯疆" clearable>
- <el-option
- v-for="dict in dict.type.sys_yes_no"
- :key="dict.value"
- :label="dict.label"
- :value="dict.value"
- />
- </el-select>
- </el-form-item>
-<!-- <el-form-item label="鍒涘缓鏃堕棿">-->
-<!-- <el-date-picker-->
-<!-- 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-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>
+ <div class="app-main">
+ <div class="base-container">
+ <el-card shadow="never" class="box-card">
+ <!--鎼滅储鏉′欢-->
+ <div class="filter-container">
+ <el-form :inline="true" :model="filterFrom" size="small">
+ <el-form-item label="鍙傛暟鍚嶇О">
+ <el-input v-model="filterFrom.configName" placeholder="璇疯緭鍏�'鍙傛暟鍚嶇О'" clearable />
+ </el-form-item>
+ <el-form-item label="鍙傛暟鏍囪瘑">
+ <el-input v-model="filterFrom.configKey" placeholder="璇疯緭鍏�'鍙傛暟KEY'" clearable />
+ </el-form-item>
+<!-- <el-form-item label="鍙戣捣鏃堕棿">-->
+<!-- <el-date-picker v-model="filterFrom.startTime" type="date" placeholder="閫夋嫨寮�濮嬫棩鏈�" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 177px" />-->
+<!-- - <el-date-picker v-model="filterFrom.finishTime" style="width: 177px" type="date" placeholder="閫夋嫨缁撴潫鏃ユ湡" format="yyyy-MM-dd" value-format="yyyy-MM-dd" />-->
+<!-- </el-form-item>-->
+ <el-form-item label="绯荤粺鍐呯疆">
+ <el-select v-model="filterFrom.configType" placeholder="绯荤粺鍐呯疆" clearable>
+ <el-option
+ v-for="dict in dict.type.sys_yes_no"
+ :key="dict.value"
+ :label="dict.label"
+ :value="dict.value"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <my-button-v2 site="filter" name="鎼滅储" @click="search(1)" />
+ <my-button-v2 site="filter" name="閲嶇疆" @click="reset()" />
+ </el-form-item>
+ </el-form>
+ </div>
+ </el-card>
+ <!--鍒楄〃-->
+ <my-table-v3 ref="myTable" :filter="filterFrom" :table="table" />
+ <!--娣诲姞/缂栬緫寮圭獥-->
+ <edit v-if="editSetting.show" :setting="editSetting" @close="editSetting.show=false" @search="search" />
+ </div>
- <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:config: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:config: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:config: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:config:export']"
- >瀵煎嚭</el-button>
- </el-col>
- <el-col :span="1.5">
- <el-button
- type="danger"
- plain
- icon="el-icon-refresh"
- size="mini"
- @click="handleRefreshCache"
- v-hasPermi="['system:config:remove']"
- >鍒锋柊缂撳瓨</el-button>
- </el-col>
- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
- </el-row>
-
- <!--鍒楄〃-->
- <my-table-v3 ref="myTable" :filter="filterFrom" :table="table" />
-
- <!-- 娣诲姞鎴栦慨鏀瑰弬鏁伴厤缃璇濇 -->
- <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="鍙傛暟鍚嶇О" prop="config_name">
- <el-input v-model="form.config_name" placeholder="璇疯緭鍏ュ弬鏁板悕绉�" />
- </el-form-item>
- <el-form-item label="KEY" prop="config_key">
- <el-input v-model="form.config_key" placeholder="璇疯緭鍏ュ弬鏁伴敭鍚�" />
- </el-form-item>
- <el-form-item label="VALUE" prop="config_value">
- <el-input v-model="form.config_value" placeholder="璇疯緭鍏ュ弬鏁伴敭鍊�" />
- </el-form-item>
- <el-form-item label="绯荤粺鍐呯疆" prop="config_type">
- <el-radio-group v-model="form.config_type">
- <el-radio
- v-for="dict in dict.type.sys_yes_no"
- :key="dict.value"
- :label="dict.value"
- >{{dict.label}}</el-radio>
- </el-radio-group>
- </el-form-item>
- <el-form-item label="澶囨敞" prop="remark">
- <el-input v-model="form.remark" type="textarea" placeholder="璇疯緭鍏ュ唴瀹�" />
- </el-form-item>
- </el-form>
- <div slot="footer" class="dialog-footer">
- <el-button type="primary" @click="submitForm">纭� 瀹�</el-button>
- <el-button @click="cancel">鍙� 娑�</el-button>
- </div>
- </el-dialog>
</div>
</template>
<script>
- import {addConfig, delConfig, getConfig, listConfig, refreshCache, updateConfig} from "@/api/system/config";
+ import {listConfig, refreshCache} from "@/api/system/config";
import myTableV3 from '@/views/components/myTableV3';
+ import myButtonV2 from '@/views/components/myButtonV2'
+ import edit from './edit'
export default {
- components: {myTableV3},
+ components: {myTableV3, myButtonV2, edit},
name: "Config",
dicts: ['sys_yes_no'],
data() {
return {
- // 閬僵灞�
- loading: true,
// 閫変腑鏁扮粍
ids: [],
// 闈炲崟涓鐢�
single: true,
// 闈炲涓鐢�
multiple: true,
- // 鏄剧ず鎼滅储鏉′欢
- showSearch: true,
- // 鎬绘潯鏁�
- total: 0,
- // 鍙傛暟琛ㄦ牸鏁版嵁
- configList: [],
- // 寮瑰嚭灞傛爣棰�
- title: "",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
// 鏃ユ湡鑼冨洿
dateRange: [],
- // 鏌ヨ鍙傛暟
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- configName: undefined,
- configKey: undefined,
- configType: undefined
- },
// 琛ㄥ崟鍙傛暟
- form: {},
+ // form: {},
// 琛ㄥ崟鏍￠獙
- rules: {
- config_name: [
- { required: true, message: "鍙傛暟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
- ],
- config_key: [
- { required: true, message: "鍙傛暟閿悕涓嶈兘涓虹┖", trigger: "blur" }
- ],
- config_value: [
- { required: true, message: "鍙傛暟閿�间笉鑳戒负绌�", trigger: "blur" }
- ]
- },
/** 鎼滅储鏉′欢*/
filterFrom: {
- title: null
+ configName: null,
+ configKey: null,
+ configType: null
},
table: {
@@ -204,12 +80,27 @@
// 宸ュ叿鏉�
tools: {
columnsCtrl: {// 鍒楁帶鍒舵寜閽�
- show: false
+ show: true
},
generalExport: {// 閫氱敤瀵煎嚭鎸夐挳
show: false
},
custom: [ // 鑷畾涔夊伐鍏锋潯鎸夐挳
+ {
+ name: '鍒锋柊缂撳瓨',
+ checkPermission: 'system:config:remove',
+ myType: 'danger',
+ mySize: 'mini',
+ click: ()=> {
+ this.handleRefreshCache();
+ }
+ },
+ {
+ name: '瀵煎嚭鍙傛暟',
+ click: ()=> {
+
+ }
+ }
]
},
columns: [
@@ -226,7 +117,7 @@
title = '鍚�'
break
}
- return { value: title }
+ return { value: title, type: 'primary' }
}
},
{ title: '鍒涘缓鏃堕棿', field: 'create_time', align: 'left', width: 170 },
@@ -256,12 +147,20 @@
total: 0
}
}
+ },
+
+ // 娣诲姞&缂栬緫绐楀彛
+ editSetting: {
+ id: null,
+ title: '',
+ show: false
}
};
},
created() {
// this.getList();
+ // console.log(dict);
},
methods: {
// 鏌ヨtable鍒楄〃
@@ -272,44 +171,14 @@
this.$refs.myTable.search()
}
},
-
- /** 鏌ヨ鍙傛暟鍒楄〃 */
- getList() {
- this.loading = true;
- listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
- this.configList = response.data;
- this.total = response.total;
- this.loading = false;
- }
- );
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.reset();
- },
// 琛ㄥ崟閲嶇疆
reset() {
- this.form = {
- config_id: undefined,
- config_name: undefined,
- config_key: undefined,
- config_value: undefined,
- config_type: "Y",
- remark: undefined
- };
- this.resetForm("form");
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.dateRange = [];
- this.resetForm("queryForm");
- this.handleQuery();
+ this.filterFrom = {
+ configName: null,
+ configKey: null,
+ configType: null
+ }
+ this.search(1)
},
/** 鏂板鎸夐挳鎿嶄綔 */
handleAdd() {
@@ -325,43 +194,9 @@
},
/** 淇敼鎸夐挳鎿嶄綔 */
handleUpdate(row) {
- this.reset();
- const configId = row.config_id || this.ids
- getConfig(configId).then(response => {
- this.form = response.data;
- this.open = true;
- this.title = "淇敼鍙傛暟";
- });
- },
- /** 鎻愪氦鎸夐挳 */
- submitForm: function() {
- this.$refs["form"].validate(valid => {
- if (valid) {
- if (this.form.config_id != undefined) {
- updateConfig(this.form).then(response => {
- this.$modal.msgSuccess("淇敼鎴愬姛");
- this.open = false;
- this.getList();
- });
- } else {
- addConfig(this.form).then(response => {
- this.$modal.msgSuccess("鏂板鎴愬姛");
- this.open = false;
- this.getList();
- });
- }
- }
- });
- },
- /** 鍒犻櫎鎸夐挳鎿嶄綔 */
- handleDelete(row) {
- const configIds = row.config_id || this.ids;
- this.$modal.confirm('鏄惁纭鍒犻櫎鍙傛暟缂栧彿涓�"' + configIds + '"鐨勬暟鎹」锛�').then(function() {
- return delConfig(configIds);
- }).then(() => {
- this.getList();
- this.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(() => {});
+ this.editSetting.id = row.config_id
+ this.editSetting.title = "缂栬緫鍙傛暟"
+ this.editSetting.show = true
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
@@ -371,14 +206,15 @@
},
/** 鍒锋柊缂撳瓨鎸夐挳鎿嶄綔 */
handleRefreshCache() {
- refreshCache().then(() => {
- this.$modal.msgSuccess("鍒锋柊鎴愬姛");
- });
- },
-
- /** 鏄剧ず閰嶇疆璇︽儏 */
- showDetail(row){
-
+ this.$confirm('纭鍒锋柊缂撳瓨锛�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(()=> {
+ refreshCache().then(() => {
+ this.$modal.msgSuccess("鍒锋柊鎴愬姛");
+ });
+ })
}
}
};
--
Gitblit v1.9.1