From 1445c7e1f76c4628f4619cf67150a63d6f8f5e90 Mon Sep 17 00:00:00 2001 From: mg <maokecheng@163.com> Date: 星期二, 01 十一月 2022 09:04:16 +0800 Subject: [PATCH] Merge branch 'master' of http://42.193.1.25:9521/r/sccg_ui --- src/store/system/loudspeaker/index.js | 18 src/views/systemSetting/device/loudspeaker/components/dialogForm.vue | 256 +++++++++++ src/api/system/handheldTerminal.js | 37 + src/api/system/loudspeaker.js | 37 + src/store/index.js | 23 src/views/systemSetting/device/loudspeaker/index.vue | 295 ++++++++++++ src/store/system/handheldTerminal/index.js | 18 src/views/systemSetting/device/handheldTerminal/index.vue | 291 ++++++++++++ src/router/index.js | 11 src/views/layout/components/Menu/index.vue | 1 src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue | 340 ++++++++++++++ 11 files changed, 1,316 insertions(+), 11 deletions(-) diff --git a/src/api/system/handheldTerminal.js b/src/api/system/handheldTerminal.js new file mode 100644 index 0000000..d9f0e8c --- /dev/null +++ b/src/api/system/handheldTerminal.js @@ -0,0 +1,37 @@ +import axios from "axios"; +import { + getToken +} from '@/utils/helper' +const baseUrl = '/sccg/equipment_handheld_terminal' +const token = { + 'Authorization': getToken() +} +export default { + // 鑾峰彇鍒楄〃 + getHandheldTerminalList: (data) => axios({ + method: 'get', + url: baseUrl + '/query', + headers: { + ...token + }, + params: data + }), + // 鏂板 + saveHandheldTerminal: (data) => axios({ + method: 'post', + url: baseUrl + '/add', + headers: { + ...token + }, + data: data + }), + // 鏂板 + updateHandheldTerminal: (data) => axios({ + method: 'put', + url: baseUrl + '/update', + headers: { + ...token + }, + data: data + }) +}; \ No newline at end of file diff --git a/src/api/system/loudspeaker.js b/src/api/system/loudspeaker.js new file mode 100644 index 0000000..11c5e47 --- /dev/null +++ b/src/api/system/loudspeaker.js @@ -0,0 +1,37 @@ +import axios from "axios"; +import { + getToken +} from '@/utils/helper' +const baseUrl = '/sccg/equipment_loudspeaker' +const token = { + 'Authorization': getToken() +} +export default { + // 鑾峰彇鍒楄〃 + getLoudspeakerList: (data) => axios({ + method: 'get', + url: baseUrl + '/query', + headers: { + ...token + }, + params: data + }), + // 鏂板 + saveLoudspeaker: (data) => axios({ + method: 'post', + url: baseUrl + '/add', + headers: { + ...token + }, + data: data + }), + // 鏂板 + updateLoudspeaker: (data) => axios({ + method: 'put', + url: baseUrl + '/update', + headers: { + ...token + }, + data: data + }) +}; \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index 1cc1661..38af357 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -84,6 +84,17 @@ path: 'point', name: 'point', component: () => import('@/views/systemSetting/device/point'), + }, + { + path: 'handheldTerminal', + name: 'handheldTerminal', + component: () => import('@/views/systemSetting/device/handheldTerminal'), + } + , + { + path: 'loudspeaker', + name: 'loudspeaker', + component: () => import('@/views/systemSetting/device/loudspeaker'), } ] } diff --git a/src/store/index.js b/src/store/index.js index 6a2d4a6..c271a66 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -3,19 +3,22 @@ import users from "./users" import logs from "./logs" import bayonet from './system/bayonet' +import loudspeaker from './system/loudspeaker' +import handheldTerminal from './system/handheldTerminal' import shortMessage from './operate/managenment/shortMessage' Vue.use(Vuex) export default new Vuex.Store({ - state: { - }, - getters: { - }, - mutations: { - }, - actions: { - }, + state: {}, + getters: {}, + mutations: {}, + actions: {}, modules: { - users,logs,bayonet,shortMessage + users, + logs, + bayonet, + shortMessage, + loudspeaker, + handheldTerminal } -}) +}) \ No newline at end of file diff --git a/src/store/system/handheldTerminal/index.js b/src/store/system/handheldTerminal/index.js new file mode 100644 index 0000000..3dc7ab2 --- /dev/null +++ b/src/store/system/handheldTerminal/index.js @@ -0,0 +1,18 @@ +import loudspeakerApi from "@/api/system/loudspeaker"; +export default { + namespaced: true, + state: { + userInfo: {}, + }, + actions: { + getLoudspeakerList(context, params) { + return loudspeakerApi.getLoudspeakerList(params); + }, + saveLoudspeaker(context, params) { + return loudspeakerApi.saveLoudspeaker(params); + }, + updateLoudspeaker(context, params) { + return loudspeakerApi.updateLoudspeaker(params); + }, + }, +}; \ No newline at end of file diff --git a/src/store/system/loudspeaker/index.js b/src/store/system/loudspeaker/index.js new file mode 100644 index 0000000..3dc7ab2 --- /dev/null +++ b/src/store/system/loudspeaker/index.js @@ -0,0 +1,18 @@ +import loudspeakerApi from "@/api/system/loudspeaker"; +export default { + namespaced: true, + state: { + userInfo: {}, + }, + actions: { + getLoudspeakerList(context, params) { + return loudspeakerApi.getLoudspeakerList(params); + }, + saveLoudspeaker(context, params) { + return loudspeakerApi.saveLoudspeaker(params); + }, + updateLoudspeaker(context, params) { + return loudspeakerApi.updateLoudspeaker(params); + }, + }, +}; \ No newline at end of file diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue index 6c339eb..3599b9d 100644 --- a/src/views/layout/components/Menu/index.vue +++ b/src/views/layout/components/Menu/index.vue @@ -82,7 +82,6 @@ if (info && info.menus) { clearTimeout(timer); this.menuList = info.menus; - console.log(info.menus); } else { timer = setInterval(() => { this.loadMenu(); diff --git a/src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue b/src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue new file mode 100644 index 0000000..f231b83 --- /dev/null +++ b/src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue @@ -0,0 +1,340 @@ +<template> + <div class="create"> + <main> + <div class="mainContent"> + <el-form + ref="formRef" + label-width="140px" + :rules="createRules" + autoComplete="on" + :model="form" + label-position="right" + > + <!-- 鍗曞叺鍚嶇О --> + <el-form-item class="optionItem" label="鍗曞叺鍚嶇О:" prop="name"> + <el-input + v-model="form.name" + placeholder="璇峰~鍐欏崟鍏靛悕绉�" + ></el-input> + </el-form-item> + <!-- 鍗曞叺缂栧彿 --> + <el-form-item class="optionItem" label="鍗曞叺缂栧彿:" prop="code"> + <el-input + v-model="form.code" + placeholder="璇峰~鍐欏崟鍏电紪鍙�" + ></el-input> + </el-form-item> + <!-- 浣跨敤浜哄憳 --> + <el-form-item class="optionItem" label="浣跨敤浜哄憳:" prop="user"> + <el-input + v-model="form.user" + placeholder="璇峰~鍐欎娇鐢ㄤ汉鍛�" + ></el-input> + </el-form-item> + <!-- 鑱旂郴鏂瑰紡 --> + <el-form-item class="optionItem" label="鑱旂郴鏂瑰紡:" prop="phone"> + <el-input + v-model="form.phone" + placeholder="璇峰~鍐欒仈绯绘柟寮�" + ></el-input> + </el-form-item> + <!-- 閮ㄩ棬 --> + <el-form-item class="optionItems" label="鎵�灞為儴闂�:" prop="departId"> + <el-select v-model="form.departId" placeholder="璇疯緭鍏ユ墍灞為儴闂�"> + <el-option :value="mylabel"> + <el-tree + ref="tree" + :check-strictly="true" + :data="departList" + :props="defaultProps" + show-checkbox + @check-change="handleCheck" + default-expand-all + node-key="id" + > + </el-tree> + </el-option> + </el-select> + </el-form-item> + <el-form-item> + <div class="optionBtn"> + <el-button + type="primary" + class="btn submit" + @click.native.prevent="handleUpdateLawCar" + >纭 + </el-button> + </div> + </el-form-item> + </el-form> + </div> + </main> + </div> +</template> + <script> +import { validatePhone, validateName } from "@/utils/validate"; +export default { + data() { + const checkName = (rule, value, callback) => { + if (value) { + if (validateName(value)) { + callback(); + } else { + callback(new Error("璇锋纭緭鍏ュ崟鍏靛悕绉�")); + } + } else { + callback(new Error("鍗曞叺鍚嶇О涓嶈兘涓虹┖")); + } + }; + const checkCode = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error("鍗曞叺缂栫爜涓嶈兘涓虹┖")); + } + }; + const checkDepartId = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error("鎵�灞為儴闂ㄤ笉鑳戒负绌�")); + } + }; + const checkUser = (rule, value, callback) => { + if (value) { + if (validateName(value)) { + callback(); + } else { + callback(new Error("璇锋纭緭鍏ヤ娇鐢ㄤ汉鍛�")); + } + } else { + callback(new Error("浣跨敤浜哄憳涓嶈兘涓虹┖")); + } + }; + const checkPhone = (rule, value, callback) => { + if (value) { + if (validatePhone(value)) { + callback(); + } else { + callback(new Error("璇疯緭鍏ユ纭殑鎵嬫満鍙�")); + } + } else { + callback(new Error("鎵嬫満鍙风爜涓嶈兘涓虹┖")); + } + }; + return { + form: { + carNumber: "", + contact: "", + ownerName: "", + trajectory: "", + vehicleUser: "", + departName: "", + departId: 0, + }, + createRules: { + departId: [ + { + required: true, + trigger: "blur", + validator: checkDepartId, + }, + ], + name: [ + { + required: true, + trigger: "blur", + validator: checkName, + }, + ], + code: [ + { + required: true, + trigger: "blur", + validator: checkCode, + }, + ], + user: [ + { + required: true, + trigger: "blur", + validator: checkUser, + }, + ], + phone: [ + { + required: true, + trigger: "blur", + validator: checkPhone, + }, + ], + // id: 0, + ownerName: [ + { + required: true, + trigger: "blur", + validator: checkName, + }, + ], + // vehicleUser: [ + // { + // required: true, trigger: 'blur', validator: checkUser + // } + // ] + }, + selectOrg: { + orgsid: [], + }, + mylabel: "", + departList: [], + defaultProps: { + children: "children", + label: "departName", + }, + }; + }, + created() { + const { getDepartTree } = this; + // 鍒濆鍖栭儴闂ㄦ爲 + getDepartTree(); + // 鍒濆鍖栨暟鎹� + this.form = JSON.parse(JSON.stringify(this.info)); + if (!this.form.departName) { + this.form.departName = this.form.pdepartName; + } + }, + methods: { + // 淇敼鎵ф硶杞� + handleUpdateLawCar() { + this.$refs.formRef.validate((valid) => { + if (valid) { + const { form } = this; + this.$axios({ + method: "put", + url: "sccg/car_Manage/modification_enforce", + data: { + ...form, + }, + }).then((res) => { + if (res.code === 200) { + this.$message({ + type: "success", + message: "淇敼杞﹁締鎴愬姛", + }); + this.$emit("closeDialog", { flag: false, index: 1 }); + } else { + this.$message({ + type: "error", + message: res.message, + }); + } + }); + } else { + return false; + } + }); + }, + // 閮ㄩ棬淇敼 + handleCheck(data, checked) { + this.form.departId = data.id; + this.form.departName = data.departName; + // 鑾峰彇褰撳墠閫夋嫨鐨刬d鍦ㄦ暟缁勪腑鐨勭储寮� + const indexs = this.selectOrg.orgsid.indexOf(data.id); + // 濡傛灉涓嶅瓨鍦ㄦ暟缁勪腑锛屽苟涓旀暟缁勪腑宸茬粡鏈変竴涓猧d骞朵笖checked涓簍rue鐨勬椂鍊欙紝浠h〃涓嶈兘鍐嶆閫夋嫨銆� + if (indexs < 0 && this.selectOrg.orgsid.length === 1 && checked) { + this.$message({ + message: "鍙兘閫夋嫨涓�涓儴闂紒", + type: "warning", + showClose: true, + }); + // 璁剧疆宸查�夋嫨鐨勮妭鐐逛负false 寰堥噸瑕� + this.$refs.tree.setChecked(data, false); + } else if (this.selectOrg.orgsid.length === 0 && checked) { + // 鍙戠幇鏁扮粍涓虹┖ 骞朵笖鏄凡閫夋嫨 + // 闃叉鏁扮粍鏈夊�硷紝棣栧厛娓呯┖锛屽啀push + this.selectOrg.orgsid = []; + this.selectOrg.orgsid.push(data.id); + } else if ( + indexs >= 0 && + this.selectOrg.orgsid.length === 1 && + !checked + ) { + // 鍐嶆鐩存帴杩涜璧嬪�间负绌烘搷浣� + this.selectOrg.orgsid = []; + this.form.departName = ""; + } + }, + // 鑾峰彇閮ㄩ棬鏍� + getDepartTree() { + this.$axios.get("/sccg/depart/tree").then((res) => { + this.departList = res.data; + }); + }, + }, + props: ["info", "closeDialog"], +}; +</script> + <style lang="scss" scoped> +.create { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/systemSetting/device/handheldTerminal/index.vue b/src/views/systemSetting/device/handheldTerminal/index.vue new file mode 100644 index 0000000..c7ba97f --- /dev/null +++ b/src/views/systemSetting/device/handheldTerminal/index.vue @@ -0,0 +1,291 @@ +<template> + <div class="list"> + <header> + <div class="header-content"> + <div class="search"> + <span style="padding-right: 20px">绛涢�夋潯浠�:</span> + <el-select v-model="context" placeholder="绛涢�夋潯浠�"> + <el-option + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + </div> + </div> + </header> + <main> + <div class="main-content"> + <div class="main-title"> + <el-button + class="el-icon-plus" + type="primary" + @click="dialogCreate = true" + >娣诲姞</el-button + > + </div> + <!-- 鏁版嵁灞曠ず --> + <el-table + ref="multipleTable" + :header-cell-style="{ + background: '#06122c', + 'font-size': '12px', + color: '#4b9bb7', + 'font-weight': '650', + 'line-height': '45px', + }" + :data="list" + style="width: 100%" + > + <el-table-column type="selection" min-width="5"> </el-table-column> + <el-table-column prop="name" label="鍗曞叺鍚嶇О" min-width="10"> + </el-table-column> + <el-table-column prop="code" label="鍗曞叺缂栧彿" min-width="10"> + </el-table-column> + <el-table-column prop="user" label="浣跨敤浜哄憳" min-width="10"> + </el-table-column> + <el-table-column prop="phone" label="鑱旂郴鏂瑰紡" min-width="10"> + </el-table-column> + <el-table-column prop="pDepartName" label="鎵�灞為儴闂�" min-width="10"> + </el-table-column> + <el-table-column prop="departName" label="鎵�灞炲ぇ闃�" min-width="10"> + </el-table-column> + + <el-table-column + prop="state" + :formatter="formatSate" + label="鐘舵��" + min-width="5" + > + </el-table-column> + + <el-table-column prop="operation" label="鎿嶄綔" min-width="20"> + <template slot-scope="scope"> + <div class="btn"> + <span @click="handleEdit(scope.row)">缂栬緫</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">鍒犻櫎</span> + </div> + </template> + </el-table-column> + </el-table> + </div> + </main> + <footer> + <!-- 娣诲姞闊虫煴 --> + <el-dialog + title="娣诲姞闊虫煴" + :visible.sync="dialogCreate" + width="60%" + :before-close="handleClose" + > + <MyForm :info="loudspeakerInfo" :closeDialog="null"></MyForm> + </el-dialog> + </footer> + </div> +</template> + <script> +import { createNamespacedHelpers } from "vuex"; +const { mapActions } = createNamespacedHelpers("loudspeaker"); +import MyForm from "./components/dialogForm.vue"; + +export default { + components: { + MyForm, + }, + data() { + return { + dialogCreate: false, + context: 0, + options: [ + { + value: null, + label: "鍏ㄩ儴", + }, + { + value: 1, + label: "鍦ㄧ嚎", + }, + { + value: 0, + label: "绂荤嚎", + }, + ], + list: [], + current: 1, + size: 10, + loudspeakerInfo: { + id: 0, + name: "", + code: "", + power: "", + frequencyResponse: "", + fullRangeSpeaker: "", + }, + }; + }, + created() { + this.setTableData(); + }, + methods: { + ...mapActions([ + "getLoudspeakerList", + "saveLoudspeaker", + "updateLoudspeaker", + ]), + formatSate(row, column) { + return row.state == 1 ? "鍦ㄧ嚎" : "绂荤嚎"; + }, + // 寮圭獥鍏抽棴 + handleClose(done) { + this.$confirm("纭鍏抽棴?").then((_) => { + done(); + }); + }, + // 璁剧疆tableData + setTableData() { + const { current, size, context } = this; + let arr = this.getLoudspeakerList({ + current, + size, + }).then((res) => { + this.list = arr.data.data; + }); + }, + }, +}; +</script> + <style lang="scss" scoped> +.list { + text-align: left; + margin: 10px 20px; + color: #4b9bb7; + + header { + background-color: #09152f; + border: 1pox solid #fff; + + .header-content { + padding: 0 40px; + display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + } + } + } + + main { + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; + + .main-title { + line-height: 60px; + padding: 10px 20px; + } + + .tools { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; + border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .el-pagination { + &::v-deep li, + &::v-deep .btn-prev, + &::v-deep .btn-next { + background-color: #071f39; + color: #4b9bb7; + } + + &::v-deep .active { + background-color: #409eff; + color: #fff; + } + } + } + } + + .el-table { + color: #4b9bb7; + font-size: 10px; + + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } + } + } + } +} +</style> \ No newline at end of file diff --git a/src/views/systemSetting/device/loudspeaker/components/dialogForm.vue b/src/views/systemSetting/device/loudspeaker/components/dialogForm.vue new file mode 100644 index 0000000..39a5e0e --- /dev/null +++ b/src/views/systemSetting/device/loudspeaker/components/dialogForm.vue @@ -0,0 +1,256 @@ +<template> + <div class="create"> + <main> + <div class="mainContent"> + <el-form + ref="formRef" + label-width="140px" + :rules="createCarRules" + autoComplete="on" + :model="form" + label-position="right" + > + <!-- 闊虫煴鍚嶇О --> + <el-form-item class="optionItem" label="闊虫煴鍚嶇О:" prop="name"> + <el-input + v-model="form.name" + placeholder="璇峰~鍐欓煶鏌卞悕绉�" + ></el-input> + </el-form-item> + <!-- 闊虫煴缂栧彿 --> + <el-form-item class="optionItem" label="闊虫煴缂栧彿:" prop="code"> + <el-input + v-model="form.code" + placeholder="璇峰~鍐欓煶鏌辩紪鍙�" + ></el-input> + </el-form-item> + <!-- 棰濆害鍔熺巼 --> + <el-form-item class="optionItem" label="棰濆害鍔熺巼:" prop="power"> + <el-input + v-model="form.power" + placeholder="璇峰~鍐欓搴﹀姛鐜�" + ></el-input> + </el-form-item> + <!-- 棰戠巼鍝嶅簲 --> + <el-form-item + class="optionItem" + label="棰戠巼鍝嶅簲:" + prop="frequencyResponse" + > + <el-input + v-model="form.frequencyResponse" + placeholder="璇峰~鍐欓鐜囧搷搴�" + ></el-input> + </el-form-item> + <!-- 鍠囧彮鍗曞厓 --> + <el-form-item + class="optionItem" + label="鍠囧彮鍗曞厓:" + prop="fullRangeSpeaker" + > + <el-input + v-model="form.fullRangeSpeaker" + placeholder="璇峰~鍐� 鍠囧彮鍗曞厓" + ></el-input> + </el-form-item> + <el-form-item> + <div class="optionBtn"> + <el-button + type="primary" + class="btn submit" + @click.native.prevent="handleUpdateLawCar" + >纭 + </el-button> + </div> + </el-form-item> + </el-form> + </div> + </main> + </div> +</template> + <script> +export default { + data() { + const checkName = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error("闊虫煴鍚嶇О涓嶈兘涓虹┖")); + } + }; + const checkCode = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error("闊虫煴缂栫爜涓嶈兘涓虹┖")); + } + }; + return { + form: { + id: 0, + name: "", + code: "", + power: "", + frequencyResponse: "", + fullRangeSpeaker: "", + }, + createCarRules: { + name: [ + { + required: true, + trigger: "blur", + validator: checkName, + }, + ], + code: [ + { + required: true, + trigger: "blur", + validator: checkCode, + }, + ], + }, + }; + }, + created() { + // 鍒濆鍖栨暟鎹� + + this.form = JSON.parse(JSON.stringify(this.info)); + }, + methods: { + // 淇敼鎵ф硶杞� + handleUpdateLawCar() { + this.$refs.formRef.validate((valid) => { + if (valid) { + const { form } = this; + this.$axios({ + method: "put", + url: "sccg/car_Manage/modification_enforce", + data: { + ...form, + }, + }).then((res) => { + console.log(res); + if (res.code === 200) { + this.$message({ + type: "success", + message: "淇敼杞﹁締鎴愬姛", + }); + this.$emit("closeDialog", { flag: false, index: 1 }); + } else { + this.$message({ + type: "error", + message: res.message, + }); + } + }); + } else { + return false; + } + }); + }, + // 閮ㄩ棬淇敼 + handleCheck(data, checked) { + console.log(data); + this.form.departId = data.id; + this.form.departName = data.departName; + // 鑾峰彇褰撳墠閫夋嫨鐨刬d鍦ㄦ暟缁勪腑鐨勭储寮� + const indexs = this.selectOrg.orgsid.indexOf(data.id); + // 濡傛灉涓嶅瓨鍦ㄦ暟缁勪腑锛屽苟涓旀暟缁勪腑宸茬粡鏈変竴涓猧d骞朵笖checked涓簍rue鐨勬椂鍊欙紝浠h〃涓嶈兘鍐嶆閫夋嫨銆� + if (indexs < 0 && this.selectOrg.orgsid.length === 1 && checked) { + this.$message({ + message: "鍙兘閫夋嫨涓�涓儴闂紒", + type: "warning", + showClose: true, + }); + // 璁剧疆宸查�夋嫨鐨勮妭鐐逛负false 寰堥噸瑕� + this.$refs.tree.setChecked(data, false); + } else if (this.selectOrg.orgsid.length === 0 && checked) { + // 鍙戠幇鏁扮粍涓虹┖ 骞朵笖鏄凡閫夋嫨 + // 闃叉鏁扮粍鏈夊�硷紝棣栧厛娓呯┖锛屽啀push + this.selectOrg.orgsid = []; + this.selectOrg.orgsid.push(data.id); + } else if ( + indexs >= 0 && + this.selectOrg.orgsid.length === 1 && + !checked + ) { + // 鍐嶆鐩存帴杩涜璧嬪�间负绌烘搷浣� + this.selectOrg.orgsid = []; + this.form.departName = ""; + } + }, + // 鑾峰彇閮ㄩ棬鏍� + getDepartTree() { + this.$axios.get("/sccg/depart/tree").then((res) => { + this.departList = res.data; + }); + }, + }, + props: ["info", "closeDialog"], +}; +</script> + <style lang="scss" scoped> +.create { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/systemSetting/device/loudspeaker/index.vue b/src/views/systemSetting/device/loudspeaker/index.vue new file mode 100644 index 0000000..7a427c8 --- /dev/null +++ b/src/views/systemSetting/device/loudspeaker/index.vue @@ -0,0 +1,295 @@ +<template> + <div class="list"> + <header> + <div class="header-content"> + <div class="search"> + <span style="padding-right: 20px">绛涢�夋潯浠�:</span> + <el-select v-model="context" placeholder="绛涢�夋潯浠�"> + <el-option + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + </div> + </div> + </header> + <main> + <div class="main-content"> + <div class="main-title"> + <el-button + class="el-icon-plus" + type="primary" + @click="dialogCreate = true" + >娣诲姞</el-button + > + </div> + <!-- 鏁版嵁灞曠ず --> + <el-table + ref="multipleTable" + :header-cell-style="{ + background: '#06122c', + 'font-size': '12px', + color: '#4b9bb7', + 'font-weight': '650', + 'line-height': '45px', + }" + :data="list" + style="width: 100%" + > + <el-table-column type="selection" min-width="5"> </el-table-column> + <el-table-column prop="name" label="闊虫煴鍚嶇О" min-width="10"> + </el-table-column> + <el-table-column prop="code" label="闊虫煴缂栧彿" min-width="10"> + </el-table-column> + <el-table-column prop="power" label="棰濆畾鍔熺巼" min-width="10"> + </el-table-column> + <el-table-column + prop="frequencyResponse" + label="棰戠巼鍝嶅簲" + min-width="10" + > + </el-table-column> + <el-table-column + prop="fullRangeSpeaker" + label="鍠囧彮鍗曞厓" + min-width="10" + > + </el-table-column> + <el-table-column + prop="state" + :formatter="formatSate" + label="鐘舵��" + min-width="5" + > + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="20"> + <template slot-scope="scope"> + <div class="btn"> + <span @click="handleEdit(scope.row)">缂栬緫</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">鍒犻櫎</span> + </div> + </template> + </el-table-column> + </el-table> + </div> + </main> + <footer> + <!-- 娣诲姞闊虫煴 --> + <el-dialog + title="娣诲姞闊虫煴" + :visible.sync="dialogCreate" + width="60%" + :before-close="handleClose" + > + <MyForm :info="loudspeakerInfo" :closeDialog="null"></MyForm> + </el-dialog> + </footer> + </div> +</template> + <script> +import { createNamespacedHelpers } from "vuex"; +const { mapActions } = createNamespacedHelpers("loudspeaker"); +import MyForm from "./components/dialogForm.vue"; + +export default { + components: { + MyForm, + }, + data() { + return { + dialogCreate: false, + context: 0, + options: [ + { + value: null, + label: "鍏ㄩ儴", + }, + { + value: 1, + label: "鍦ㄧ嚎", + }, + { + value: 0, + label: "绂荤嚎", + }, + ], + list: [], + current: 1, + size: 10, + loudspeakerInfo: { + id: 0, + name: "", + code: "", + power: "", + frequencyResponse: "", + fullRangeSpeaker: "", + }, + }; + }, + created() { + this.setTableData(); + }, + methods: { + ...mapActions([ + "getLoudspeakerList", + "saveLoudspeaker", + "updateLoudspeaker", + ]), + formatSate(row, column) { + return row.state == 1 ? "鍦ㄧ嚎" : "绂荤嚎"; + }, + // 寮圭獥鍏抽棴 + handleClose(done) { + this.$confirm("纭鍏抽棴?").then((_) => { + done(); + }); + }, + // 璁剧疆tableData + setTableData() { + const { current, size, context } = this; + let arr = this.getLoudspeakerList({ + current, + size, + }).then((res) => { + this.list = arr.data.data; + }); + }, + }, +}; +</script> + <style lang="scss" scoped> +.list { + text-align: left; + margin: 10px 20px; + color: #4b9bb7; + + header { + background-color: #09152f; + border: 1pox solid #fff; + + .header-content { + padding: 0 40px; + display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + } + } + } + + main { + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; + + .main-title { + line-height: 60px; + padding: 10px 20px; + } + + .tools { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; + border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .el-pagination { + &::v-deep li, + &::v-deep .btn-prev, + &::v-deep .btn-next { + background-color: #071f39; + color: #4b9bb7; + } + + &::v-deep .active { + background-color: #409eff; + color: #fff; + } + } + } + } + + .el-table { + color: #4b9bb7; + font-size: 10px; + + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } + } + } + } +} +</style> \ No newline at end of file -- Gitblit v1.8.0