| | |
| | | "default-passive-events": "^2.0.0", |
| | | "echarts": "^5.4.3", |
| | | "element-plus": "^2.3.0", |
| | | "file-saver": "^2.0.5", |
| | | "jquery": "^3.7.1", |
| | | "js-base64": "^3.7.5", |
| | | "jsencrypt": "^3.3.2", |
| | |
| | | "vue-drag-resize": "^1.5.4", |
| | | "vue-router": "^4.0.3", |
| | | "vuedraggable": "^4.1.0", |
| | | "vuex": "^4.0.0" |
| | | "vuex": "^4.0.0", |
| | | "xlsx": "^0.18.5", |
| | | "xlsx-js-style": "^1.2.0" |
| | | }, |
| | | "devDependencies": { |
| | | "@typescript-eslint/eslint-plugin": "^5.4.0", |
| | |
| | | return request.get("/publish/selectSjColorTables", { params: params }); |
| | | } |
| | | |
| | | |
| | | //æ°æ®ç®¡ç=>æ´æ°æ°ç®æå¡ |
| | | export function publish_updateSjService(params) { |
| | | return request.post("/publish/updateSjService", params); |
| | | } |
| | | |
| | | |
| | | //å¨çº¿å¶å¾=>å页æ¥è¯¢ |
| | | export function exportSelectByPage(params) { |
| | | return request.get('/export/selectByPage', { params: params }); |
| | | return request.get("/export/selectByPage", { params: params }); |
| | | } |
| | | //æ
æ ¼åæ=>æ¥è¯¢ç¹åæ |
| | | export function selectByPoint(params) { |
| | | return request.get("/rasterAnalysis/selectByPoint", { params: params }); |
| | | } |
| | | //æ
æ ¼åæ=>æ¥è¯¢é¢åæ |
| | | export function selectByPolygon(params) { |
| | | return request.get("/rasterAnalysis/selectByPolygon", { params: params }); |
| | | } |
| | | //æ
æ ¼åæ=>æ¥è¯¢çº¿åæ |
| | | export function selectByPolyline(params) { |
| | | return request.get("/rasterAnalysis/selectByPolyline", { params: params }); |
| | | } |
¶Ô±ÈÐÂÎļþ |
| | |
| | | import XLSXS from "xlsx-js-style"; |
| | | export function saveFSDZJsonToExcel(data, name, merges) { |
| | | // const data = [ |
| | | // { å§å: "å¼ ä¸", å¹´é¾: 18, æ§å«: "ç·" }, |
| | | // { å§å: "æå", å¹´é¾: 20, æ§å«: "女" }, |
| | | // { å§å: "çäº", å¹´é¾: 22, æ§å«: "ç·" }, |
| | | // ]; |
| | | // const wb = XLSX.utils.book_new(); |
| | | // const ws = XLSX.utils.json_to_sheet(data); |
| | | // ws["!cols"] = [ |
| | | // { |
| | | // wpx: 150, |
| | | // }, |
| | | // { |
| | | // wpx: 500, |
| | | // }, |
| | | // { |
| | | // wpx: 100, |
| | | // }, |
| | | // ]; |
| | | // XLSXS.utils.book_append_sheet(wb, ws, "Sheet1"); |
| | | // XLSXS.writeFile(wb, "data-region.xlsx"); |
| | | //============================================================================ |
| | | console.log(data, name, merges); |
| | | // dataæ¯ç¹å»å¯¼åºæé®ä¼ éè¿æ¥è¦å¯¼åºçæ°æ®ï¼nameæ¯å¯¼åºçæä»¶åï¼mergesæ¯åå¹¶çåå
æ ¼ |
| | | // å°æ°æ®æºè½¬ææä»¬éè¦çäºç»´æ°ç»ï¼åºå·ãå§åè¿äºæ¯è¡¨æ ¼ç表头 |
| | | const body = data.map((x) => [ |
| | | x["layerName"], |
| | | x["min"], |
| | | x["max"], |
| | | x["avg"], |
| | | x["lng"], |
| | | x["lat"], |
| | | ]); |
| | | const header = [ |
| | | // è¿ä¸ªæ¯è®¾ç½®excelè¡¨æ ¼çæ é¢ï¼å³å¨A1åå
æ ¼çæ é¢ |
| | | [ |
| | | { |
| | | v: ``, |
| | | t: "s", // æå®æ é¢çæ ·å¼ |
| | | }, |
| | | ], |
| | | // è¿æ¯å¯¹åºbody常éç表头 |
| | | ["layerName", "min", "max", "avg", "lng", "lat"], |
| | | ]; |
| | | body.unshift(...header); // å°å®ä¹å¥½ç表头添å å° body ä¸ |
| | | const sheet = XLSXS.utils.aoa_to_sheet(body); // aoa_to_sheet å°äºç»´æ°ç»è½¬æ sheet |
| | | // æ¤å¤å¼å§åå¹¶åï¼å³ç¸åååçè¡¨æ ¼åå¹¶åå
æ ¼ |
| | | let includeB = []; |
| | | let includesBnumber = []; |
| | | for (let key in sheet) { |
| | | // console.log(sheet[key]); |
| | | // if (key.includes("B")) { |
| | | // // 第ä¸åæ¯A,代表åºå·ï¼ç¬¬äºåæ¯Bï¼ä»£è¡¨å§å |
| | | // includeB.push(sheet[key]); |
| | | // } |
| | | // includeB.push(sheet[key]); |
| | | } |
| | | // includeB.forEach((e, i) => { |
| | | // if (!(e.v.includes("å§å") || e.v.includes("å
±è®¡"))) { |
| | | // includesBnumber.push({ |
| | | // name: e.v, |
| | | // number: i + 1, // å ä¸ºææ é¢ï¼æä»¥è¦ä»ç¬¬2è¡å¼å§ |
| | | // }); |
| | | // } |
| | | // }); |
| | | // å»é |
| | | // let cancelTwice = () => { |
| | | // let map = new Map(); |
| | | // for (let item of includesBnumber) { |
| | | // if (!map.has(item.name)) { |
| | | // map.set(item.name, item); |
| | | // } |
| | | // } |
| | | // return [...map.values()]; |
| | | // }; |
| | | // let newArr = cancelTwice(); |
| | | // åå¹¶ |
| | | // let newMerges = []; |
| | | // merges.forEach((e, i) => { |
| | | // if (i != 0) { |
| | | // newMerges.push( |
| | | // // åå¹¶ï¼s代表åå¹¶çå¼å§åå
æ ¼ï¼cæ¯åï¼ræ¯è¡ï¼eæ¯ä»£è¡¨åå¹¶çç»æåå
æ ¼ |
| | | // { |
| | | // s: { |
| | | // c: e.s.c, |
| | | // r: e.s.r + 1, //rå 1æ¯å 为å äºè¡¨æ ¼çæ é¢ |
| | | // }, |
| | | // e: { |
| | | // c: e.e.c, |
| | | // r: e.e.r + 1, |
| | | // }, |
| | | // } |
| | | // ); |
| | | // } else { |
| | | // newMerges.push(e); // æ é¢åå¹¶ |
| | | // } |
| | | // }); |
| | | // merges = newMerges; |
| | | // // 设置åå¹¶å§ååçåå
æ ¼ |
| | | // newArr.forEach((e, i) => { |
| | | // merges.push({ |
| | | // s: { r: e.number, c: 1 }, |
| | | // e: { |
| | | // r: newArr[i + 1]?.number ? newArr[i + 1].number - 2 : data.length - 1, |
| | | // c: 1, |
| | | // }, |
| | | // }); |
| | | // }); |
| | | // sheet["!merges"] = merges; // å°mergesæ·»å å°sheetä¸ |
| | | // 设置å宽 |
| | | const cols = [{ wch: 100 }, { wch: 15 }, { wch: 12 }, { wch: 12 }]; |
| | | sheet["!cols"] = cols; // å°colsæ·»å å°sheetä¸ |
| | | // const rows = [{ hpx: 20 }, { hpx: 16 }, { hpx: 18 }]; |
| | | // sheet["!rows"] = rows; // å°rowsæ·»å å°sheetä¸ï¼è®¾ç½®è¡é« |
| | | Object.keys(sheet).forEach((key, i) => { |
| | | // 设置åå
æ ¼æ ·å¼ |
| | | if (key.indexOf("!") < 0) { |
| | | if (key == "A1") { |
| | | // 设置æ é¢ |
| | | sheet[key].s = { |
| | | alignment: { |
| | | horizontal: "center", //æ°´å¹³å±
ä¸ |
| | | vertical: "center", //ç«ç´å±
ä¸ |
| | | }, |
| | | font: { |
| | | bold: true, |
| | | // sz: 14, |
| | | // name: "å®ä½", |
| | | }, |
| | | }; |
| | | } else if ( |
| | | key == "A2" || |
| | | key == "B2" || |
| | | key == "C2" || |
| | | key == "D2" || |
| | | key == "E2" || |
| | | key == "F2" || |
| | | key == "G2" || |
| | | key == "H2" || |
| | | key == "I2" |
| | | ) { |
| | | // 设置表头 |
| | | sheet[key].s = { |
| | | fill: { |
| | | fgColor: { rgb: "A6A6A6" }, |
| | | }, |
| | | border: { |
| | | top: { style: "thin" }, |
| | | left: { style: "thin" }, |
| | | bottom: { style: "thin" }, |
| | | right: { style: "thin" }, |
| | | }, |
| | | font: { |
| | | bold: true, |
| | | // sz: 12, |
| | | // name: "å®ä½", |
| | | }, |
| | | }; |
| | | } else { |
| | | if (key.includes("A")) { |
| | | // åºåæå¨å |
| | | if (typeof sheet[key].v == "number") { |
| | | // å表åè¦æ±åºå·è¦å±
ä¸ï¼åè®¡åæ»å计å±
å·¦(åºè¯¥æ¯ç³»ç»é»è®¤çï¼å¦æè¦è®¾ç½®å±
å·¦æå±
å³ï¼ä¹å¯ä»¥èªå·±è®¾ç½®ä¸alignment屿§) |
| | | sheet[key].s = { |
| | | alignment: { |
| | | horizontal: "center", |
| | | vertical: "center", |
| | | }, |
| | | border: { |
| | | top: { style: "thin" }, |
| | | left: { style: "thin" }, |
| | | bottom: { style: "thin" }, |
| | | right: { style: "thin" }, |
| | | }, |
| | | }; |
| | | } else { |
| | | sheet[key].s = { |
| | | border: { |
| | | top: { style: "thin" }, |
| | | left: { style: "thin" }, |
| | | bottom: { style: "thin" }, |
| | | right: { style: "thin" }, |
| | | }, |
| | | }; |
| | | } |
| | | } else { |
| | | sheet[key].s = { |
| | | border: { |
| | | top: { style: "thin" }, |
| | | left: { style: "thin" }, |
| | | bottom: { style: "thin" }, |
| | | right: { style: "thin" }, |
| | | }, |
| | | alignment: { |
| | | horizontal: "left", |
| | | vertical: "center", |
| | | }, |
| | | }; |
| | | } |
| | | } |
| | | } |
| | | }); |
| | | // 设置ç»å°¾çè¡¨æ ¼ |
| | | // let sheetBorder = sheet["!ref"].substring(4); // å 为导åºçåå
æ ¼è¡æ°ä¸ç¡®å®ï¼æä»¥æ¿å°æåä¸è¡çæ°å |
| | | // let endSheetBorder = ["C", "D", "E", "F", "G", "H"]; //å 为æåä¸è¡çåå¹¶ç忝䏿 ·çï¼æä»¥è¿éå¯ä»¥ç´æ¥å°åçåå
æ ¼åºå·å个å®å¼ |
| | | // endSheetBorder.forEach((e) => { |
| | | // let addBorder = e + sheetBorder; |
| | | // sheet[addBorder] = { |
| | | // v: "", |
| | | // t: "s", |
| | | // s: { |
| | | // border: { |
| | | // top: { style: "thin" }, |
| | | // bottom: { style: "thin" }, |
| | | // }, |
| | | // }, |
| | | // }; |
| | | // }); |
| | | const workbook = XLSXS.utils.book_new(); // å建èæç workbook |
| | | XLSXS.utils.book_append_sheet(workbook, sheet); // å workbook 䏿·»å sheet |
| | | XLSXS.writeFile(workbook, "data-region" + ".xlsx"); // å¯¼åº workbook |
| | | } |
| | |
| | | watch, |
| | | } from "vue"; |
| | | import { useStore } from "vuex"; // å¼å
¥useStore æ¹æ³ |
| | | import { selectByPoint, selectByPolygon } from "@/api/api"; |
| | | import WKT from "terraformer-wkt-parser"; |
| | | import * as turf from "@turf/turf"; |
| | | const emits = defineEmits(["setCloseplotting"]); |
| | | const store = useStore(); // è¯¥æ¹æ³ç¨äºè¿åstore å®ä¾ |
| | | let list = ref([]); |
| | |
| | | }); |
| | | const lineColor = ref(null); |
| | | const metiaColor = ref(null); |
| | | |
| | | //ç¹æ¥è¯¢æ¥å£ |
| | | const selectPoint = async () => { |
| | | const dt = await selectByPoint(); |
| | | }; |
| | | //线æ¥è¯¢æ¥å£ |
| | | const selectPolygon = async () => { |
| | | const dt = await selectByPolygon(); |
| | | }; |
| | | const setLayerLocation = (res) => { |
| | | var entities = Viewer.entities._entities._array; |
| | | for (var i in entities) { |
| | |
| | | disableDepthTestDistance: Number.POSITIVE_INFINITY, |
| | | }, |
| | | }); |
| | | var point = turf.point([geom.lat, geom.lng]); |
| | | |
| | | var wkt = WKT.convert(point.geometry); |
| | | |
| | | list.value.push({ |
| | | name: name, |
| | | layer: layer, |
| | | icon: "d.png", |
| | | wkt: wkt, |
| | | lng: geom.lng, |
| | | lat: geom.lat, |
| | | }); |
| | | plotNum.value.point++; |
| | | }; |
| | |
| | | clampToGround: true, |
| | | }, |
| | | }); |
| | | var linestring = turf.lineString([ |
| | | [-24, 63], |
| | | [-23, 60], |
| | | [-25, 65], |
| | | [-20, 69], |
| | | ]); |
| | | |
| | | var wkt = WKT.convert(linestring.geometry); |
| | | list.value.push({ |
| | | wkt: wkt, |
| | | name: name, |
| | | layer: layer, |
| | | icon: "x.png", |
| | |
| | | const setAddEntityPolygon = (res) => { |
| | | var std = []; |
| | | var res_val = res.polygon.hierarchy.getValue().positions; |
| | | |
| | | var geom; |
| | | var coord = []; |
| | | for (var i in res_val) { |
| | | var geom = setCartesianToEightFour(res_val[i]); |
| | | geom = setCartesianToEightFour(res_val[i]); |
| | | std.push(Cesium.Cartesian3.fromDegrees(geom.lng, geom.lat)); |
| | | coord.push([geom.lng, geom.lat]); |
| | | } |
| | | var name = "Polygon#" + plotNum.value.polygon; |
| | | var layer = Viewer.entities.add({ |
| | |
| | | height: 0, |
| | | }, |
| | | }); |
| | | |
| | | coord.push(coord[0]); |
| | | |
| | | var polygon = turf.polygon([coord]); |
| | | var wkt = WKT.convert(polygon.geometry); |
| | | console.log(polygon.geometry); |
| | | let turfPoint = []; |
| | | polygon.geometry.coordinates[0].forEach((e) => { |
| | | turfPoint.push(turf.point(e)); |
| | | }); |
| | | var features = turf.featureCollection(turfPoint); |
| | | |
| | | var center = turf.center(features); |
| | | console.log(center); |
| | | list.value.push({ |
| | | wkt: wkt, |
| | | name: name, |
| | | layer: layer, |
| | | icon: "m.png", |
| | | lng: center.geometry.coordinates[0], |
| | | lat: center.geometry.coordinates[1], |
| | | }); |
| | | plotNum.value.polygon++; |
| | | }; |
| | |
| | | if (nVal.entitiesData != {} && nVal.entitiesData.name) { |
| | | for (var i in list.value) { |
| | | if (list.value[i].name == nVal.entitiesData.name) { |
| | | console.log(list.value[i].name); |
| | | list.value.splice(i, 1); |
| | | break; |
| | | } |
| | |
| | | <Bar-graph :width="'100%'" :height="'260px'"></Bar-graph> |
| | | </div> |
| | | <div class="inquireContent_input" v-if="!chartIsshow"> |
| | | <div class="inquireContent_input_left"> |
| | | <!-- <div class="inquireContent_input_left"> |
| | | <div class="label">èå´æ¡</div> |
| | | <el-input |
| | | v-model="ScopeBox.Scop" |
| | |
| | | > |
| | | <template #append>km</template> |
| | | </el-input> |
| | | </div> |
| | | <div class="inquireContent_input_right"> |
| | | </div> --> |
| | | <div class="inquireContent_input_right" v-show="pixelIsShow"> |
| | | <div class="label">èå´æ¡å
æå¤§åç´ å¼</div> |
| | | <el-select |
| | | v-model="ScopeBox.pixel" |
| | | class="m-2" |
| | | placeholder="åç´ å¼" |
| | | size="small" |
| | | @change="pixelChange" |
| | | > |
| | | <el-option |
| | | v-for="item in options" |
| | |
| | | <div class="inquireContent_msg" v-if="!chartIsshow"> |
| | | <div class="inquireContent_msg_k"> |
| | | <span>æåçè¾¹çæ¡</span> |
| | | <span>{{ ScopeBox.pixel }}</span> |
| | | <span>{{ ScopeBox.pixel }}Ã{{ ScopeBox.pixel }}</span> |
| | | </div> |
| | | <div class="inquireContent_msg_k"> |
| | | <!-- <div class="inquireContent_msg_k"> |
| | | <span>使ç¨</span> |
| | | <span |
| | | >{{ ScopeBox.Scop * 1000 }}.00,{{ ScopeBox.Scop * 1000 }}.00 |
| | | m/px</span |
| | | > |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <div class="inquireContent_table" v-if="!chartIsshow"> |
| | | <div class="table"> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="table_content"> |
| | | <div class="table_tr"> |
| | | <div class="table_td">1</div> |
| | | <div class="table_tr" v-for="(e, i) in resultList" :key="i"> |
| | | <div class="table_td">{{ i + 1 }}</div> |
| | | <div class="table_td"> |
| | | <span> å¹³åå°çè½è§åº¦120m [1]: </span> |
| | | <span> 112.993 </span> |
| | | </div> |
| | | </div> |
| | | <div class="table_tr"> |
| | | <div class="table_td">2</div> |
| | | <div class="table_td"> |
| | | <span> å¹³åå°çè½è§åº¦120m [1]: </span> |
| | | <span> 112.993 </span> |
| | | <span> {{ e.layerName }}</span> |
| | | <span> {{ e.avg }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="download"> |
| | | <el-button link @click="download">ä¸è½½ CSV</el-button> |
| | | </div> |
| | | </el-tab-pane> |
| | | </el-tabs> |
| | |
| | | import { useStore } from "vuex"; // å¼å
¥useStore æ¹æ³ |
| | | //echarts |
| | | import BarGraph from "@/components/BarGraph.vue"; |
| | | import { saveFSDZJsonToExcel } from "@/utils/downloadCSV.js"; |
| | | import { selectByPoint, selectByPolygon, selectByPolyline } from "@/api/api"; |
| | | import { ElMessage } from "element-plus"; |
| | | const store = useStore(); // è¯¥æ¹æ³ç¨äºè¿åstore å®ä¾ |
| | | const emits = defineEmits(["setCloseplotting"]); |
| | | let isShow = ref(false); |
| | | let pixelIsShow = ref(true); |
| | | let inquireData = ref({ |
| | | name: "path #9", |
| | | icon: "d.png", |
| | |
| | | const activeName = ref("second"); |
| | | const ScopeBox = ref({ |
| | | Scop: "", |
| | | pixel: "", |
| | | pixel: "1", |
| | | }); |
| | | const options = [ |
| | | { |
| | | value: "1Ã1", |
| | | value: "1", |
| | | label: "1Ã1", |
| | | }, |
| | | { |
| | | value: "2Ã2", |
| | | value: "2", |
| | | label: "2Ã2", |
| | | }, |
| | | { |
| | | value: "4Ã4", |
| | | value: "4", |
| | | label: "4Ã4", |
| | | }, |
| | | { |
| | | value: "8Ã8", |
| | | value: "8", |
| | | label: "8Ã8", |
| | | }, |
| | | { |
| | | value: "16Ã16", |
| | | value: "16", |
| | | label: "16Ã16", |
| | | }, |
| | | { |
| | | value: "32Ã32", |
| | | value: "32", |
| | | label: "32Ã32", |
| | | }, |
| | | { |
| | | value: "64Ã64", |
| | | value: "64", |
| | | label: "64Ã64", |
| | | }, |
| | | { |
| | | value: "Option3", |
| | | label: "Option3", |
| | | }, |
| | | { |
| | | value: "128Ã128", |
| | | value: "128", |
| | | label: "128Ã128", |
| | | }, |
| | | { |
| | | value: "256Ã256", |
| | | value: "256", |
| | | label: "256Ã256", |
| | | }, |
| | | ]; |
| | | let resultList = ref([]); |
| | | //åç´ éæ© |
| | | const pixelChange = (val) => { |
| | | selectPoint({ |
| | | pixel: val, |
| | | wkt: `POINT (${store.state.plottingInquireData.entitiesData.lng} ${store.state.plottingInquireData.entitiesData.lat})`, |
| | | }); |
| | | }; |
| | | //ä¸è½½csv |
| | | const download = () => { |
| | | saveFSDZJsonToExcel(resultList.value, "123", ""); |
| | | }; |
| | | //ç¹æ¥è¯¢æ¥å£ |
| | | const selectPoint = async (res) => { |
| | | const dt = await selectByPoint(res); |
| | | |
| | | if (dt.code !== 200) { |
| | | return ElMessage.error("æ¥è¯¢é误"); |
| | | } |
| | | |
| | | dt.result.forEach((e) => { |
| | | if (e.code != 200) { |
| | | e.avg = "-"; |
| | | e.max = "-"; |
| | | e.min = "-"; |
| | | } |
| | | e.lng = store.state.plottingInquireData.entitiesData.lng; |
| | | e.lat = store.state.plottingInquireData.entitiesData.lat; |
| | | resultList.value.push(e); |
| | | }); |
| | | }; |
| | | //颿¥è¯¢æ¥å£ |
| | | const selectPolygon = async (res) => { |
| | | const dt = await selectByPolygon(res); |
| | | |
| | | dt.result.forEach((e) => { |
| | | if (e.code != 200) { |
| | | e.avg = "-"; |
| | | e.max = "-"; |
| | | e.min = "-"; |
| | | } |
| | | e.lng = store.state.plottingInquireData.entitiesData.lng; |
| | | e.lat = store.state.plottingInquireData.entitiesData.lat; |
| | | resultList.value.push(e); |
| | | }); |
| | | }; |
| | | //线æ¥è¯¢æ¥å£ |
| | | const selectPolyline = async (res) => { |
| | | const dt = await selectByPolyline(res); |
| | | console.log(dt); |
| | | }; |
| | | const setLayerLocation = () => { |
| | | var entities = Viewer.entities._entities._array; |
| | | for (var i in entities) { |
| | |
| | | inquireData.value = nVal.entitiesData; |
| | | if (nVal.entitiesData.icon == "x.png") { |
| | | chartIsshow.value = true; |
| | | // selectPolyline({ |
| | | // pixel: ScopeBox.value.pixel, |
| | | // wkt: `POINT (${nVal.entitiesData.lng})`, |
| | | // }) |
| | | } |
| | | if (nVal.entitiesData.icon == "m.png") { |
| | | if (nVal.entitiesData.name == oVal.entitiesData.name) { |
| | | return; |
| | | } |
| | | pixelIsShow.value = false; |
| | | selectPolygon({ wkt: nVal.entitiesData.wkt }); |
| | | // console.log(nVal); |
| | | } |
| | | if (nVal.entitiesData.icon == "d.png") { |
| | | selectPoint({ |
| | | pixel: ScopeBox.value.pixel, |
| | | wkt: nVal.entitiesData.wkt, |
| | | }); |
| | | } |
| | | }, |
| | | { deep: true } |
| | |
| | | .inquireContent_table { |
| | | padding-right: 15px; |
| | | padding-left: 15px; |
| | | padding-bottom: 14px; |
| | | padding-bottom: 10px; |
| | | .table { |
| | | background: rgba(0, 0, 0, 0, 4); |
| | | border: 1px solid rgba(214, 228, 255, 0.4); |
| | |
| | | justify-content: center; |
| | | align-items: center; |
| | | border-right: 1px solid rgba(214, 228, 255, 0.4); |
| | | box-sizing: border-box; |
| | | } |
| | | .table_head_td:nth-child(2) { |
| | | width: 237px; |
| | |
| | | height: 440px; |
| | | overflow: auto; |
| | | .table_tr { |
| | | height: 27px; |
| | | // height: 27px; |
| | | display: flex; |
| | | background: #000000; |
| | | // padding: 5px 0; |
| | | .table_td { |
| | | width: 50px; |
| | | font-size: 14px; |
| | | |
| | | font-size: 12px; |
| | | font-weight: 400; |
| | | color: #d6e4ff; |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | border-right: 1px solid rgba(214, 228, 255, 0.4); |
| | | white-space: nowrap; |
| | | box-sizing: border-box; |
| | | // padding: 5px; |
| | | // white-space: nowrap; |
| | | span { |
| | | display: block; |
| | | width: 50%; |
| | | word-wrap: break-word; |
| | | // white-space: pre; |
| | | } |
| | | span:nth-child(2) { |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | } |
| | | } |
| | | .table_td:nth-child(2) { |
| | | width: 237px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | padding: 0 10px; |
| | | // padding: 0 10px; |
| | | padding-left: 10px; |
| | | padding-right: 10px; |
| | | padding-top: 5px; |
| | | padding-bottom: 5px; |
| | | border-right: 0; |
| | | } |
| | | } |
| | |
| | | } |
| | | } |
| | | } |
| | | .download { |
| | | padding-right: 15px; |
| | | padding-left: 15px; |
| | | padding-bottom: 14px; |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | .el-button { |
| | | font-size: 12px; |
| | | color: #d6e4ff; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |