From 2ff4a572df6b098779bc592a0c6e0a90e1b79b2e Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期五, 12 十一月 2021 19:08:00 +0800 Subject: [PATCH] 暂存 --- src/api/helemt.ts | 9 src/pages/internetData/views/helmet.vue | 61 +- src/pages/internetData/components/screening.vue | 194 ++++---- vue.config.js | 108 ++-- src/pages/internetData/views/helemtTable.vue | 775 ++++++++++++++++++++++---------------- 5 files changed, 653 insertions(+), 494 deletions(-) diff --git a/src/api/helemt.ts b/src/api/helemt.ts new file mode 100644 index 0000000..edf546d --- /dev/null +++ b/src/api/helemt.ts @@ -0,0 +1,9 @@ +import request from "@/scripts/httpRequest"; + +export const getHelemtData = (data: any) => { + return request({ + url: "/temp/iotdata/devices", + method: "post", + data + }) +} \ No newline at end of file diff --git a/src/pages/internetData/components/screening.vue b/src/pages/internetData/components/screening.vue index 933f38e..fba5e54 100644 --- a/src/pages/internetData/components/screening.vue +++ b/src/pages/internetData/components/screening.vue @@ -1,118 +1,116 @@ <template> -<div class="screening"> - - <div class="title">璁惧缂栫爜 : </div> - <div class="input_code"> - <el-input - placeholder="璇疯緭鍏ュ唴瀹�" - v-model="code" - clearable> - </el-input> - </div> - + <div class="screening"> + <div class="title">璁惧缂栫爜 :</div> + <div class="input_code"> + <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="code" clearable> </el-input> + </div> - <div class="title electric">鐢甸噺鍖洪棿 : </div> + <div class="title electric">鐢甸噺鍖洪棿 :</div> - <div class="input_elec"> - <el-input - placeholder="璇疯緭鍏�" - v-model="lowerElec" - clearable> - </el-input> - </div> - <div class="font-weight: 700;font-size: 25px;">-</div> - <div class="input_elec"> - <el-input - placeholder="璇疯緭鍏�" - v-model="UpperElec" - clearable> - </el-input> - </div> + <div class="input_elec"> + <el-input placeholder="璇疯緭鍏�" v-model="lowerElec" clearable> </el-input> + </div> + <div class="font-weight: 700;font-size: 25px;">-</div> + <div class="input_elec"> + <el-input placeholder="璇疯緭鍏�" v-model="UpperElec" clearable> </el-input> + </div> - <div class="save">鏌ヨ</div> - <div class="reset">娓呯┖</div> - - -</div> + <div class="save" @click="searchHelmet">鏌ヨ</div> + <div class="reset" @click="resetHelmet">娓呯┖</div> + </div> </template> <script> export default { - data() { - return { - code:'', - lowerElec: '', - UpperElec: '' - } - } -} + data() { + return { + code: "", + lowerElec: "", + UpperElec: "", + }; + }, + methods: { + searchHelmet() { + this.$emit("searchHelmet", { + sn: this.code, + batteryStart: this.lowerElec, + batteryEnd: this.UpperElec, + }); + }, + resetHelmet() { + this.code = ""; + this.lowerElec = ""; + this.UpperElec = ""; + this.$emit("resetHelmet"); + }, + }, +}; </script> <style scoped lang="scss"> .screening { - display: flex; - align-items: center; - padding: 0 20px; - height: 70px; - border-radius: 15px; - background-color: #F2F2F7; + display: flex; + align-items: center; + padding: 0 20px; + height: 70px; + border-radius: 15px; + background-color: #f2f2f7; - .title { - font-size: 14px; - color: #4F4F4F; + .title { + font-size: 14px; + color: #4f4f4f; + } + + .input_code { + margin: 0 20px 0 5px; + width: 250px; + } + + .input_elec { + margin: 0 5px; + width: 130px; + } + + .save { + margin-left: 22%; + margin-right: 10px; + width: 90px; + height: 40px; + border-radius: 10px; + background: #fff; + color: #333333; + font-size: 14px; + line-height: 40px; + cursor: pointer; + + &:hover { + background: #11aa66; + color: #fff; } + } - .input_code { - margin:0 20px 0 5px ; - width: 250px; + .reset { + width: 90px; + height: 40px; + background: #fff; + border-radius: 10px; + color: #333333; + font-size: 14px; + line-height: 40px; + cursor: pointer; + + &:hover { + background: #11aa66; + color: #fff; } + } - .input_elec { - margin:0 5px ; - width: 130px; + .el-input ::v-deep input { + border-radius: 10px; + + &:focus { + border: 1px solid #11aa66; } - - .save { - margin-left: 22%; - margin-right: 10px; - width: 90px; - height: 40px; - border-radius: 10px; - background: #fff; - color: #333333; - font-size: 14px; - line-height: 40px; - cursor: pointer; - - &:hover { - background: #11AA66; - color: #fff; - } - } - - .reset { - width: 90px; - height: 40px; - background: #fff; - border-radius: 10px; - color: #333333; - font-size: 14px; - line-height: 40px; - cursor: pointer; - - &:hover { - background: #11AA66; - color: #fff; - } - } - - .el-input ::v-deep input { - border-radius: 10px; - - &:focus { - border: 1px solid #11AA66; - } - } - + } } </style> \ No newline at end of file diff --git a/src/pages/internetData/views/helemtTable.vue b/src/pages/internetData/views/helemtTable.vue index 5c80651..011b96e 100644 --- a/src/pages/internetData/views/helemtTable.vue +++ b/src/pages/internetData/views/helemtTable.vue @@ -1,202 +1,321 @@ <template> -<div class="helemtTable"> -<el-table - :data="tableData" - style="width: 100%" - header-align="center" - :highlight-current-row="true" + <div class="helemtTable"> + <el-table + :data="helemtArr" + style="width: 100%" + header-align="center" + :highlight-current-row="true" > - <el-table-column - header-align="center" - label="搴忓彿" - align="center" - width="80" - type="index"> - </el-table-column> + <el-table-column + header-align="center" + label="搴忓彿" + align="center" + width="60" + type="index" + > + </el-table-column> - <el-table-column - header-align="center" - label="璁惧" - width="260"> - <template slot-scope="scope"> - <div class="index-container"> + <el-table-column header-align="center" label="璁惧" width="280"> + <template slot-scope="scope"> + <div class="index-container"> <div class="icon iconfont"></div> <div class="right"> - <div class="code">璁惧缂栫爜 : {{scope.row.code}}</div> - <div class="elec">鐢甸噺 : - <span - :class="{ 'elec-high': scope.row.elec >= 40, - 'elec-middle': scope.row.elec < 40 && scope.row.elec > 0, - 'elec-low': scope.row.elec === 0}" - >{{scope.row.elec}}</span></div> + <div class="code">璁惧缂栫爜 : {{ scope.row.device_sn }}</div> + <div class="elec"> + 鐢甸噺 : + <span + :class="{ + 'elec-high': scope.row.battery >= 40, + 'elec-middle': + scope.row.battery < 40 && scope.row.battery > 0, + 'elec-low': scope.row.battery === 0, + }" + >{{ scope.row.battery }}</span + > + </div> </div> - </div> - </template> - </el-table-column> + </div> + </template> + </el-table-column> - <el-table-column - header-align="center" - align="center" + <el-table-column + header-align="center" + align="center" prop="ip" - label="IP鍦板潃"> - </el-table-column> + label="IP鍦板潃" + > + </el-table-column> - <el-table-column - header-align="center" - align="center" + <el-table-column + header-align="center" + align="center" prop="mac" label="mac鍦板潃" - width="140"> - </el-table-column> + width="140" + > + </el-table-column> - <el-table-column - header-align="center" - align="center" - prop="longitude" - label="缁忓害"> - </el-table-column> - - <el-table-column - header-align="center" - align="center" - prop="latitude" - label="绾害"> - </el-table-column> - - <el-table-column - header-align="center" - align="center" - prop="latitude" - label="鍦板潃"> - </el-table-column> - - <el-table-column + <el-table-column header-align="center" align="center" - prop="height" - label="楂樺害"> - </el-table-column> + prop="lng" + label="缁忓害" + > + </el-table-column> - <el-table-column + <el-table-column header-align="center" align="center" - prop="positon" - label="瀹氫綅鐘舵��"> - </el-table-column> + prop="lat" + label="绾害" + > + </el-table-column> - <el-table-column + <el-table-column + header-align="center" + align="center" + prop="locate_state" + label="鍦板潃" + > + </el-table-column> + + <el-table-column + header-align="center" + align="center" + prop="high" + label="楂樺害" + > + </el-table-column> + + <el-table-column + header-align="center" + align="center" + prop="gps_type" + label="瀹氫綅鐘舵��" + > + </el-table-column> + + <el-table-column align="center" header-align="center" - prop="time" - label="璁块棶鏃堕棿"> - </el-table-column> + prop="visit_time" + label="璁块棶鏃堕棿" + > + </el-table-column> - <el-table-column - align="center" - header-align="center" - label="鎿嶄綔"> + <el-table-column align="center" header-align="center" label="鎿嶄綔"> <template slot-scope="scope"> - <div class="action-container"> - <img src="/images/InternetData/瑙嗛.png" alt="" - v-if="!scope.row.isSend" - @click="sendVoice(scope.row)" - > - <img src="/images/InternetData/瑙嗛_鐐瑰嚮.png" alt="" - v-else - @click="sendVoice(scope.row)" - > - <img src="/images/InternetData/璇煶.png" alt="" - v-if="!scope.row.istele" - @click="telephone(scope.row)" - > - <img src="/images/InternetData/璇煶_鐐瑰嚮.png" alt="" - v-else - @click="telephone(scope.row)" - > - </div> - </template> - </el-table-column> + <div class="action-container"> + <img + src="/images/InternetData/瑙嗛.png" + alt="" + v-if="!scope.row.isSend" + @click="sendVoice(scope.row)" + /> + <img + src="/images/InternetData/瑙嗛_鐐瑰嚮.png" + alt="" + v-else + @click="sendVoice(scope.row)" + /> + <img + src="/images/InternetData/璇煶.png" + alt="" + v-if="!scope.row.istele" + @click="telephone(scope.row)" + /> + <img + src="/images/InternetData/璇煶_鐐瑰嚮.png" + alt="" + v-else + @click="telephone(scope.row)" + /> + </div> + </template> + </el-table-column> + </el-table> + <el-pagination + background + :total="total" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + :current-page.sync="currentPage" + :page-sizes="[2, 10, 15, 20]" + :page-size="page_size" + popper-class="page_helemt" + layout="prev, pager, next,sizes,jumper" + > + </el-pagination> + <telephoneBox :tele="telephoneObj" v-if="telephoneObj" @close="closeTele" /> - </el-table> - - <el-pagination - background - :total="100" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - :current-page.sync="currentPage" - :page-sizes="[5, 10, 15, 20]" - :page-size="10" - popper-class="page_helemt" - layout="prev, pager, next,sizes,jumper" - > - </el-pagination> - - <telephoneBox :tele="telephoneObj" v-if="telephoneObj" @close="closeTele"/> - - <div class="mask" v-if="telephoneObj"></div> - -</div> - + <div class="mask" v-if="telephoneObj"></div> + </div> </template> <script> -import telephoneBox from '@/pages/internetData/components/telephoneBox' +import telephoneBox from "@/pages/internetData/components/telephoneBox"; +import { getHelemtData } from "@/api/helemt"; export default { - data (){ + name: "helemtTable", + data() { return { - currentPage:1, + currentPage: 1, + page_size: 10, + total: 10, tableData: [ - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:29.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:0, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, - {code: "A123123123123", elec:79.1, ip:"192.168.1.2", mac:"ec:da:da:da:ed:98", - longitude:120.123123, latitude:120.123123,height:"11.21",time:"0.23.45",positon:"鍗曞悜瀹氫綅", - isSend:false,istele:false - }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 29.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 0, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, + { + code: "A123123123123", + elec: 79.1, + ip: "192.168.1.2", + mac: "ec:da:da:da:ed:98", + longitude: 120.123123, + latitude: 120.123123, + height: "11.21", + time: "0.23.45", + positon: "鍗曞悜瀹氫綅", + isSend: false, + istele: false, + }, ], - commentContent:'', - telephoneObj:null - } + helemtArr: [], + commentContent: "", + telephoneObj: null, + }; }, - methods :{ - sendVoice (target){ - target.isSend = true + created() { + this.getHelemtArr({ + page: this.currentPage, + pageSize: this.page_size, + }); + }, + methods: { + async getHelemtArr(data) { + const res = await getHelemtData(data); + console.log(res); + this.helemtArr = res.data.items; + this.total = res.data.total; + }, + sendVoice(target) { + target.isSend = true; const h = this.$createElement; this.$msgbox({ @@ -204,86 +323,107 @@ "div", { attrs: { - class: "el-textarea" - } + class: "el-textarea", + }, }, - [ h( - "div", - { - attrs: { - class: "el-title" - } - },[h("span",{ - attrs: { - class: "icon iconfont" - } - },"\ue7cc"),h("span",null,"鍙戦�佽闊�")]), + [ + h( + "div", + { + attrs: { + class: "el-title", + }, + }, + [ + h( + "span", + { + attrs: { + class: "icon iconfont", + }, + }, + "\ue7cc" + ), + h("span", null, "鍙戦�佽闊�"), + ] + ), h("textarea", { attrs: { placeholder: "璇疯緭鍏ヨ闊冲懡浠�", - maxlength:"20", + maxlength: "20", class: "el-textarea__inner", autocomplete: "off", rows: 3, id: "commentContent", - }, value: this.commentContent, - on: { input: this.onCommentInputChange } + on: { input: this.onCommentInputChange }, }), - h("div",{attrs:{class:"info",id: "comment_info"}},"杩樺彲杈撳叆20涓瓧绗�") + h( + "div", + { attrs: { class: "info", id: "comment_info" } }, + "杩樺彲杈撳叆20涓瓧绗�" + ), ] ), showCancelButton: true, confirmButtonText: "纭畾", - confirmButtonClass:"hele_btn_save", - cancelButtonClass:"hele_btn_cancel", + confirmButtonClass: "hele_btn_save", + cancelButtonClass: "hele_btn_cancel", cancelButtonText: "鍙栨秷", beforeClose: (action, instance, done) => { - document.querySelector("#commentContent").value = '' - document.querySelector("#comment_info").innerHTML = `杩樺彲杈撳叆20涓瓧绗 - target.isSend = false - done(); - } - }).then(action => { - target.isSend = false - + document.querySelector("#commentContent").value = ""; + document.querySelector( + "#comment_info" + ).innerHTML = `杩樺彲杈撳叆20涓瓧绗; + target.isSend = false; + done(); + }, + }).then((action) => { + target.isSend = false; }); - - - }, - telephone (target){ - target.istele = true - this.telephoneObj = target + telephone(target) { + target.istele = true; + this.telephoneObj = target; }, - handleCurrentChange (){ - + handleCurrentChange(val) { + this.currentPage = val; + this.getHelemtArr({ + page: this.currentPage, + pageSize: this.page_size, + }); }, - handleSizeChange (){ - + handleSizeChange(val) { + this.page_size = val; + this.getHelemtArr({ + page: this.currentPage, + pageSize: this.page_size, + }); }, - onCommentInputChange(){ - let value = document.querySelector("#commentContent").value + onCommentInputChange() { + let value = document.querySelector("#commentContent").value; console.log(value); - let cont = 20-value.length - document.querySelector("#comment_info").innerHTML = `杩樺彲杈撳叆${cont}涓瓧绗 + let cont = 20 - value.length; + document.querySelector( + "#comment_info" + ).innerHTML = `杩樺彲杈撳叆${cont}涓瓧绗; }, - closeTele(e){ - e.istele = false - this.telephoneObj = null - } + closeTele(e) { + e.istele = false; + this.telephoneObj = null; + }, }, - components :{ - telephoneBox - } -} + components: { + telephoneBox, + }, +}; </script> <style scoped lang="scss"> .helemtTable { position: relative; - .el-table { + .el-table { overflow-y: scroll; height: 660px; font-size: 12px; @@ -301,75 +441,73 @@ .index-container { display: flex; align-items: center; - justify-content: space-around; height: 56px; .icon { font-size: 46px; - color: #FFAA44; + color: #ffaa44; + margin-right: 10px; } } - ::v-deep .el-table__row{ + ::v-deep .el-table__row { td { - border-bottom: 2px solid #fff; - border-top: 2px solid #fff; + border-bottom: 2px solid #fff; + border-top: 2px solid #fff; - &:first-child { - border-radius: 20px 0 0 20px; - border-left: 2px solid #fff; - border-bottom: 2px solid #fff; - } + &:first-child { + border-radius: 20px 0 0 20px; + border-left: 2px solid #fff; + border-bottom: 2px solid #fff; + } - &:last-child { - border-radius: 0 20px 20px 0; - border-right: 2px solid #fff; - border-bottom: 2px solid #fff; - } + &:last-child { + border-radius: 0 20px 20px 0; + border-right: 2px solid #fff; + border-bottom: 2px solid #fff; + } } &:hover { - background-color: rgb(242, 242, 247) ; + background-color: rgb(242, 242, 247); td { - border-bottom: 2px solid rgb(242, 242, 247); - border-top: 2px solid rgb(242, 242, 247); + border-bottom: 2px solid rgb(242, 242, 247); + border-top: 2px solid rgb(242, 242, 247); - &:first-child { - border-radius: 20px 0 0 20px; - border-left: 2px solid rgb(242, 242, 247); - border-bottom: 2px solid rgb(242, 242, 247); - } + &:first-child { + border-radius: 20px 0 0 20px; + border-left: 2px solid rgb(242, 242, 247); + border-bottom: 2px solid rgb(242, 242, 247); + } &:last-child { - border-radius: 0 20px 20px 0; - border-right: 2px solid rgb(242, 242, 247); - border-bottom: 2px solid rgb(242, 242, 247); - } - } + border-radius: 0 20px 20px 0; + border-right: 2px solid rgb(242, 242, 247); + border-bottom: 2px solid rgb(242, 242, 247); + } + } } &.current-row { - td { - background-color: #fff; - border-top: 2px solid rgb(17, 170, 102); - border-bottom: 2px solid rgb(17, 170, 102); + background-color: #fff; + border-top: 2px solid rgb(17, 170, 102); + border-bottom: 2px solid rgb(17, 170, 102); - &:first-child { - border-radius: 20px 0 0 20px; - border-left: 2px solid rgb(17, 170, 102); - border-bottom: 2px solid rgb(17, 170, 102); - } + &:first-child { + border-radius: 20px 0 0 20px; + border-left: 2px solid rgb(17, 170, 102); + border-bottom: 2px solid rgb(17, 170, 102); + } &:last-child { - border-radius: 0 20px 20px 0; - border-right: 2px solid rgb(17, 170, 102); - border-bottom: 2px solid rgb(17, 170, 102); - } + border-radius: 0 20px 20px 0; + border-right: 2px solid rgb(17, 170, 102); + border-bottom: 2px solid rgb(17, 170, 102); + } + } } - } - } .elec-high { @@ -386,29 +524,28 @@ ::v-deep .el-pagination { margin-top: 20px; .el-pager li:not(.disabled):not(.active):hover { - color: #11AA66; + color: #11aa66; } - .el-pager li:not(.disabled).active { - background-color: #11AA66; + .el-pager li:not(.disabled).active { + background-color: #11aa66; } - input:focus, input:hover { - border: 1px solid #11AA66 !important; + input:focus, + input:hover { + border: 1px solid #11aa66 !important; } - .el-input.is-focus input{ - border: 1px solid #11AA66 !important; + .el-input.is-focus input { + border: 1px solid #11aa66 !important; } - - } ::v-deep .has-gutter { height: 70px; } - .mask { - position: fixed; + .mask { + position: fixed; top: 0; bottom: 0; left: 0; @@ -416,77 +553,71 @@ text-align: center; z-index: 1; background-color: black; - opacity: .5; - } - - + opacity: 0.5; + } } - .el-textarea { - height: 150px; - padding: 0 15px; +.el-textarea { + height: 150px; + padding: 0 15px; - .el-title { - margin-top: 20px; - margin-bottom: 15px; - color: #4F4F4F; - font-size: 16px; - font-weight: 700; + .el-title { + margin-top: 20px; + margin-bottom: 15px; + color: #4f4f4f; + font-size: 16px; + font-weight: 700; - .icon { - font-weight: normal; - font-size: 19px; - } - + .icon { + font-weight: normal; + font-size: 19px; } - - .el-textarea__inner { - width: 357px; - - &:focus { -border: 1px solid #11AA66 ; - - } - } - - .info { - font-size: 12px; - color: #828282; - text-align: right; - padding-right: 38px; - } - - } + + .el-textarea__inner { + width: 357px; + + &:focus { + border: 1px solid #11aa66; + } + } + + .info { + font-size: 12px; + color: #828282; + text-align: right; + padding-right: 38px; + } +} </style> <style lang="scss"> .page_helemt { - .el-select-dropdown__item.selected span{ - color: #11AA66; - } + .el-select-dropdown__item.selected span { + color: #11aa66; + } } .hele_btn_save { width: 175px; height: 40px; -background: #11AA66 !important; -border: 1px solid #11AA66 !important; -border-radius: 25px !important; -margin: 10px 17px 12px 10px !important; + background: #11aa66 !important; + border: 1px solid #11aa66 !important; + border-radius: 25px !important; + margin: 10px 17px 12px 10px !important; -&:hover { -background: #11AA66 !important; -border: 1px solid #11AA66 !important; -} + &:hover { + background: #11aa66 !important; + border: 1px solid #11aa66 !important; + } } .hele_btn_cancel { -width: 175px; -height: 40px; + width: 175px; + height: 40px; -border: 1px solid #E0E0E0; -box-sizing: border-box; -border-radius: 25px !important; + border: 1px solid #e0e0e0; + box-sizing: border-box; + border-radius: 25px !important; } </style> \ No newline at end of file diff --git a/src/pages/internetData/views/helmet.vue b/src/pages/internetData/views/helmet.vue index 19bfac3..e9f2de9 100644 --- a/src/pages/internetData/views/helmet.vue +++ b/src/pages/internetData/views/helmet.vue @@ -1,38 +1,51 @@ <template> - <div class="data_helmet"> - <!-- 绛涢�夋 --> - <screening /> + <div class="data_helmet"> + <!-- 绛涢�夋 --> + <screening @searchHelmet="searchHelmet" @resetHelmet="resetHelmet" /> - <!-- 琛ㄦ牸 --> - <helemtTable /> - -</div> + <!-- 琛ㄦ牸 --> + <helemtTable ref="helemtTable" /> + </div> </template> <script> -import screening from '@/pages/internetData/components/screening' -import helemtTable from '@/pages/internetData/views/helemtTable' +import screening from "@/pages/internetData/components/screening"; +import helemtTable from "@/pages/internetData/views/helemtTable"; export default { - data (){ - return { - - } + data() { + return {}; + }, + components: { + screening, + helemtTable, + }, + methods: { + searchHelmet(data) { + this.$refs.helemtTable.getHelemtArr({ + ...data, + page: 1, + pageSize: this.$refs.helemtTable._data.page_size, + }); }, - components: { - screening, - helemtTable - } -} + resetHelmet() { + console.log(this.$refs.helemtTable); + this.$refs.helemtTable.getHelemtArr({ + page: 1, + pageSize: this.$refs.helemtTable._data.page_size, + }); + }, + }, +}; </script> <style scoped lang="scss"> .data_helmet { - padding: 15px 20px 20px 20px; - height: 100%; - background-color: rgb(251, 252, 254); + padding: 15px 20px 20px 20px; + height: 100%; + background-color: rgb(251, 252, 254); - .helemtTable { - height: 710px; - } + .helemtTable { + height: 710px; + } } </style> \ No newline at end of file diff --git a/vue.config.js b/vue.config.js index 44ff875..ad215b7 100644 --- a/vue.config.js +++ b/vue.config.js @@ -1,34 +1,34 @@ -'use strict' -const glob = require('glob') -const pages = {} -const IS_VENDOR = /[\\/]node_modules[\\/]/ -const pageVendor = {} +"use strict"; +const glob = require("glob"); +const pages = {}; +const IS_VENDOR = /[\\/]node_modules[\\/]/; +const pageVendor = {}; -const pkg = require('./package.json') -const timestamp = new Date().getTime() -const queryStr = `?v=${pkg.version}&t=${timestamp}` +const pkg = require("./package.json"); +const timestamp = new Date().getTime(); +const queryStr = `?v=${pkg.version}&t=${timestamp}`; -glob.sync('./src/pages/**/main.ts').forEach(path => { - const chunk = path.split('./src/pages/')[1].split('/main.ts')[0] - const chunk_vendor = `${chunk}-vendors` - const chunk_common = `${chunk}-common` +glob.sync("./src/pages/**/main.ts").forEach((path) => { + const chunk = path.split("./src/pages/")[1].split("/main.ts")[0]; + const chunk_vendor = `${chunk}-vendors`; + const chunk_common = `${chunk}-common`; pages[chunk] = { entry: path, - template: 'public/index.html', - title: chunk == 'desktop/index' ? 'SmartAI' : chunk, - chunks: [chunk_vendor, 'chunk-common', chunk] - } - if (chunk != 'index') { - pages[chunk].filename = 'view/' + chunk + '.html' + template: "public/index.html", + title: chunk == "desktop/index" ? "SmartAI" : chunk, + chunks: [chunk_vendor, "chunk-common", chunk], + }; + if (chunk != "index") { + pages[chunk].filename = "view/" + chunk + ".html"; } pageVendor[chunk_vendor] = { name: chunk_vendor, priority: -11, - chunks: c => c.name === chunk, + chunks: (c) => c.name === chunk, test: /\.js$/, - enforce: true - } + enforce: true, + }; // pageVendor[chunk_common] = { // name: chunk_common, @@ -38,30 +38,31 @@ // reuseExistingChunk: true, // enforce: true // } -}) +}); // const serverUrl = "http://58.118.225.79:41243" // 缇婁簲 - const serverUrl = "http://192.168.20.189:7009" +const serverUrl = "http://192.168.20.189:7009"; +//const serverUrl = "http://192.168.20.10:9000"; module.exports = { pages, - chainWebpack: config => { - config.plugins.delete('named-chunks') - if (process.env.NODE_ENV === 'production') { - config.output.filename('js/[name].js' + queryStr).end() - config.output.chunkFilename('js/[name].js' + queryStr).end() + chainWebpack: (config) => { + config.plugins.delete("named-chunks"); + if (process.env.NODE_ENV === "production") { + config.output.filename("js/[name].js" + queryStr).end(); + config.output.chunkFilename("js/[name].js" + queryStr).end(); // 淇敼鐢熶骇閰嶇疆 - config.plugin('extract-css').tap(() => [ + config.plugin("extract-css").tap(() => [ { filename: `css/[name].css${queryStr}`, - chunkFilename: `css/[name].css${queryStr}` - } - ]) + chunkFilename: `css/[name].css${queryStr}`, + }, + ]); } config.optimization.splitChunks({ - cacheGroups: pageVendor - }) + cacheGroups: pageVendor, + }); // config.module.rule('fonts').use('url-loader').loader('file-loader').options({ name: 'fonts/[name].[ext]', publicPath: '../' }) //config.module.rule('fonts').use('url-loader').loader('file-loader').options({ name: 'fonts/[name].[ext]', outputPath: '../' }) @@ -70,51 +71,51 @@ filenameHashing: false, pwa: { iconPaths: { - favicon32: 'favicon.ico', - favicon16: 'favicon.ico' - } + favicon32: "favicon.ico", + favicon16: "favicon.ico", + }, }, devServer: { proxy: { - '/track': { + "/track": { target: serverUrl, // ws: true, changeOrigin: true, }, - '/ws': { + "/ws": { target: serverUrl, // ws: true, changeOrigin: true, }, "/data/api-v/app/findAllApp": { // target: '/', - target: 'http://localhost:8080/', + target: "http://localhost:8080/", changeOrigin: true, pathRewrite: { - '^/data/api-v/app/findAllApp': 'apps.json' - } + "^/data/api-v/app/findAllApp": "apps.json", + }, }, "/api-c": { target: serverUrl, - changeOrigin: true + changeOrigin: true, }, "/api-v": { target: serverUrl, - changeOrigin: true + changeOrigin: true, }, "/api-f": { target: serverUrl, // secure: false, - changeOrigin: true + changeOrigin: true, }, "/api-p": { target: serverUrl, // secure: false, - changeOrigin: true + changeOrigin: true, }, "/api-u": { target: serverUrl, - changeOrigin: true + changeOrigin: true, }, "/httpImage": { target: serverUrl, @@ -123,8 +124,15 @@ "/files": { target: serverUrl, changeOrigin: true, //寮�鍚唬鐞� - } - } + }, + "/temp": { + target: "http://192.168.20.10:9000", + changeOrigin: true, //寮�鍚唬鐞�, + pathRewrite: { + "/temp": "", + }, + }, + }, }, /* css:{ loaderOptions:{ @@ -133,4 +141,4 @@ } } } */ -} +}; -- Gitblit v1.8.0