关联设备
@@ -119,6 +121,7 @@ export default {
/* card统一样式 */
.el-card.box-card.is-always-shadow {
height: calc(100vh - 116px); /* 控制card布局高度,用于适配 */
+ position: relative;
}
/* card统一样式 */
/deep/.el-card__header {
@@ -128,6 +131,7 @@ export default {
font-size: 17px;
font-weight: 400;
color: #fff;
+ text-shadow: 0 0 9px rgba(21, 255, 198, 0.64);
}
}
}
diff --git a/src/views/systemManagement/safeIndex/index.vue b/src/views/systemManagement/safeIndex/index.vue
new file mode 100644
index 0000000..e69de29
-
- {{ item.companyName }} + {{ item.name }}
- {{ item.companyAddress }} + {{ item.unit }}{{ val }}@@ -58,10 +60,11 @@@@ -78,6 +81,7 @@ import CompanyDataDialog from "./components/companyDataDialog"; import ClearDialog from "./components/clearDialog"; import { getCompanyList } from "@/api/systemManagement"; +import { debounce } from "@/utils/publicMethod_lxy/debounce.js"; export default { name: "companyList", components: { @@ -87,18 +91,7 @@ export default { data() { return { searchCompany: "", - company_data: [ - // { - // value: "1", - // name: "宁波镇海兴达化工有限公司", - // unit: "宁波镇海兴达化工有限公司工业园", - // }, - // { value: "2" }, - // { value: "3" }, - // { value: "4" }, - // { value: "5" }, - // { value: "6" }, - ], + company_data: [], pageSize: 6, pageNum: 1, total: "", @@ -123,11 +116,40 @@ export default { const params = { pageSize: this.pageSize, pageNum: this.pageNum, + companyName: this.searchCompany, // 查询框条件 }; getCompanyList(params).then((res) => { - console.log("res.data", res.data); - this.company_data = res.data; + if (res.code === 200) { + console.log("res.data", res); + this.company_data = res.data; + this.total = res.total; + } else { + this.$message.warnning(res.msg); + } + }); + }, + // 放大镜点击查询防恶意点击 + getData_icon: debounce(function () { + const params = { + pageSize: this.pageSize, + pageNum: this.pageNum, + companyName: this.searchCompany, // 查询框条件 + }; + console.log("params", params); + getCompanyList(params).then((res) => { + if (res.code === 200) { + console.log("res.data", res); + this.company_data = res.data; + this.total = res.total; + } else { + this.$message.warnning(res.msg); + } }); + }, 300), + handleCurrentChange(val) { + console.log(`当前页: ${val}`); + this.pageNum = val; + this.getData(); }, }, }; @@ -136,6 +158,7 @@ export default { /* card统一样式 */ .el-card.box-card.is-always-shadow { height: calc(100vh - 116px); /* 控制card布局高度,用于适配 */ + position: relative; /* card统一样式 */ /deep/.el-card__header { border-bottom: 1px solid #a1a1a1 !important; @@ -144,6 +167,7 @@ export default { font-size: 17px; font-weight: 400; color: #fff; + text-shadow: 0 0 9px rgba(21, 255, 198, 0.64); } } } @@ -185,7 +209,7 @@ export default { } } .top_search_button { - width: 10%; + width: 7%; height: 100%; border-radius: 0px 4px 4px 0px; background: #0e3936; @@ -194,7 +218,7 @@ export default { cursor: pointer; .el-icon-search { color: #fff; - padding: 12% 0; + padding: 11% 0; } } .top_search_button:focus, @@ -206,23 +230,24 @@ export default { .top_add_btn { width: 10%; .el-button { + width: 82%; border: 1px solid #4a6072; color: #fff; border-radius: 0px !important; - background: #323f43; + background: url("~@/assets/companyFile/btn05.png") no-repeat !important; + background-size: 100% 100% !important; } .el-button:focus, .el-button:hover { - color: #34e1b3; - background: url("~@/assets/companyFile/891771.png") no-repeat !important; - background-size: 100% 100% !important; + text-shadow: 0 0 9px #34e1b3; + filter: brightness(150%); } } } /* 公司图片展示区域 */ .center { width: 100%; - height: 640px; + height: 775px; margin-top: 22px; ul { display: flex; @@ -234,20 +259,24 @@ export default { position: relative; list-style: none; width: 30%; - height: 45%; + height: 47%; background: #1b3736; border: 1px solid #fff; img { - width: 100%; - height: 100%; + margin-left: 1%; + margin-top: 1.2%; + width: 99%; + height: 98.4%; } /* 公司图片相关信息区域 */ .company_name { position: absolute; z-index: 2; color: #fff; + text-shadow: 0 0 9px #ffe6d9; left: 10px; bottom: 70px; + font-size: 18px; } .company_label { display: flex; @@ -261,7 +290,7 @@ export default { padding: 0px 5px 0px 5px; height: 30px; color: #34e1b3; - background: url("~@/assets/companyFile/891771.png") no-repeat !important; + background: url("~@/assets/companyFile/btn04.png") no-repeat !important; background-size: 100% 100% !important; margin-right: 5px; } @@ -280,42 +309,48 @@ export default { width: 100%; height: 100%; bottom: 0; - background: rgba(101, 101, 101, 0.6); + background: rgba(73, 72, 72, 0.6); color: #ffffff; opacity: 0; /* 图片鼠标经过按钮 */ .btn { margin-left: 25%; - margin-top: 28%; + margin-top: 30%; button { - height: 35px; - margin-right: 15px; - font-size: 20px; + height: 40px; + margin-right: 25px; + font-size: 18px; color: #fff; border: 1px; border-radius: 0px; cursor: pointer; } button.check { - background: #126a58; + background: url("~@/assets/companyFile/btn05.png") no-repeat !important; + background-size: 100% 100% !important; } /* 点击高亮 */ + button.check:hover, button.check:focus { - background: #29b397; + filter: brightness(150%); } button.change { - background: rgb(7, 72, 92); + background: url("~@/assets/companyFile/btn06.png") no-repeat !important; + background-size: 100% 100% !important; } /* 点击高亮 */ + button.change:hover, button.change:focus { - background: rgb(19, 125, 158); + filter: brightness(150%); } button.clear { - background: rgb(107, 14, 14); + background: url("~@/assets/companyFile/btn07.png") no-repeat !important; + background-size: 100% 100% !important; } /* 点击高亮 */ + button.clear:hover, button.clear:focus { - background: rgb(151, 28, 28); + filter: brightness(150%); } } } @@ -324,12 +359,21 @@ export default { opacity: 1; cursor: default; } + li:hover .company_label_data { + opacity: 0; + } + li:hover span { + opacity: 0; + } } } /* 底部分页展示区域 */ .footer { .el-pagination { - margin-left: 75%; + margin-left: 59%; + /deep/.el-pagination__total { + color: #fff; + } /deep/.el-input__inner { border-radius: 0px; background: #3c4b4a; diff --git a/src/views/systemManagement/companyScore/index.vue b/src/views/systemManagement/companyScore/index.vue new file mode 100644 index 0000000..e69de29 diff --git a/src/views/systemManagement/components/leftNav.vue b/src/views/systemManagement/components/leftNav.vue index 4d08f7d..91de85e 100644 --- a/src/views/systemManagement/components/leftNav.vue +++ b/src/views/systemManagement/components/leftNav.vue @@ -1,7 +1,7 @@ - + + @@ -27,41 +29,50 @@ export default { data() { return { isCollapse: false, + activeIndex: "/", menu: [ // 导航数组 { path: "/safeIndex", name: "safeIndex", label: "平安指数", - icon: "folder-checked", + src: require("@/assets/companyFile/menu01.png"), }, { path: "/companyScore", name: "companyScore", label: "企业赋分", - icon: "folder-checked", + src: require("@/assets/companyFile/menu02.png"), }, { path: "/companyList", name: "companyList", label: "企业名单", - icon: "folder-checked", + src: require("@/assets/companyFile/menu03.png"), }, { path: "/correlationEquipment", name: "correlationEquipment", label: "关联设备", - icon: "folder-checked", + src: require("@/assets/companyFile/menu04.png"), }, ], }; }, + watch: { + $route() { + this.setCurrentRoute(); + }, + }, computed: { menuList() { // 一级菜单导航 return this.menu.filter((item) => !item.children); }, }, + created() { + this.setCurrentRoute(); + }, methods: { // 点击跳转路由 clickMenu(val) { @@ -69,6 +80,9 @@ export default { name: val.name, }); }, + setCurrentRoute() { + this.activeIndex = this.$route.path; //监听到当前路由状态并激活当前菜单 + }, handleOpen(key, keyPath) { console.log(key, keyPath); }, @@ -88,14 +102,29 @@ export default { } .el-menu-vertical-demo.el-menu { .el-menu-item { + width: 240px; + margin-top: 20px; + margin-left: 17px; color: #fff; font-size: 18px; + background: url("~@/assets/companyFile/921.png") no-repeat; + background-size: 100% 100%; + i { + margin-right: 10px; + width: 20px; + height: 20px; + img { + margin-bottom: 4px; + width: 20px; + height: 20px; + } + } } .el-menu-item:focus, .el-menu-item:hover { /* 导航选项点击触碰效果 */ - background: #daf4f6; - color: #5a5e66; + filter: brightness(150%); + text-shadow: 0 0 9px rgba(21, 255, 198, 0.64); } } \ No newline at end of file diff --git a/src/views/systemManagement/correlationEquipment/index.vue b/src/views/systemManagement/correlationEquipment/index.vue index b7a3540..da6ec1a 100644 --- a/src/views/systemManagement/correlationEquipment/index.vue +++ b/src/views/systemManagement/correlationEquipment/index.vue @@ -4,6 +4,8 @@+ {{ item.label }}
+ +