1 line
34 KiB
JSON
1 line
34 KiB
JSON
{"remainingRequest":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\2023\\yancheng0718\\yanchengPowerSupply\\src\\component\\lineDetail.vue?vue&type=style&index=0&id=9cf184e0&lang=less&scoped=true&","dependencies":[{"path":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\src\\component\\lineDetail.vue","mtime":1689642397091},{"path":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\node_modules\\css-loader\\index.js","mtime":1689642389821},{"path":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1689642396087},{"path":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\node_modules\\postcss-loader\\src\\index.js","mtime":1689642393431},{"path":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\node_modules\\less-loader\\dist\\cjs.js","mtime":1689642392421},{"path":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1689642389292},{"path":"E:\\2023\\yancheng0718\\yanchengPowerSupply\\node_modules\\vue-loader\\lib\\index.js","mtime":1689642396086}],"contextDependencies":[],"result":["\r\n/deep/ .el-textarea__inner {\r\n background-color: rgba(16, 40, 49, 38);\r\n border-color: #164a75;\r\n}\r\n\r\n.cad-icon {\r\n width: 25px;\r\n height: 22px;\r\n background-image: url(\"../assets/images/cadIcon.png\");\r\n background-size: 100% 100%;\r\n // text-align: center;\r\n margin: 0 auto;\r\n}\r\n\r\n.circle0 {\r\n width: 20px;\r\n height: 20px;\r\n // background-color: tomato;\r\n border: 2px solid #fff;\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n}\r\n\r\n.circle1 {\r\n width: 20px;\r\n height: 20px;\r\n background-color: red;\r\n // border: 2px solid #fff;\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n}\r\n\r\n.circle2 {\r\n width: 20px;\r\n height: 20px;\r\n background-color: green;\r\n // border: 2px solid #fff;\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n}\r\n\r\n.lineContent {\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.lineDetail {\r\n width: 30%;\r\n height: 95%;\r\n position: relative;\r\n background: url(\"../assets/images/leftLine.png\") no-repeat;\r\n background-size: 100% 100%;\r\n -webkit-animation: fadeInDown 0.3s;\r\n animation: fadeInDown 0.3s;\r\n padding: 15px 25px;\r\n display: flex;\r\n flex-wrap: wrap;\r\n align-content: space-between;\r\n\r\n .close {\r\n position: absolute;\r\n right: 4%;\r\n top: 4%;\r\n }\r\n\r\n .table {\r\n width: 100%;\r\n height: 95%;\r\n // border: 1px solid red;\r\n background: url(\"../assets/images/intervalFrame.png\") no-repeat;\r\n background-size: 100% 100%;\r\n padding: 15px 20px;\r\n }\r\n}\r\n\r\n// 右边弹框\r\n.right-dialog {\r\n position: relative;\r\n width: 67%;\r\n height: 95%;\r\n background: url(\"../assets/images/linetail-right.png\") no-repeat;\r\n background-size: 100% 100%;\r\n margin-left: 30px;\r\n padding: 1%;\r\n box-sizing: border-box;\r\n\r\n &>.title {\r\n position: absolute;\r\n top: 1%;\r\n left: 2%;\r\n }\r\n\r\n // align-items: center;\r\n .funBtn {\r\n display: flex;\r\n // justify-content: space-between;\\\r\n // background-color: #fff;\r\n margin-top: 2%;\r\n justify-content: space-between;\r\n\r\n .initBtn,\r\n .nigaiBtn {\r\n width: 49.5%;\r\n text-align: center;\r\n // background-color: #fff;\r\n\r\n }\r\n\r\n .title {\r\n // margin-left: 25%;\r\n font-size: 23px;\r\n color: #fff;\r\n margin-bottom: 1%;\r\n }\r\n\r\n }\r\n\r\n .pdf-content {\r\n width: 100%;\r\n height: 92%;\r\n display: flex;\r\n justify-content: space-between;\r\n\r\n .right-content,\r\n .left-content {\r\n width: 49.5%;\r\n height: 100%;\r\n position: relative;\r\n // background-color: #fff;\r\n // overflow-y: scroll;\r\n // background: #000;\r\n // border-radius: 40px;\r\n // overflow: scroll;\r\n }\r\n\r\n .left-content {\r\n // background-color: tomato;\r\n // span {\r\n // width: 100% !important;\r\n // height: 100% !important;\r\n // // /deep/ canvas {\r\n // // height: 100% !important;\r\n // // }\r\n // }\r\n }\r\n }\r\n\r\n .rightBtn {\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n z-index: 999;\r\n // background-color: tomato;\r\n }\r\n\r\n // 标题\r\n .title {\r\n font-size: 28px;\r\n font-weight: 700;\r\n color: transparent;\r\n -webkit-background-clip: text;\r\n background-clip: text;\r\n display: inline-block;\r\n background-image: -webkit-gradient(linear,\r\n left top,\r\n left bottom,\r\n from(#ffffff),\r\n to(#56f4fe));\r\n background-image: linear-gradient(to bottom, #ffffff, #56f4fe);\r\n }\r\n\r\n .closeBtn {\r\n // width: 100%;\r\n // height: 4%;\r\n // background-color: turquoise;\r\n // display: flex;\r\n // align-items: center;\r\n // justify-content: flex-end;\r\n position: absolute;\r\n right: 0.3%;\r\n top: 3%;\r\n z-index: 1000;\r\n\r\n img {\r\n margin-right: 20px;\r\n }\r\n\r\n // position: absolute;\r\n // right: 2%;\r\n // top: 3%;\r\n }\r\n\r\n .footer {\r\n height: 10%;\r\n width: 100%;\r\n // background-color: #ffffff;\r\n display: flex;\r\n // align-items: center;\r\n }\r\n\r\n // .text-detail {\r\n // width: 10%;\r\n // height: 100%;\r\n // display: flex;\r\n // align-items: center;\r\n // justify-content: center;\r\n // }\r\n .text-content {\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n\r\n /deep/ .el-textarea {\r\n height: 90%;\r\n\r\n /deep/ textarea {\r\n background-color: transparent;\r\n border-top: 2px solid #fff;\r\n border-bottom: 2px solid #fff;\r\n border-left: none;\r\n border-right: none;\r\n border-color: #2e7680 !important;\r\n height: 100%;\r\n color: #fff;\r\n font-size: 18px;\r\n }\r\n\r\n background-color: transparent !important;\r\n }\r\n\r\n }\r\n}\r\n\r\n.user_skills {\r\n .search {\r\n text-align: left;\r\n margin: 20px 0;\r\n display: flex;\r\n align-items: center;\r\n\r\n .searchBtn,\r\n .refurbish {\r\n width: 122px;\r\n height: 39px;\r\n background-image: url(\"../assets/images/search.png\");\r\n background-size: 100% 100%;\r\n margin-left: 10px;\r\n }\r\n\r\n .refurbish {\r\n background-image: url(\"../assets/images/refurbish.png\");\r\n margin-left: 10px;\r\n }\r\n\r\n // /deep/ .el-input__suffix {\r\n // display: flex;\r\n // align-items: center;\r\n // }\r\n .el-input {\r\n width: 260px;\r\n }\r\n\r\n ::v-deep .el-input__inner {\r\n background-color: transparent !important;\r\n border-color: #2e7680 !important;\r\n border-left: none !important;\r\n color: #fff !important;\r\n border-right: none !important;\r\n }\r\n }\r\n\r\n /**\r\n 表格有滚动效果但是不显示滚动条 */\r\n /deep/ .el-table::-webkit-scrollbar {\r\n display: none !important;\r\n }\r\n\r\n /deep/ .el-select .el-input {\r\n width: 100px;\r\n }\r\n\r\n /deep/ .is-scrolling-none {\r\n overflow: hidden;\r\n overflow-y: auto;\r\n overflow-x: scroll;\r\n height: calc(100% - 56px);\r\n }\r\n\r\n /deep/ .is-scrolling-none::-webkit-scrollbar {\r\n display: none;\r\n }\r\n\r\n /deep/.el-table--scrollable-y ::-webkit-scrollbar {\r\n display: none;\r\n }\r\n\r\n /deep/.el-table--scrollable-x ::-webkit-scrollbar {\r\n display: none;\r\n }\r\n\r\n /deep/ .el-table {\r\n background-color: transparent !important;\r\n }\r\n\r\n /deep/ .el-table th {\r\n background-color: transparent !important;\r\n }\r\n\r\n /deep/ .el-table__header {\r\n height: 48px;\r\n background: url(\"../assets/images/intervalTable.png\") no-repeat;\r\n background-size: 100% 100%;\r\n // margin-bottom: 48px;\r\n // position: absolute;\r\n // top: 0;\r\n // left: 0;\r\n }\r\n\r\n /deep/ .el-table__header th {\r\n border: none;\r\n padding: 0;\r\n height: 40px;\r\n\r\n .cell {\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-around;\r\n }\r\n\r\n &.el-table__cell.is-leaf {\r\n border: none !important;\r\n }\r\n }\r\n\r\n /deep/ .el-table tr {\r\n background-color: transparent !important;\r\n height: 55px;\r\n font-size: 18px !important;\r\n }\r\n\r\n /deep/ .el-table--enable-row-transition .el-table__body td,\r\n .el-table .cell {\r\n background-color: transparent !important;\r\n border: none;\r\n color: #ffffff;\r\n }\r\n\r\n /deep/ .el-table__body td .cell {\r\n white-space: nowrap !important;\r\n // word-break: break-all;\r\n }\r\n\r\n /deep/ .el-table th.el-table__cell>.cell {\r\n color: rgb(86, 254, 226);\r\n }\r\n\r\n /deep/.el-table .el-table__cell {\r\n padding: 5px 0;\r\n }\r\n\r\n &::before {\r\n //去除底部白线\r\n left: 0;\r\n bottom: 0;\r\n width: 100%;\r\n height: 0px;\r\n }\r\n}\r\n\r\n.el-table::before {\r\n background-color: transparent;\r\n}\r\n\r\n::v-deep .el-table .el-table__body tr.el-table__row td {\r\n background: rgba(79, 218, 255, 0.1) !important;\r\n}\r\n\r\n::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td {\r\n background: rgba(79, 218, 255, 0.06) !important;\r\n}\r\n",{"version":3,"sources":["lineDetail.vue"],"names":[],"mappings":";AA8ZA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA","file":"lineDetail.vue","sourceRoot":"src/component","sourcesContent":["<template>\r\n <div class=\"lineContent\">\r\n <!-- 配电线路弹窗 -->\r\n <div class=\"lineDetail\">\r\n <!-- <div class=\"title\">配电路线详情</div> -->\r\n <div class=\"close\">\r\n <img @click=\"handleClose\" src=\"@/assets/images/close.png\" style=\"cursor: pointer\" />\r\n </div>\r\n\r\n <div class=\"table user_skills\">\r\n\r\n <div class=\"search\">\r\n <el-select v-model=\"value1\" placeholder=\"请选择\" style=\"margin-left: 30px\">\r\n <el-option v-for=\"(item, index) in districtList\" :key=\"item.index\" :label=\"item\" :value=\"item\">\r\n </el-option>\r\n </el-select>\r\n <el-select v-model=\"value2\" placeholder=\"请选择\" style=\"margin-left: 10px\">\r\n <el-option v-for=\"(item, index) in taiwanList\" :key=\"item.index\" :label=\"item\" :value=\"item\">\r\n </el-option>\r\n </el-select>\r\n <el-input style=\"margin-left: 10px;\" placeholder=\"模糊中文搜索\" v-model.trim=\"searchData\"\r\n @keyup.enter.native=\"search\">\r\n <!-- <i slot=\"suffix\" class=\"el-input-icon el-icon-search\" @click=\"search\"></i> -->\r\n </el-input>\r\n\r\n\r\n <div class=\"searchBtn\" @click=\"search\"></div>\r\n <div class=\"refurbish\" @click=\"refurbish\"></div>\r\n </div>\r\n\r\n <el-table @row-click=\"rowHandle\" :data=\"lineList\" style=\"width: 100%; height: calc(100% - 80px);\r\n overflow-y: scroll;\r\n position: relative;\r\n \" :header-cell-style=\"{ 'text-align': 'center' }\" :cell-style=\"{ 'text-align': 'center' }\" stripe>\r\n <el-table-column prop=\"line_name\" label=\"序号\" align=\"center\" width=\"60\">\r\n <template slot-scope=\"scope\">\r\n {{ scope.$index + 1 }}\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"qushu\" label=\"区域\" align=\"center\">\r\n <!-- <template slot-scope=\"scope\">\r\n <div>\r\n \r\n </div>\r\n </template> -->\r\n </el-table-column>\r\n <el-table-column prop=\"taiqu\" label=\"变电站\" align=\"center\">\r\n </el-table-column>\r\n <el-table-column prop=\"line_name\" label=\"线路名称\" align=\"center\" width=\"170\">\r\n <!-- <template slot-scope=\"scope\">\r\n <div>\r\n \r\n </div>\r\n </template> -->\r\n </el-table-column>\r\n <el-table-column prop=\"url_init\" label=\"原状\" align=\"center\">\r\n <template slot-scope=\"scope\">\r\n <div v-if=\"scope.row.url_init\" class=\"cad-icon\" @click.stop=\"openInit(scope.row)\"></div>\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"url_dest\" label=\"目标\" align=\"center\">\r\n <template slot-scope=\"scope\">\r\n <div v-if=\"scope.row.url_dest\" class=\"cad-icon\" @click.stop=\"openCad(scope.row)\"></div>\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"url_nigai\" label=\"本年度拟改\" align=\"center\">\r\n <template slot-scope=\"scope\">\r\n <div v-if=\"scope.row.url_nigai\" class=\"cad-icon\"></div>\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"nigai_state\" label=\"当前状态\" align=\"center\">\r\n <template slot-scope=\"scope\">\r\n <div :class=\"'circle' + scope.row.nigai_state\"></div>\r\n </template>\r\n </el-table-column>\r\n </el-table>\r\n </div>\r\n </div>\r\n <div class=\"right-dialog\" v-show=\"rightDialog\">\r\n <div class=\"closeBtn\">\r\n <img @click=\"handleClose1\" src=\"@/assets/images/close.png\" style=\"cursor: pointer\" />\r\n </div>\r\n <!-- 标题 -->\r\n <div class=\"title\">拟改图对比</div>\r\n <div class=\"funBtn\">\r\n <div class=\"initBtn\">\r\n <!-- <el-button icon=\"el-icon-zoom-in\" @click.native=\"enlargeBtn0()\"\r\n >放大</el-button\r\n >\r\n <el-button icon=\"el-icon-zoom-out\" @click=\"reduceBtn0()\"\r\n >缩小</el-button\r\n > -->\r\n <span class=\"title\">{{ title }}</span>\r\n </div>\r\n\r\n <div class=\"nigaiBtn\">\r\n <!-- <el-button icon=\"el-icon-zoom-in\" @click=\"enlargeBtn1()\"\r\n >放大</el-button\r\n >\r\n <el-button icon=\"el-icon-zoom-out\" @click=\"reduceBtn1()\"\r\n >缩小</el-button\r\n > -->\r\n <span class=\"title\">拟改图</span>\r\n </div>\r\n </div>\r\n <div class=\"pdf-content\">\r\n <div class=\"left-content\" id=\"leftContent\">\r\n <!-- <iframe\r\n :src=\"pdfUrl\"\r\n width=\"100%\"\r\n height=\"100%\"\r\n scrolling=\"no\"\r\n frameborder=\"no\"\r\n ></iframe> -->\r\n <!-- <pdf ref=\"pdf\" :src=\"pdfUrl\"></pdf> -->\r\n <iframe :src=\"init\" frameborder=\"0\" width=\"100%\" height=\"100%\" scrolling=\"no\"></iframe>\r\n </div>\r\n\r\n <div class=\"right-content\" >\r\n <!-- <pdf ref=\"pdf1\" :src=\"pdfUrl1\"></pdf>\r\n -->\r\n <iframe :src=\"nigai\" ref=\"iframeId\" frameborder=\"0\" width=\"100%\" height=\"100%\" scrolling=\"no\"></iframe>\r\n\r\n <!-- <iframe\r\n ref=\"iframe\"\r\n id=\"iframe\"\r\n :src=\"pdfUrl1\"\r\n width=\"100%\"\r\n height=\"100%\"\r\n scrolling=\"no\"\r\n frameborder=\"no\"\r\n >\r\n </iframe> -->\r\n </div>\r\n </div>\r\n <!-- <div class=\"footer\"> -->\r\n <!-- <div class=\"text-detail\">说明文字:</div> -->\r\n <!-- 说明文字 -->\r\n <!-- <div class=\"text-content\">\r\n <el-input type=\"textarea\" placeholder=\"说明文字\" v-model=\"textarea\">\r\n </el-input>\r\n </div>\r\n </div> -->\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { getLine } from \"../api/index\";\r\n// import Mx from \"mxdraw\";\r\nimport pdf from \"vue-pdf\";\r\nexport default {\r\n name: \"lineDetail\",\r\n props: [\"lineItem\"],\r\n components: {\r\n pdf,\r\n },\r\n data() {\r\n return {\r\n init: '',\r\n nigai: '',\r\n // 说明文字 ，文本域\r\n textarea: \"\",\r\n // 搜索文字\r\n searchData: \"\",\r\n //\r\n lineList: null,\r\n pdfUrl: \"\",\r\n rightDialog: false,\r\n // cad: \"/assets/cad/cad.dwg\",\r\n pdfUrl1: \"\", //nigai图\r\n districtList: [], //区属列表\r\n value1: \"\",\r\n taiwanList: [], //台区列表\r\n value2: \"\",\r\n // 原状图\r\n scale: 100,\r\n scale1: 100, //拟改图\r\n\r\n title: '原状图',\r\n host: '',\r\n cadFile: ''\r\n };\r\n },\r\n methods: {\r\n\r\n\r\n // 放大按钮 原状\r\n enlargeBtn0() {\r\n this.scale += 5;\r\n this.$nextTick(() => {\r\n this.$refs.pdf.$el.style.width = parseInt(this.scale) + \"%\";\r\n // console.log(this,'and',this.$refs.pdf.$el.style.width);\r\n });\r\n },\r\n // 放大按钮 拟改\r\n enlargeBtn1() {\r\n this.scale1 += 5;\r\n // debugger\r\n this.$nextTick(() => {\r\n this.$refs.pdf1.$el.style.width = parseInt(this.scale1) + \"%\";\r\n });\r\n // debugger\r\n },\r\n reduceBtn0() {\r\n if (this.scale == 100) {\r\n return;\r\n }\r\n this.scale += -5;\r\n this.$nextTick(() => {\r\n this.$refs.pdf.$el.style.width = parseInt(this.scale) + \"%\";\r\n // console.log(this,'and',this.$refs.pdf.$el.style.width);\r\n });\r\n },\r\n reduceBtn1() {\r\n if (this.scale1 == 100) {\r\n return;\r\n }\r\n this.scale1 += -5;\r\n this.$nextTick(() => {\r\n this.$refs.pdf1.$el.style.width = parseInt(this.scale1) + \"%\";\r\n });\r\n },\r\n rowHandle(event) {\r\n this.init = ''\r\n this.nigai = ''\r\n\r\n // console.log(event, '行数据');\r\n if (event.url_init != '') {\r\n let init = event.url_init.split('/')[4];\r\n this.init = this.cadFile + '?file=' + init + '&&time=' + new Date().getTime()\r\n }\r\n if (event.url_nigai != '') {\r\n let nigai = event.url_nigai.split('/')[4];\r\n // console.log(init, nigai, '数据');\r\n // http://localhost:3000/mxweb3d.html?file=%E5%8E%9F%E8%A3%85%E5%9B%BE_20230309170721326.dwg\r\n // this.cadFile + '?file='\r\n // this.nigai = 'http://localhost:3000/mxweb3d.html?file=' + nigai\r\n this.nigai = this.cadFile + '?file=' + nigai + '&&time=' + new Date().getTime()\r\n }\r\n this.title = '原状图'\r\n this.rightDialog = true;\r\n // if (init == undefined || nigai == undefined) {\r\n // return;\r\n // }\r\n // 原装图\r\n // var initUrl =\r\n // \"/app\" + \"/\" + init.split(\"/\")[3] + \"/\" + init.split(\"/\")[4];\r\n // var nigaiUrl =\r\n // \"/app\" + \"/\" + nigai.split(\"/\")[3] + \"/\" + nigai.split(\"/\")[4];\r\n // // console.log(initUrl,'原装图');\r\n // this.$nextTick(() => {\r\n // // console.log(this.$refs.iframe);\r\n // // document.querySelector('iframe').src = e\r\n // // 原状图\r\n // if (initUrl != \"\") {\r\n // this.pdfUrl = initUrl;\r\n // }\r\n // if (nigaiUrl != \"\") {\r\n // this.pdfUrl1 = nigaiUrl;\r\n // }\r\n\r\n // this.rightDialog = true;\r\n // });\r\n },\r\n\r\n handleClose() {\r\n this.$parent.lineItem = null;\r\n this.$parent.lineShow = \"\";\r\n },\r\n // 关闭右侧弹窗\r\n handleClose1() {\r\n this.rightDialog = false;\r\n this.init = ''\r\n this.nigai = ''\r\n },\r\n getCadFile() {\r\n\r\n getLine({ action: 'cad' }).then(res => {\r\n // console.log(res, 'cad请求数据');\r\n if (res.data.state == true) {\r\n this.cadFile = res.data.data\r\n }\r\n })\r\n },\r\n // 打开cad\r\n openCad(event) {\r\n this.init = ''\r\n this.nigai = ''\r\n if (event.url_dest != '') {\r\n let dest = event.url_dest.split('/')[4];\r\n this.init = this.cadFile + '?file=' + dest\r\n }\r\n if (event.url_nigai != '') {\r\n let nigai = event.url_nigai.split('/')[4];\r\n this.nigai = this.cadFile + '?file=' + nigai +'&&time=' + new Date().getTime()\r\n }\r\n\r\n\r\n // http://localhost:3000/mxweb3d.html?file=%E5%8E%9F%E8%A3%85%E5%9B%BE_20230309170721326.dwg\r\n\r\n\r\n // console.log(url, 'cad');\r\n // 目标\r\n this.rightDialog = true;\r\n this.title = '目标图'\r\n },\r\n // 原状图\r\n openInit(event) {\r\n this.$nextTick(() => {\r\n this.init = ''\r\n this.nigai = ''\r\n // document.getElementById('iframeId').contentWindow.location.reload(true);\r\n if (event.url_init != '') {\r\n let init = event.url_init.split('/')[4];\r\n this.init = this.cadFile + '?file=' + init + '&&time=' + new Date().getTime()\r\n }\r\n if (event.url_nigai != '') {\r\n let nigai = event.url_nigai.split('/')[4];\r\n // console.log(init, nigai, '数据');\r\n // http://localhost:3000/mxweb3d.html?file=%E5%8E%9F%E8%A3%85%E5%9B%BE_20230309170721326.dwg\r\n\r\n this.nigai = this.cadFile + '?file=' + nigai + '&&time=' + new Date().getTime()\r\n\r\n }\r\n this.title = '原状图'\r\n this.rightDialog = true;\r\n })\r\n\r\n \r\n },\r\n // 回城进行搜索\r\n search() {\r\n if (this.searchData == \"\") {\r\n getLine({\r\n action: \"pdxl\",\r\n // linename: \"\",\r\n qushu: this.value1,\r\n taiqu: this.value2,\r\n }).then(({ data }) => {\r\n // console.log(data, '数据');\r\n this.lineList = data.data;\r\n });\r\n // return;\r\n } else {\r\n // 把searchData带着，发请求获取有关联的数据并呈现在页面中\r\n getLine({\r\n action: \"pdxl\",\r\n linename: this.searchData,\r\n qushu: this.value1,\r\n taiqu: this.value2,\r\n }).then(({ data }) => {\r\n console.log(data, '数据');\r\n this.lineList = data.data;\r\n });\r\n }\r\n },\r\n refurbish() {\r\n this.lineList = this.lineItem;\r\n // 点击还原初始\r\n this.searchData = \"\";\r\n this.value1 = ''\r\n this.value2 = ''\r\n },\r\n },\r\n created() {\r\n this.getCadFile()\r\n // console.log(location.host,'.......');\r\n this.host = location.host\r\n this.lineList = this.lineItem;\r\n // 获取区属的请求\r\n getLine({ action: \"qushu\" }).then(({ data }) => {\r\n // console.log(data, \"区属的数据\");\r\n if (data.state == true) {\r\n this.districtList = data.data; //区属赋值\r\n // this.value1 = data.data[0];\r\n }\r\n });\r\n // 获取台区的请求\r\n if (this.value1 != \"\") {\r\n getLine({ action: \"taiqu\", qushu: this.value1 }).then(({ data }) => {\r\n // console.log(data, \"台区的数据\");\r\n if (data.state == true) {\r\n this.taiwanList = data.data; //台区赋值\r\n }\r\n });\r\n }\r\n },\r\n watch: {\r\n // 监听input输入框，若没东西了，就回复默认状态\r\n searchData: function (newnew, oldold) {\r\n if (newnew == \"\") {\r\n this.lineList = this.lineItem;\r\n // 发请求回到初始列表数据状态\r\n // console.log(\"搜索框没东西了，回复初始状态\");\r\n }\r\n },\r\n value1: function (newVal, old) {\r\n // console.log(newVal, \"数据\");\r\n if (newVal) {\r\n getLine({ action: \"taiqu\", qushu: newVal }).then(({ data }) => {\r\n // console.log(data, \"台区的数据\");\r\n if (data.state == true) {\r\n this.taiwanList = data.data; //台区赋值\r\n // this.value2 = data.data[0];\r\n }\r\n });\r\n }\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style lang=\"less\" scoped>\r\n/deep/ .el-textarea__inner {\r\n background-color: rgba(16, 40, 49, 38);\r\n border-color: #164a75;\r\n}\r\n\r\n.cad-icon {\r\n width: 25px;\r\n height: 22px;\r\n background-image: url(\"../assets/images/cadIcon.png\");\r\n background-size: 100% 100%;\r\n // text-align: center;\r\n margin: 0 auto;\r\n}\r\n\r\n.circle0 {\r\n width: 20px;\r\n height: 20px;\r\n // background-color: tomato;\r\n border: 2px solid #fff;\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n}\r\n\r\n.circle1 {\r\n width: 20px;\r\n height: 20px;\r\n background-color: red;\r\n // border: 2px solid #fff;\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n}\r\n\r\n.circle2 {\r\n width: 20px;\r\n height: 20px;\r\n background-color: green;\r\n // border: 2px solid #fff;\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n}\r\n\r\n.lineContent {\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.lineDetail {\r\n width: 30%;\r\n height: 95%;\r\n position: relative;\r\n background: url(\"../assets/images/leftLine.png\") no-repeat;\r\n background-size: 100% 100%;\r\n -webkit-animation: fadeInDown 0.3s;\r\n animation: fadeInDown 0.3s;\r\n padding: 15px 25px;\r\n display: flex;\r\n flex-wrap: wrap;\r\n align-content: space-between;\r\n\r\n .close {\r\n position: absolute;\r\n right: 4%;\r\n top: 4%;\r\n }\r\n\r\n .table {\r\n width: 100%;\r\n height: 95%;\r\n // border: 1px solid red;\r\n background: url(\"../assets/images/intervalFrame.png\") no-repeat;\r\n background-size: 100% 100%;\r\n padding: 15px 20px;\r\n }\r\n}\r\n\r\n// 右边弹框\r\n.right-dialog {\r\n position: relative;\r\n width: 67%;\r\n height: 95%;\r\n background: url(\"../assets/images/linetail-right.png\") no-repeat;\r\n background-size: 100% 100%;\r\n margin-left: 30px;\r\n padding: 1%;\r\n box-sizing: border-box;\r\n\r\n &>.title {\r\n position: absolute;\r\n top: 1%;\r\n left: 2%;\r\n }\r\n\r\n // align-items: center;\r\n .funBtn {\r\n display: flex;\r\n // justify-content: space-between;\\\r\n // background-color: #fff;\r\n margin-top: 2%;\r\n justify-content: space-between;\r\n\r\n .initBtn,\r\n .nigaiBtn {\r\n width: 49.5%;\r\n text-align: center;\r\n // background-color: #fff;\r\n\r\n }\r\n\r\n .title {\r\n // margin-left: 25%;\r\n font-size: 23px;\r\n color: #fff;\r\n margin-bottom: 1%;\r\n }\r\n\r\n }\r\n\r\n .pdf-content {\r\n width: 100%;\r\n height: 92%;\r\n display: flex;\r\n justify-content: space-between;\r\n\r\n .right-content,\r\n .left-content {\r\n width: 49.5%;\r\n height: 100%;\r\n position: relative;\r\n // background-color: #fff;\r\n // overflow-y: scroll;\r\n // background: #000;\r\n // border-radius: 40px;\r\n // overflow: scroll;\r\n }\r\n\r\n .left-content {\r\n // background-color: tomato;\r\n // span {\r\n // width: 100% !important;\r\n // height: 100% !important;\r\n // // /deep/ canvas {\r\n // // height: 100% !important;\r\n // // }\r\n // }\r\n }\r\n }\r\n\r\n .rightBtn {\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n z-index: 999;\r\n // background-color: tomato;\r\n }\r\n\r\n // 标题\r\n .title {\r\n font-size: 28px;\r\n font-weight: 700;\r\n color: transparent;\r\n -webkit-background-clip: text;\r\n background-clip: text;\r\n display: inline-block;\r\n background-image: -webkit-gradient(linear,\r\n left top,\r\n left bottom,\r\n from(#ffffff),\r\n to(#56f4fe));\r\n background-image: linear-gradient(to bottom, #ffffff, #56f4fe);\r\n }\r\n\r\n .closeBtn {\r\n // width: 100%;\r\n // height: 4%;\r\n // background-color: turquoise;\r\n // display: flex;\r\n // align-items: center;\r\n // justify-content: flex-end;\r\n position: absolute;\r\n right: 0.3%;\r\n top: 3%;\r\n z-index: 1000;\r\n\r\n img {\r\n margin-right: 20px;\r\n }\r\n\r\n // position: absolute;\r\n // right: 2%;\r\n // top: 3%;\r\n }\r\n\r\n .footer {\r\n height: 10%;\r\n width: 100%;\r\n // background-color: #ffffff;\r\n display: flex;\r\n // align-items: center;\r\n }\r\n\r\n // .text-detail {\r\n // width: 10%;\r\n // height: 100%;\r\n // display: flex;\r\n // align-items: center;\r\n // justify-content: center;\r\n // }\r\n .text-content {\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n\r\n /deep/ .el-textarea {\r\n height: 90%;\r\n\r\n /deep/ textarea {\r\n background-color: transparent;\r\n border-top: 2px solid #fff;\r\n border-bottom: 2px solid #fff;\r\n border-left: none;\r\n border-right: none;\r\n border-color: #2e7680 !important;\r\n height: 100%;\r\n color: #fff;\r\n font-size: 18px;\r\n }\r\n\r\n background-color: transparent !important;\r\n }\r\n\r\n }\r\n}\r\n\r\n.user_skills {\r\n .search {\r\n text-align: left;\r\n margin: 20px 0;\r\n display: flex;\r\n align-items: center;\r\n\r\n .searchBtn,\r\n .refurbish {\r\n width: 122px;\r\n height: 39px;\r\n background-image: url(\"../assets/images/search.png\");\r\n background-size: 100% 100%;\r\n margin-left: 10px;\r\n }\r\n\r\n .refurbish {\r\n background-image: url(\"../assets/images/refurbish.png\");\r\n margin-left: 10px;\r\n }\r\n\r\n // /deep/ .el-input__suffix {\r\n // display: flex;\r\n // align-items: center;\r\n // }\r\n .el-input {\r\n width: 260px;\r\n }\r\n\r\n ::v-deep .el-input__inner {\r\n background-color: transparent !important;\r\n border-color: #2e7680 !important;\r\n border-left: none !important;\r\n color: #fff !important;\r\n border-right: none !important;\r\n }\r\n }\r\n\r\n /**\r\n 表格有滚动效果但是不显示滚动条 */\r\n /deep/ .el-table::-webkit-scrollbar {\r\n display: none !important;\r\n }\r\n\r\n /deep/ .el-select .el-input {\r\n width: 100px;\r\n }\r\n\r\n /deep/ .is-scrolling-none {\r\n overflow: hidden;\r\n overflow-y: auto;\r\n overflow-x: scroll;\r\n height: calc(100% - 56px);\r\n }\r\n\r\n /deep/ .is-scrolling-none::-webkit-scrollbar {\r\n display: none;\r\n }\r\n\r\n /deep/.el-table--scrollable-y ::-webkit-scrollbar {\r\n display: none;\r\n }\r\n\r\n /deep/.el-table--scrollable-x ::-webkit-scrollbar {\r\n display: none;\r\n }\r\n\r\n /deep/ .el-table {\r\n background-color: transparent !important;\r\n }\r\n\r\n /deep/ .el-table th {\r\n background-color: transparent !important;\r\n }\r\n\r\n /deep/ .el-table__header {\r\n height: 48px;\r\n background: url(\"../assets/images/intervalTable.png\") no-repeat;\r\n background-size: 100% 100%;\r\n // margin-bottom: 48px;\r\n // position: absolute;\r\n // top: 0;\r\n // left: 0;\r\n }\r\n\r\n /deep/ .el-table__header th {\r\n border: none;\r\n padding: 0;\r\n height: 40px;\r\n\r\n .cell {\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-around;\r\n }\r\n\r\n &.el-table__cell.is-leaf {\r\n border: none !important;\r\n }\r\n }\r\n\r\n /deep/ .el-table tr {\r\n background-color: transparent !important;\r\n height: 55px;\r\n font-size: 18px !important;\r\n }\r\n\r\n /deep/ .el-table--enable-row-transition .el-table__body td,\r\n .el-table .cell {\r\n background-color: transparent !important;\r\n border: none;\r\n color: #ffffff;\r\n }\r\n\r\n /deep/ .el-table__body td .cell {\r\n white-space: nowrap !important;\r\n // word-break: break-all;\r\n }\r\n\r\n /deep/ .el-table th.el-table__cell>.cell {\r\n color: rgb(86, 254, 226);\r\n }\r\n\r\n /deep/.el-table .el-table__cell {\r\n padding: 5px 0;\r\n }\r\n\r\n &::before {\r\n //去除底部白线\r\n left: 0;\r\n bottom: 0;\r\n width: 100%;\r\n height: 0px;\r\n }\r\n}\r\n\r\n.el-table::before {\r\n background-color: transparent;\r\n}\r\n\r\n::v-deep .el-table .el-table__body tr.el-table__row td {\r\n background: rgba(79, 218, 255, 0.1) !important;\r\n}\r\n\r\n::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td {\r\n background: rgba(79, 218, 255, 0.06) !important;\r\n}\r\n</style>\r\n<style lang=\"less\">\r\n.el-select-dropdown {\r\n background-color: rgb(14, 30, 46) !important;\r\n border: 1px solid rgba(45, 143, 148, 0.5) !important;\r\n\r\n .el-select-dropdown__item {\r\n color: #fff !important;\r\n }\r\n\r\n .el-select-dropdown__item.hover,\r\n .el-select-dropdown__item:hover {\r\n background-color: rgb(18, 54, 87) !important;\r\n }\r\n}\r\n</style>\r\n"]}]} |