From dd16a1237f53697f0df291b5af1ad39062ce6039 Mon Sep 17 00:00:00 2001
From: unknown <280848880@qq.com>
Date: 星期四, 28 九月 2023 11:12:14 +0800
Subject: [PATCH] web:1 风险分级管控-危险源告知,区域包保页面提交 2 table组件,权限自定义指令功能提交
---
web/src/views/SecureManage/RiskGrad/AreaGuarantee.vue | 376 ++++++++++++++++++
web/src/api/modules/safety.js | 28 +
web/src/views/ProjectManage/ProjectsIndex.vue | 16
web/src/main.js | 1
web/src/components/element/Table.vue | 151 +++++++
web/src/components/element/Pagination.vue | 78 +++
web/src/views/SecureManage/RiskGrad/DangerInform.vue | 269 +++++++++++++
web/src/router/routerConfig.js | 4
web/src/views/ProjectManage/SectionManage.vue | 61 +-
web/package-lock.json | 160 ++++---
web/src/plugins/directive.js | 13
web/src/style/layout-main.scss | 6
12 files changed, 1,036 insertions(+), 127 deletions(-)
diff --git a/web/package-lock.json b/web/package-lock.json
index 301fe1f..c1c1899 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -1932,63 +1932,6 @@
"integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
"dev": true
},
- "ansi-styles": {
- "version": "4.3.0",
- "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
- "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
- "dev": true,
- "optional": true,
- "requires": {
- "color-convert": "^2.0.1"
- }
- },
- "chalk": {
- "version": "4.1.2",
- "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
- "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
- "dev": true,
- "optional": true,
- "requires": {
- "ansi-styles": "^4.1.0",
- "supports-color": "^7.1.0"
- }
- },
- "color-convert": {
- "version": "2.0.1",
- "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
- "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
- "dev": true,
- "optional": true,
- "requires": {
- "color-name": "~1.1.4"
- }
- },
- "color-name": {
- "version": "1.1.4",
- "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
- "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
- "dev": true,
- "optional": true
- },
- "has-flag": {
- "version": "4.0.0",
- "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
- "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
- "dev": true,
- "optional": true
- },
- "loader-utils": {
- "version": "2.0.4",
- "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
- "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
- "dev": true,
- "optional": true,
- "requires": {
- "big.js": "^5.2.2",
- "emojis-list": "^3.0.0",
- "json5": "^2.1.2"
- }
- },
"ssri": {
"version": "8.0.1",
"resolved": "https://registry.npmmirror.com/ssri/-/ssri-8.0.1.tgz",
@@ -1996,28 +1939,6 @@
"dev": true,
"requires": {
"minipass": "^3.1.1"
- }
- },
- "supports-color": {
- "version": "7.2.0",
- "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
- "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
- "dev": true,
- "optional": true,
- "requires": {
- "has-flag": "^4.0.0"
- }
- },
- "vue-loader-v16": {
- "version": "npm:vue-loader@16.8.3",
- "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz",
- "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
- "dev": true,
- "optional": true,
- "requires": {
- "chalk": "^4.1.0",
- "hash-sum": "^2.0.0",
- "loader-utils": "^2.0.0"
}
}
}
@@ -12830,6 +12751,87 @@
}
}
},
+ "vue-loader-v16": {
+ "version": "npm:vue-loader@16.8.3",
+ "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz",
+ "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "chalk": "^4.1.0",
+ "hash-sum": "^2.0.0",
+ "loader-utils": "^2.0.0"
+ },
+ "dependencies": {
+ "ansi-styles": {
+ "version": "4.3.0",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+ "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "color-convert": "^2.0.1"
+ }
+ },
+ "chalk": {
+ "version": "4.1.2",
+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+ "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "ansi-styles": "^4.1.0",
+ "supports-color": "^7.1.0"
+ }
+ },
+ "color-convert": {
+ "version": "2.0.1",
+ "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+ "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "color-name": "~1.1.4"
+ }
+ },
+ "color-name": {
+ "version": "1.1.4",
+ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+ "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+ "dev": true,
+ "optional": true
+ },
+ "has-flag": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+ "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+ "dev": true,
+ "optional": true
+ },
+ "loader-utils": {
+ "version": "2.0.4",
+ "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
+ "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "big.js": "^5.2.2",
+ "emojis-list": "^3.0.0",
+ "json5": "^2.1.2"
+ }
+ },
+ "supports-color": {
+ "version": "7.2.0",
+ "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+ "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "has-flag": "^4.0.0"
+ }
+ }
+ }
+ },
"vue-router": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.3.tgz",
diff --git a/web/src/api/modules/safety.js b/web/src/api/modules/safety.js
index 8998857..637f94b 100644
--- a/web/src/api/modules/safety.js
+++ b/web/src/api/modules/safety.js
@@ -207,4 +207,32 @@
// 信息删除
deletePunishInfo: params =>
axios.post('/secure/encourage/encourageDel', params),
+
+ /**
+ * 风险分级管控
+ */
+ RiskGrad: {
+ // 危险源告知
+ warning : {
+ getLists: params =>
+ axios.post('/secure/regionHazardInform/findAll', params),
+ insert: params =>
+ axios.post('/secure/regionHazardInform/insert', params),
+ update: params =>
+ axios.post('/secure/regionHazardInform/update', params),
+ delete: params =>
+ axios.get('/secure/regionHazardInform/delete', { params }),
+ },
+ // 区域包保
+ allocation : {
+ getLists: params =>
+ axios.post('/secure/tRegionWarranty/findAll', params),
+ insert: params =>
+ axios.post('/secure/tRegionWarranty/insert', params),
+ update: params =>
+ axios.post('/secure/tRegionWarranty/update', params),
+ delete: params =>
+ axios.get('/secure/tRegionWarranty/delete', { params }),
+ }
+ }
}
\ No newline at end of file
diff --git a/web/src/components/element/Pagination.vue b/web/src/components/element/Pagination.vue
new file mode 100644
index 0000000..46cfa39
--- /dev/null
+++ b/web/src/components/element/Pagination.vue
@@ -0,0 +1,78 @@
+<template>
+ <div class="pagination-container">
+ <el-pagination @current-change="handleCurrentChange" @size-change="handleSizeChange" :page-sizes="[10, 20, 30]"
+ :total="total" :current-page="pageNum" :page-size="pageSize"
+ layout="total, sizes, prev, pager, next, jumper"></el-pagination>
+ </div>
+</template>
+<script>
+export default {
+ name: "pagination",
+ data() {
+ return {};
+ },
+ props: {
+ // 总页数
+ total: {
+ type: Number,
+ },
+ // 当前页
+ pageNum: {
+ type: Number,
+ },
+ // 每页显示条数
+ pageSize: {
+ type: Number,
+ },
+ },
+ methods: {
+ // 当前页码变化
+ handleCurrentChange(val) {
+ this.$emit("change-page-num", val);
+ },
+ // 每页查看条数变化
+ handleSizeChange(val) {
+ this.$emit("change-page-size", val);
+ },
+ },
+ // watch: {
+ // pageSize: {
+ // // immediate: true,
+ // handler(newValue, oldValue) {
+ // this.page._pageSize = this.newValue;
+ // console.log("pageSize", newValue, oldValue);
+ // },
+ // },
+ // pageNum: {
+ // // immediate: true,
+ // handler(newValue, oldValue) {
+ // this.page._currentPage = newValue;
+ // console.log("pageNum", newValue, oldValue);
+ // },
+ // },
+ // },
+};
+</script>
+<style lang="scss" scoped>
+// 主体底部样式
+::v-deep.el-pagination .btn-prev,
+::v-deep.el-pagination .btn-next,
+::v-deep.el-pagination .el-pager li {
+ background-color: rgba(20, 25, 58, 0.4);
+ border: 1px solid rgba(255, 255, 255, 0.12);
+ font-weight: 400;
+ color: #E2E4E9;
+ border-radius: 4px;
+}
+
+::v-deep.el-pagination .el-pager li:not(.disabled).active {
+ color: #fff;
+ border: 1px solid #39B5FE;
+ background-color: #0B3562;
+ font-weight: 400;
+}
+
+.pagination-container {
+ margin-top: 30px;
+}
+</style>
\ No newline at end of file
diff --git a/web/src/components/element/Table.vue b/web/src/components/element/Table.vue
new file mode 100644
index 0000000..b266c54
--- /dev/null
+++ b/web/src/components/element/Table.vue
@@ -0,0 +1,151 @@
+<template>
+ <div>
+ <!-- elTable -->
+ <el-table v-loading="tableLoading" :data="tableData" :ref="tableRef" :size="tableSize" @row-click="rowClick"
+ @row-dblclick="rowDblClick" @selection-change="handleSelectionChange" border stripe>
+ <template v-for="(col, index) in tableColumns">
+ <!-- 选择框 -->
+ <el-table-column v-if="col.selection" :key="`selection${index}`" width="50" type="selection" align="center">
+ </el-table-column>
+
+ <!-- 序号 -->
+ <el-table-column v-else-if="col.index" :key="`index${index}`" width="50" :label="col.name || '序号'" type="index"
+ align="center">
+ </el-table-column>
+
+ <!-- 操作 -->
+ <el-table-column v-else-if="col.operation" :key="`operation${col.name}`" :width="col.width" :label="col.name"
+ align="center">
+ <template #default="{ row }">
+ <el-button v-for="subCol in col.value" :key="subCol.name" :class="subCol.class || ''" :icon="subCol.icon || ''"
+ v-permission="subCol.permission || ''" @click="subCol.handleRow ? subCol.handleRow(row) : emptyFn">
+ {{ subCol.name }}
+ </el-button>
+ </template>
+ </el-table-column>
+
+ <!-- 常规col -->
+ <el-table-column v-else :key="col.name" :width="col.width" :label="col.name" :prop="col.key"
+ :show-overflow-tooltip="col.showOverflowTip || false" :align="col.align || 'center'">
+ <template #default="{ row }">
+ <!-- slotのcol -->
+ <template v-if="col.slot">
+ <slot :name="col.slot" :row="row"></slot>
+ </template>
+ <!-- 需处理数据のcol -->
+ <template v-else-if="col.formatter">
+ {{ col.formatter(row) }}
+ </template>
+ <!-- 普通のcol -->
+ <template v-else>
+ {{ row[col.key] }}
+ </template>
+ </template>
+ </el-table-column>
+ </template>
+ </el-table>
+ <!-- 分页组件 -->
+ <cPagination :total="pageTotal" :page-num.sync="pageNum" :page-size.sync="pageSize" @change-page-num="changePageNum"
+ @change-page-size="changePageSize" />
+ </div>
+</template>
+<script>
+import cPagination from "./Pagination"
+export default {
+ name: "cTable",
+ data() {
+ return {
+ time: null,
+ emptyFn: () => { }
+ };
+ },
+ props: {
+ tableData: {
+ type: Array,
+ default() {
+ return [];
+ }
+ },
+ tableHeight: {
+ type: Number,
+ default: null
+ },
+ tableLoading: {
+ type: Boolean,
+ default: false
+ },
+ tableRef: {
+ type: String,
+ default: "multipleTable"
+ },
+ tableSize: {
+ type: String,
+ default: "mini"
+ },
+ tableColumns: {
+ type: Array,
+ default() {
+ return [];
+ }
+ },
+ pageTotal: {
+ type: Number
+ },
+ pageNum: {
+ type: Number,
+ default: 1
+ },
+ pageSize: {
+ type: Number,
+ default: 10
+ },
+ pageChange: {
+ type: Function,
+ default: () => { }
+ },
+ handleSelection: {
+ type: Function,
+ default: () => { }
+ }
+ },
+ components: {
+ cPagination
+ },
+ methods: {
+ changePageNum(val) {
+ // console.log(val)
+ // this.pageNum = val
+ this.$emit("update:pageNum", val);
+ this.pageChange();
+ },
+ changePageSize(val) {
+ this.$emit("update:pageSize", val);
+ if (val * (this.pageNum - 1) <= this.pageTotal) {
+ this.pageChange();
+ }
+ },
+ // 单击
+ rowClick() {
+ // this.time && clearTimeout(this.time);
+ // this.time = setTimeout(() => {
+ // this.$refs[this.tableRef].toggleRowSelection(row);
+ // }, 200);
+ },
+ // 双击
+ rowDblClick() {
+ // this.time && clearTimeout(this.time);
+ },
+ clearSelection() {
+ this.$refs[this.tableRef].clearSelection();
+ },
+ handleSelectionChange(val) {
+ this.handleSelection(val);
+ }
+ }
+};
+</script>
+<style lang="scss" scoped>
+.el-table {
+ border: none;
+}
+</style>
\ No newline at end of file
diff --git a/web/src/main.js b/web/src/main.js
index f596b68..174925e 100644
--- a/web/src/main.js
+++ b/web/src/main.js
@@ -7,6 +7,7 @@
// import './style/element-variables.scss'
import "@/style/font/font.scss";
import './plugins/index'; // 引入挂载的vue实例方法文件
+import './plugins/directive' // 全局指令:按钮权限
import { createPinia, PiniaVuePlugin } from 'pinia';
import './router/routerConfig'; // 引入路由守卫
import App from './App.vue';
diff --git a/web/src/plugins/directive.js b/web/src/plugins/directive.js
new file mode 100644
index 0000000..08742f4
--- /dev/null
+++ b/web/src/plugins/directive.js
@@ -0,0 +1,13 @@
+import Vue from 'vue'
+import { buttonPinia } from '@/pinia/index'
+
+Vue.directive('permission', {
+ inserted: (el, binding) => {
+ const { value } = binding
+ const pinia = buttonPinia()
+ const piniaBtns = pinia.$state.buttonInfo
+ if (value && !piniaBtns.includes(value)) {
+ el.parentNode.removeChild(el)
+ }
+ }
+})
diff --git a/web/src/router/routerConfig.js b/web/src/router/routerConfig.js
index 82aa1bd..e7408a9 100644
--- a/web/src/router/routerConfig.js
+++ b/web/src/router/routerConfig.js
@@ -67,9 +67,11 @@
let list = res.data.map(item => item.buttonHtmlId)
pinia.changeMenuButtonInfo(list);
}
+ next()
})
+ } else {
+ next()
}
- next();
})
router.afterEach(() => {
diff --git a/web/src/style/layout-main.scss b/web/src/style/layout-main.scss
index 5ebc614..3eb82ea 100644
--- a/web/src/style/layout-main.scss
+++ b/web/src/style/layout-main.scss
@@ -81,7 +81,7 @@
}
}
- .search_btn {
+ ::v-deep .search_btn {
border: 0 none;
color: #fff;
background: url('~@/assets/search_bg.png') no-repeat;
@@ -91,7 +91,7 @@
}
}
- .table_btn {
+ ::v-deep .table_btn {
border: 0 none;
color: #39B5FE;
background: url('~@/assets/table_btn.png') no-repeat;
@@ -101,7 +101,7 @@
}
}
- .delete_btn {
+ ::v-deep .delete_btn {
border: 0 none;
color: #F94550;
background: url('~@/assets/error_btn.png') no-repeat;
diff --git a/web/src/views/ProjectManage/ProjectsIndex.vue b/web/src/views/ProjectManage/ProjectsIndex.vue
index 2c0d9cf..6078e24 100644
--- a/web/src/views/ProjectManage/ProjectsIndex.vue
+++ b/web/src/views/ProjectManage/ProjectsIndex.vue
@@ -4,7 +4,7 @@
<!-- header-->
<div class="main_header" style="flex-direction: row-reverse;">
<div class="header_item" style="margin-right:0px">
- <el-button class="search_btn" icon="el-icon-plus" v-if="showButton('insert')" @click="addRow">新增</el-button>
+ <el-button class="search_btn" icon="el-icon-plus" v-permission="'insert'" @click="addRow">新增</el-button>
</div>
</div>
<!-- content-->
@@ -66,9 +66,8 @@
<el-table-column prop="planOutput" label="总需求(环)" align="center"></el-table-column>
<el-table-column label="操作" align="center" width="140">
<template #default="scope">
- <el-button class="table_btn" size="mini" v-if="showButton('stop')"
- @click="deleteRow(scope.row)">停用</el-button>
- <el-button class="delete_btn" size="mini" v-if="showButton('update')"
+ <el-button class="table_btn" size="mini" v-permission="'stop'" @click="deleteRow(scope.row)">停用</el-button>
+ <el-button class="delete_btn" size="mini" v-permission="'update'"
@click="updateRow(scope.$index)">修改</el-button>
</template>
</el-table-column>
@@ -186,9 +185,8 @@
</template>
<script>
-import {buttonPinia} from '../../pinia/index';
import {throttle} from '../../plugins/public'; // 导入节流、动态切换组件尺寸方法
-import cpnTable from '@/components/table/Table'
+import cpnTable from '@/components/element/Table'
export default {
data() {
return {
@@ -433,11 +431,6 @@
}
})
}, 1000),
- // 判断按钮权限信息
- showButton(str) {
- const pinia = buttonPinia();
- return pinia.$state.buttonInfo.includes(str);
- },
changePageNum(page) {
this.queryInfo.pageNum = page;
this.getLists();
@@ -466,7 +459,6 @@
if (!detailData.tableColumns.length) {
detailData.tableColumns = [
{index: true},
- {slot: "name"},
{name: "环号", key: "ringNum"},
{name: "管片编号", key: "pipeNum", width: 140},
{name: "转向", key: "turnName", width: 106},
diff --git a/web/src/views/ProjectManage/SectionManage.vue b/web/src/views/ProjectManage/SectionManage.vue
index f29dffd..09e277f 100644
--- a/web/src/views/ProjectManage/SectionManage.vue
+++ b/web/src/views/ProjectManage/SectionManage.vue
@@ -14,24 +14,17 @@
</el-select>
</div>
<div class="header_item">
- <el-button icon="el-icon-search" v-if="showButton('search')" @click="queryReset">查询</el-button>
- <el-button class="search_btn" icon="el-icon-plus" v-if="showButton('insert')" @click="addRow">新增</el-button>
+ <el-button icon="el-icon-search" v-permission="'search'" @click="queryReset">查询</el-button>
+ <el-button class="search_btn" icon="el-icon-plus" v-permission="'insert'" @click="addRow">新增</el-button>
</div>
</div>
<div class="main_content">
- <cpnTable :table-index="true" :table-data="dataList" :table-columns-config="tableColumns" :page-total="total"
+ <cpnTable :table-index="true" :table-data="dataList" :table-columns="tableColumns" :page-total="total"
:page-num.sync="queryInfo.pageNum" :page-size.sync="queryInfo.pageSize" :page-change="pageChange">
- <el-table-column slot="finished" label="已完成(块)" align="center">
- <template #default="{ row }">
- <div style="cursor: pointer;" @click="showDetail(row)">{{ row.completedQuantity }}</div>
- </template>
- </el-table-column>
- <el-table-column slot="action" label="操作" width="140" align="center">
- <template #default="{ row }">
- <el-button class="table_btn" size="mini" v-if="showButton('update')" @click="updateRow(row)">修改</el-button>
- <el-button class="delete_btn" size="mini" v-if="showButton('delete')" @click="deleteRow(row)">删除</el-button>
- </template>
- </el-table-column>
+
+ <template #finished="{ row }">
+ <div style="cursor: pointer;" @click="showDetail(row)">{{ row.completedQuantity }}</div>
+ </template>
</cpnTable>
</div>
<!-- dialog -->
@@ -105,7 +98,7 @@
</template>
</div>
</el-card>
- <cpnTable :table-index="true" :table-data="detail.tableData" :table-columns-config="detail.tableColumns"
+ <cpnTable :table-index="true" :table-data="detail.tableData" :table-columns="detail.tableColumns"
:page-total="detail.total" :page-num.sync="detail.pageNum" :page-size.sync="detail.pageSize"
:page-change="detailPageChange">
</cpnTable>
@@ -114,9 +107,8 @@
</template>
<script>
-import {buttonPinia} from '../../pinia/index';
import {throttle} from '../../plugins/public'; // 导入节流、动态切换组件尺寸方法
-import cpnTable from '@/components/table/Table'
+import cpnTable from '@/components/element/Table'
export default {
data() {
return {
@@ -206,11 +198,11 @@
cpnTable
},
computed: {
- dialogTitle() {
- return this.submitMode === 'update' ? '修改新增单位工程' : '新增单位工程'
- },
isUpdate() {
return this.submitMode === 'update'
+ },
+ dialogTitle() {
+ return this.isUpdate ? '修改新增单位工程' : '新增单位工程'
},
},
created() {
@@ -222,6 +214,7 @@
// this.getAllBlocks() // 暂时没用,先屏蔽
},
methods: {
+ // 获取table列表数据
getLists() {
this.loading = true
let params = this.queryInfo
@@ -282,6 +275,7 @@
}
})
},
+ // 已完成 table信息
getDetailLists() {
let detailData = this.detail
this.$api.DuctpiecePLM.searchDuctpiecePLMList({
@@ -295,6 +289,7 @@
}
})
},
+ // 已完成 title信息
getDetailInfos(id) {
this.$api.Engineer.detailsProjects({proId: id}).then(res => {
if (res.success) {
@@ -302,6 +297,7 @@
}
})
},
+ // 初始化 ruleform
setFormProps(options = {}) {
let _form = {
proId: '', // 项目名称id
@@ -317,10 +313,11 @@
}
this.ruleForm = Object.keys(options).length ? options : _form
},
+ // 初始化 table 配置
setTableColumn() {
this.tableColumns = [
{index: true},
- {slot: "finished"},
+ {slot: "finished", name: "已完成(块)"},
{name: "项目名称", key: "proName", width: 160},
{name: "起讫里程", key: "mileage"},
{name: "单位工程名称", key: "unitProjectName"},
@@ -330,11 +327,15 @@
{name: "工期", key: "duration"},
{name: "站点", key: "station"},
{name: "负责人", key: "realName"},
- {slot: 'action'},
+ {
+ operation: true, name: "操作", width: 140, value: [
+ {name: "修改", class: "table_btn", permission: "update", handleRow: this.updateRow},
+ {name: "删除", class: "delete_btn", permission: "delete", handleRow: this.deleteRow},
+ ]
+ },
]
this.detail.tableColumns = [
{index: true},
- {slot: "name"},
{name: "环号", key: "ringNum"},
{name: "管片编号", key: "pipeNum", width: 140},
{name: "转向", key: "turnName", width: 106},
@@ -350,13 +351,16 @@
{name: "质量标注", key: "checkResultStr"},
]
},
+ // 重置表单
resetForm(formName) {
this.$refs[formName].resetFields()
},
+ // 显示表单
showForm() {
!this.isRender && (this.isRender = true)
this.asyncVisible = true
},
+ // 隐藏表单
closeForm() {
this.asyncVisible = false
this.resetForm('ruleForm')
@@ -368,10 +372,12 @@
this.queryInfo.pageSize = 10
this.getLists()
},
+ // 添加数据
addRow() {
this.submitMode = 'add'
this.showForm()
},
+ // 更新数据
async updateRow(row) {
this.submitMode = 'update'
this.showForm()
@@ -384,6 +390,7 @@
this.ruleForm.segmentId = row.segmentId
this.ruleForm.segmentList = segmentList
},
+ // 删除数据
deleteRow(row) {
this.$confirm("该操作将删除该信息,是否继续删除?", "提示", {
confirmButtonText: "确定",
@@ -433,6 +440,7 @@
}
})
},
+ // 提交表单
onSubmit: throttle(function () {
this.$refs.ruleForm.validate(valid => {
if (!valid) return
@@ -462,11 +470,6 @@
}
})
}, 1000),
- // 判断按钮权限信息
- showButton(str) {
- const pinia = buttonPinia();
- return pinia.$state.buttonInfo.includes(str);
- },
showDetail(row) {
let detailData = this.detail
!detailData.isRenderDetail && (detailData.isRenderDetail = true)
@@ -478,9 +481,11 @@
this.getDetailInfos(row.proId)
this.getDetailLists()
},
+ // 分页改变
pageChange() {
this.getLists();
},
+ // 已完成の分页改变
detailPageChange() {
this.getDetailLists();
},
diff --git a/web/src/views/SecureManage/RiskGrad/AreaGuarantee.vue b/web/src/views/SecureManage/RiskGrad/AreaGuarantee.vue
index 609ac44..24c03e1 100644
--- a/web/src/views/SecureManage/RiskGrad/AreaGuarantee.vue
+++ b/web/src/views/SecureManage/RiskGrad/AreaGuarantee.vue
@@ -1,3 +1,375 @@
<template>
- <div>区域包保</div>
-</template>
\ No newline at end of file
+ <!-- 安全管理 ==> 风险分级管控 => 区域包保-->
+ <div class="main">
+ <!-- header -->
+ <div class="main_header">
+ <div class="header_item">
+ <span class="header_label">区域名称:</span>
+ <el-select v-model="queryInfo.regionHazardInformId" clearable placeholder="请选择域名称">
+ <el-option v-for="item in areaNames" :key="item.id" :label="item.region" :value="item.id">
+ </el-option>
+ </el-select>
+ </div>
+ <div class="header_item">
+ <el-button icon="el-icon-search" v-permission="'search'" @click="queryReset">查询</el-button>
+ <el-button class="search_btn" icon="el-icon-plus" v-permission="'insert'" @click="addRow">新增</el-button>
+ </div>
+ </div>
+
+ <!-- table -->
+ <div class="main_content">
+ <cpnTable :table-index="true" :table-data="dataList" :table-columns="tableColumns" :page-total="total"
+ :page-num.sync="queryInfo.pageNum" :page-size.sync="queryInfo.pageSize" :page-change="pageChange">
+ </cpnTable>
+ </div>
+
+ <!-- dialog -->
+ <el-dialog class="prop_dialog" v-if="isRender" :title="dialogTitle" :visible.sync="asyncVisible" @close="closeForm">
+ <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="auto" class="rule_form">
+ <el-form-item label="区域名称:" prop="regionHazardInformId">
+ <el-select v-model="ruleForm.regionHazardInformId" placeholder="请选择区域名称">
+ <el-option v-for="item in areaNames" :key="item.id" :label="item.region" :value="item.id">
+ </el-option>
+ </el-select>
+ </el-form-item>
+
+ <el-form-item label="包保领导:" prop="leader">
+ <el-select v-model="ruleForm.leader" filterable multiple placeholder="请选择包保领导">
+ <el-option v-for="item in allPersons" :key="item.key" :label="item.label" :value="item.key">
+ </el-option>
+ </el-select>
+ </el-form-item>
+
+ <el-form-item label="小组成员:" prop="staff">
+ <el-transfer ref="transfer" v-model="ruleForm.staff" filterable :filter-method="filterMethod"
+ filter-placeholder="请输入员工姓名" :titles="['未选择', '已选择']" :data="allPersons">
+ </el-transfer>
+ </el-form-item>
+
+ <el-form-item label="风险源情况:" prop="riskSourceSituation">
+ <el-input type="textarea" v-model="ruleForm.riskSourceSituation" clearable placeholder="请输入风险源情况">
+ </el-input>
+ </el-form-item>
+
+ <el-form-item label="应对措施:" prop="countermeasures">
+ <el-input type="textarea" v-model="ruleForm.countermeasures" clearable placeholder="请输入应对措施">
+ </el-input>
+ </el-form-item>
+ </el-form>
+ <div slot="footer">
+ <el-button @click="asyncVisible = false">取 消</el-button>
+ <el-button class="submit_btn" @click="onSubmit('ruleForm')">提 交</el-button>
+ </div>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import {throttle} from '@/plugins/public'; // 导入节流、动态切换组件尺寸方法
+import cpnTable from '@/components/element/Table'
+export default {
+ data() {
+ return {
+ isRender: false,
+ loading: false,
+ asyncVisible: false,
+ submitMode: '', // add update
+ total: 0,
+ queryInfo: {
+ pageNum: 1,
+ pageSize: 10,
+ regionHazardInformId: '',
+ },
+ areaNames: [], // 区域名称
+ allPersons: [], // 所有人员渲染数据.穿梭框和选择框一起使用.
+ dataList: [], // table渲染数据
+ tableColumns: [], // table配置
+ ruleForm: {}, // 按钮表单
+ rules: {
+ regionHazardInformId: [{required: true, message: '请选择区域名称', trigger: 'change'}],
+ leader: [{required: true, message: '请选择包保领导', trigger: 'change'}],
+ staff: [{required: true, message: '请选择小组成员', trigger: 'blur'}],
+ riskSourceSituation: [{required: true, message: '请输入风险源情况', trigger: 'blur'}],
+ countermeasures: [{required: true, message: '请输入应对措施', trigger: 'blur'}],
+ },
+ $http: '', // api路径赋值
+ }
+ },
+ components: {
+ cpnTable
+ },
+ computed: {
+ isUpdate() {
+ return this.submitMode === 'update'
+ },
+ dialogTitle() {
+ return this.isUpdate ? '修改区域' : '新增区域'
+ },
+ },
+ created() {
+ this.$http = this.$api.Safety.RiskGrad.allocation
+ this.setFormProps()
+ this.setTableColumn()
+ this.getLists()
+ this.getAreaName()
+ },
+ methods: {
+ // 获取table列表数据
+ getLists() {
+ this.loading = true
+ let params = this.queryInfo
+ this.$http.getLists(params).then(res => {
+ if (res.statusMsg === 'ok') {
+ this.total = res.data.total
+ this.dataList = res.data.list
+ }
+ this.loading = false
+ })
+ },
+ // 获取管服人员数据...showDialog时调用
+ getPerson() {
+ this.getPerson = this.runOnce(() => {
+ return new Promise(resolve => {
+ this.$api.Personnerl.SEARCHMORTGAGEELIST({
+ userType: 1,
+ pageNum: 1,
+ pageSize: 9999
+ }).then((res) => {
+ if (res.success) {
+ const list = res.data.list
+ const out = []
+ list.forEach(item => {
+ out.push({
+ label: item.realName, // 穿梭框规定字段, 可绑定props属性修改默认规定的字段.
+ key: item.userId, // 穿梭框规定使字段
+ })
+ })
+ this.allPersons = out
+ resolve()
+ }
+ })
+ })
+ })
+ return this.getPerson()
+ },
+ // 获取区域信息
+ getAreaName() {
+ this.$api.Safety.RiskGrad.warning.getLists({
+ pageNum: 1,
+ pageSize: 9999
+ }).then((res) => {
+ if (res.success) {
+ const list = res.data.list
+ const out = []
+ list.forEach(item => {
+ out.push({
+ id: item.id,
+ region: item.region,
+ })
+ })
+ this.areaNames = out
+ }
+ })
+ },
+ // 初始化 ruleform
+ setFormProps(options = {}) {
+ let _form = {
+ regionHazardInformId: '', // 区域名称id
+ leader: [], // 包保领导
+ staff: [], // 小组成员
+ riskSourceSituation: '', // 风险源情况
+ countermeasures: '', // 应对措施
+ }
+ this.ruleForm = Object.keys(options).length ? options : _form
+ },
+ // 初始化 table 配置
+ setTableColumn() {
+ this.tableColumns = [
+ {index: true},
+ {
+ name: "区域名称", key: "regionHazardInformId", formatter: (row) => {
+ return row.region
+ }
+ },
+ {
+ name: "包保领导", key: "leaderList", formatter: (row) => {
+ let el = ''
+ row.leaderList.forEach(item => {
+ el += item.realName + '、'
+ })
+ return el
+ }
+ },
+ {
+ name: "小组成员", key: "staffList", formatter: (row) => {
+ let el = ''
+ row.staffList.forEach(item => {
+ el += item.realName + '、'
+ })
+ return el
+ }
+ },
+ {name: "风险源情况", key: "riskSourceSituation"},
+ {name: "应对措施", key: "countermeasures"},
+ {
+ operation: true, name: "操作", width: 140, value: [
+ {name: "修改", class: "table_btn", permission: "update", handleRow: this.updateRow},
+ {name: "删除", class: "delete_btn", permission: "delete", handleRow: this.deleteRow},
+ ]
+ },
+ ]
+ },
+ runOnce(fn, context) { //控制让函数只触发一次
+ return () => {
+ if (!fn) return
+ try {
+ return fn.apply(context || this, arguments)
+ }
+ finally {
+ fn = null
+ }
+ }
+ },
+ // 穿梭框搜索关键字变化时触发
+ filterMethod(query, item) {
+ return item.label.indexOf(query) > -1
+ },
+ // 重置表单
+ resetForm(formName) {
+ this.$refs[formName].resetFields()
+ },
+ // 重置穿梭框选中状态
+ resetTransfer(transferName) {
+ this.$refs[transferName].$refs.leftPanel.checked = []
+ this.$refs[transferName].$refs.rightPanel.checked = []
+ },
+ // 显示表单
+ async showForm() {
+ !this.isRender && (this.isRender = true)
+ this.asyncVisible = true
+ await this.getPerson()
+ },
+ // 隐藏表单
+ closeForm() {
+ this.asyncVisible = false
+ this.resetForm('ruleForm')
+ this.resetTransfer('transfer')
+ },
+ // 查询按钮列表信息
+ queryReset() {
+ this.queryInfo.pageNum = 1
+ this.queryInfo.pageSize = 10
+ this.getLists()
+ },
+ // 添加数据
+ addRow() {
+ this.submitMode = 'add'
+ this.showForm()
+ },
+ // 更新数据
+ async updateRow(row) {
+ this.submitMode = 'update'
+ await this.showForm()
+ this.$nextTick(() => {
+ this.ruleForm.id = ''
+ const strongObj = {
+ staff: [],
+ leader: [],
+ }
+ row.staffList.forEach(item => {
+ strongObj.staff.push(item.userId)
+ })
+ row.leaderList.forEach(item => {
+ strongObj.leader.push(item.userId)
+ })
+ Object.keys(this.ruleForm).forEach(item => {
+ if (row.hasOwnProperty.call(row, item)) {
+ this.ruleForm[item] = strongObj[item] || row[item]
+ }
+ })
+ })
+ },
+ // 删除数据
+ deleteRow(row) {
+ const params = {id: row.id}
+ this.$confirm("该操作将删除该信息,是否继续删除?", "提示", {
+ confirmButtonText: "确定",
+ cancelButtonText: "取消",
+ type: "warning"
+ }).then(() => {
+ this.$http.delete(params).then(res => {
+ if (res.statusMsg === 'ok') {
+ this.queryReset();
+ this.$message.success("删除成功!")
+ } else {
+ this.$message.warning(res.statusMsg)
+ }
+ })
+ }).catch(() => {
+ this.$message.warning("您已取消")
+ })
+ },
+ // 提交表单
+ onSubmit: throttle(function (formName) {
+ this.$refs[formName].validate(valid => {
+ if (!valid) return
+ const params = this.ruleForm
+ if (this.isUpdate) {
+ // 更新
+ this.$http.update(params).then((res) => {
+ if (res.statusMsg === 'ok') {
+ this.closeForm()
+ this.getLists()
+ this.$message.success('更新成功!')
+ } else {
+ this.$message.warning(res.statusMsg)
+ }
+ })
+ } else {
+ // 添加
+ this.$http.insert(params).then((res) => {
+ if (res.statusMsg === 'ok') {
+ this.closeForm()
+ this.getLists()
+ this.$message.success('添加成功!')
+ } else {
+ this.$message.warning(res.statusMsg)
+ }
+ })
+ }
+ })
+ }, 1000),
+ // 分页改变
+ pageChange() {
+ this.getLists()
+ },
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/style/layout-main.scss';
+
+/deep/ {
+ &::-webkit-scrollbar {
+ width: 8px;
+ height: 8px;
+ }
+
+ &::-webkit-scrollbar-corner {
+ background-color: transparent;
+ }
+
+ &::-webkit-scrollbar-thumb {
+ border-radius: 10px;
+ box-shadow: inset 0 0 5px transparent;
+ background: #39B5FE;
+ }
+
+ &::-webkit-scrollbar-track {
+ box-shadow: inset 0 0 5px transparent;
+ border-radius: 10px;
+ background: rgba(76, 188, 254, .3);
+ }
+}
+</style>
\ No newline at end of file
diff --git a/web/src/views/SecureManage/RiskGrad/DangerInform.vue b/web/src/views/SecureManage/RiskGrad/DangerInform.vue
index 79198d0..b994119 100644
--- a/web/src/views/SecureManage/RiskGrad/DangerInform.vue
+++ b/web/src/views/SecureManage/RiskGrad/DangerInform.vue
@@ -1,3 +1,268 @@
<template>
- <div>危险源告知</div>
-</template>
\ No newline at end of file
+ <!-- 安全管理 ==> 风险分级管控 => 危险源告知-->
+ <div class="main">
+ <!-- header -->
+ <div class="main_header">
+ <div class="header_item">
+ <span class="header_label">安全等级:</span>
+ <el-select v-model="queryInfo.levelType" placeholder="请选择安全等级" clearable>
+ <el-option v-for="item in safetyLevels" :key="item.levelType" :label="item.name"
+ :value="item.levelType">
+ </el-option>
+ </el-select>
+ </div>
+ <div class="header_item">
+ <el-button icon="el-icon-search" v-permission="'search'" @click="queryReset">查询</el-button>
+ <el-button class="search_btn" icon="el-icon-plus" v-permission="'insert'" @click="addRow">新增</el-button>
+ </div>
+ </div>
+
+ <!-- table -->
+ <div class="main_content">
+ <cpnTable :table-index="true" :table-data="dataList" :table-columns="tableColumns" :page-total="total"
+ :page-num.sync="queryInfo.pageNum" :page-size.sync="queryInfo.pageSize" :page-change="pageChange">
+ </cpnTable>
+ </div>
+
+ <!-- dialog -->
+ <el-dialog class="prop_dialog" v-if="isRender" :title="dialogTitle" :visible.sync="asyncVisible" width="460px"
+ @close="closeForm">
+ <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="auto" class="rule_form">
+ <el-form-item label="区域名称:" prop="region">
+ <el-input v-model="ruleForm.region" clearable placeholder="请输入区域名称"></el-input>
+ </el-form-item>
+ <el-form-item label="安全等级:" prop="levelType">
+ <el-select v-model="ruleForm.levelType" placeholder="请选择">
+ <el-option v-for="item in safetyLevels" :key="item.levelType" :label="item.name"
+ :value="item.levelType">
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="区域颜色:" prop="regionColor">
+ <el-input v-model="ruleForm.regionColor" placeholder="请选择区域颜色" disabled></el-input>
+ <el-color-picker v-model="ruleForm.regionColor"></el-color-picker>
+ </el-form-item>
+ </el-form>
+ <div slot="footer">
+ <el-button @click="asyncVisible = false">取 消</el-button>
+ <el-button class="submit_btn" @click="onSubmit('ruleForm')">提 交</el-button>
+ </div>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import {throttle} from '@/plugins/public'; // 导入节流、动态切换组件尺寸方法
+import cpnTable from '@/components/element/Table'
+export default {
+ data() {
+ return {
+ isRender: false,
+ loading: false,
+ asyncVisible: false,
+ submitMode: '', // add update
+ total: 0,
+ queryInfo: {
+ pageNum: 1,
+ pageSize: 10,
+ levelType: '',
+ },
+ safetyLevelMap: {
+ 1: {name: 'IV-A级', levelType: 1},
+ 2: {name: 'IV-B级', levelType: 1},
+ 3: {name: 'IV-C级', levelType: 1},
+ 4: {name: 'IV-D级', levelType: 1},
+ }, // 安全等级 map
+ safetyLevels: [
+ {name: 'IV-A级', levelType: 1},
+ {name: 'IV-B级', levelType: 2},
+ {name: 'IV-C级', levelType: 3},
+ {name: 'IV-D级', levelType: 4},
+ ], // 安全等级 arr
+ dataList: [],
+ tableColumns: [], // table配置
+ ruleForm: {}, // 按钮表单
+ rules: {
+ region: [{required: true, message: '请输入区域名称', trigger: 'blur'}],
+ levelType: [{required: true, message: '请选择安全等级', trigger: 'change'}],
+ regionColor: [{required: true, message: '请选择区域颜色', trigger: 'change'}],
+ },
+ $http: '', // api路径赋值
+ }
+ },
+ components: {
+ cpnTable
+ },
+ computed: {
+ isUpdate() {
+ return this.submitMode === 'update'
+ },
+ dialogTitle() {
+ return this.isUpdate ? '修改区域' : '新增区域'
+ },
+ },
+ created() {
+ this.$http = this.$api.Safety.RiskGrad.warning
+ this.setFormProps()
+ this.setTableColumn()
+ this.getLists()
+ },
+ methods: {
+ // 获取table列表数据
+ getLists() {
+ this.loading = true
+ let params = this.queryInfo
+ this.$http.getLists(params).then(res => {
+ if (res.statusMsg === 'ok') {
+ this.total = res.data.total
+ this.dataList = res.data.list
+ }
+ this.loading = false
+ })
+ },
+ // 初始化 ruleform
+ setFormProps(options = {}) {
+ let _form = {
+ region: '', // 区域名称
+ levelType: '', // 安全等级
+ regionColor: '', // 区域等级颜色
+ }
+ this.ruleForm = Object.keys(options).length ? options : _form
+ },
+ // 初始化 table 配置
+ setTableColumn() {
+ this.tableColumns = [
+ {index: true},
+ {name: "区域名称", key: "region"},
+ {name: "安全等级", key: "levelType", formatter: (row) => {return this.safetyLevelMap[row.levelType].name}},
+ {name: "区域颜色", key: "regionColor"},
+ {
+ operation: true, name: "操作", width: 140, value: [
+ {name: "修改", class: "table_btn", permission: "update", handleRow: this.updateRow},
+ {name: "删除", class: "delete_btn", permission: "delete", handleRow: this.deleteRow},
+ ]
+ },
+ ]
+ },
+ // 重置表单
+ resetForm(formName) {
+ this.$refs[formName].resetFields()
+ },
+ // 显示表单
+ showForm() {
+ !this.isRender && (this.isRender = true)
+ this.asyncVisible = true
+ },
+ // 隐藏表单
+ closeForm() {
+ this.asyncVisible = false
+ this.resetForm('ruleForm')
+ },
+ // 查询按钮列表信息
+ queryReset() {
+ this.queryInfo.pageNum = 1
+ this.queryInfo.pageSize = 10
+ this.getLists()
+ },
+ // 添加数据
+ addRow() {
+ this.submitMode = 'add'
+ this.showForm()
+ },
+ // 更新数据
+ updateRow(row) {
+ this.submitMode = 'update'
+ this.showForm()
+ this.$nextTick(() => {
+ this.ruleForm.id = ''
+ Object.keys(this.ruleForm).forEach(item => {
+ if (row.hasOwnProperty.call(row, item)) {
+ this.ruleForm[item] = row[item]
+ }
+ })
+ })
+ },
+ // 删除数据
+ deleteRow(row) {
+ const params = {id: row.id}
+ this.$confirm("该操作将删除该信息,是否继续删除?", "提示", {
+ confirmButtonText: "确定",
+ cancelButtonText: "取消",
+ type: "warning"
+ }).then(() => {
+ this.$http.delete(params).then(res => {
+ if (res.statusMsg === 'ok') {
+ this.queryReset();
+ this.$message.success("删除成功!")
+ } else {
+ this.$message.warning(res.statusMsg)
+ }
+ })
+ }).catch(() => {
+ this.$message.warning("您已取消")
+ })
+ },
+ // 提交表单
+ onSubmit: throttle(function () {
+ this.$refs.ruleForm.validate(valid => {
+ if (!valid) return
+ const params = this.ruleForm
+ if (this.isUpdate) {
+ // 更新
+ this.$http.update(params).then((res) => {
+ if (res.statusMsg === 'ok') {
+ this.closeForm()
+ this.getLists()
+ this.$message.success('更新成功!')
+ } else {
+ this.$message.warning(res.statusMsg)
+ }
+ })
+ } else {
+ // 添加
+ this.$http.insert(params).then((res) => {
+ if (res.statusMsg === 'ok') {
+ this.closeForm()
+ this.getLists()
+ this.$message.success('添加成功!')
+ } else {
+ this.$message.warning(res.statusMsg)
+ }
+ })
+ }
+ })
+ }, 1000),
+ // 分页改变
+ pageChange() {
+ this.getLists()
+ },
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/style/layout-main.scss';
+
+/deep/ {
+ &::-webkit-scrollbar {
+ width: 8px;
+ height: 8px;
+ }
+
+ &::-webkit-scrollbar-corner {
+ background-color: transparent;
+ }
+
+ &::-webkit-scrollbar-thumb {
+ border-radius: 10px;
+ box-shadow: inset 0 0 5px transparent;
+ background: #39B5FE;
+ }
+
+ &::-webkit-scrollbar-track {
+ box-shadow: inset 0 0 5px transparent;
+ border-radius: 10px;
+ background: rgba(76, 188, 254, .3);
+ }
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3