From 1a7ac5cfe27a7631966f45c2b45cc9114b501852 Mon Sep 17 00:00:00 2001
From: Surpriseplus <845948745@qq.com>
Date: 星期二, 12 九月 2023 15:20:14 +0800
Subject: [PATCH] 发布管理添加颜色列表选择
---
src/views/datamanage/uploadmanage.vue | 168 +++++++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 165 insertions(+), 3 deletions(-)
diff --git a/src/views/datamanage/uploadmanage.vue b/src/views/datamanage/uploadmanage.vue
index 5419a3f..4c22327 100644
--- a/src/views/datamanage/uploadmanage.vue
+++ b/src/views/datamanage/uploadmanage.vue
@@ -511,7 +511,7 @@
</el-select>
</el-form-item>
- <!-- 鍧愭爣绯� -->
+ <!-- 鎷変几鍥犲瓙 -->
<el-form-item
v-show="insertLayer.showFactor"
:label="$t('dataManage.vmobj.labe17')"
@@ -526,6 +526,58 @@
style="width: 100%;"
></el-input-number>
</el-form-item>
+
+ <el-form-item :label="$t('dataManage.vmobj.labe19')">
+ <el-select
+ size="small"
+ placeholder="璇烽�夋嫨棰滆壊琛�"
+ v-model="colorTableType"
+ style="width: 100%;"
+ >
+ <el-option
+ v-for="(item, i) in colorTableOptions"
+ :key="i"
+ :label="item.label"
+ :value="item.value"
+ ></el-option>
+
+ </el-select>
+ </el-form-item>
+ <!-- 棰滆壊琛� -->
+ <el-form-item
+ v-show="colorTableType != 2"
+ :label="$t('dataManage.vmobj.labe18')"
+ >
+ <el-select
+ v-model="renderType"
+ placeholder="璇烽�夋嫨娓叉煋绫诲瀷"
+ size="small"
+ @change="changeSelection(renderType)"
+ ref="selectColor"
+ style="width: 100%;"
+ clearable
+ >
+ <el-option
+ v-for="(item, i) in renderTypeOptions"
+ :key="i"
+ :label="item.name"
+ :value="item.name"
+ >
+ <div
+ style="
+ height: 30px;
+ width: 100%;
+ position: relative;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ "
+ :style="item.domCss"
+ ></div>
+ </el-option>
+ </el-select>
+ </el-form-item>
+
<!-- 鍧愭爣绯� -->
<el-form-item :label="$t('dataManage.vmobj.labe16')">
<el-select
@@ -668,6 +720,7 @@
publish_deletesSjServices,
publish_update,
publish_insertSjService,
+ publish_selectSjColorTables
} from '../../api/api.js'
import { conditions } from '../Archive/Archive';
import { method_option, nodata_Option, server_option, system_Option, type_option } from './js/layerManage';
@@ -736,7 +789,23 @@
serverOption: [],
enhanceOption: [],
epsgOption: [],
- noDataOption: []
+ noDataOption: [],
+ renderType: null,
+ renderTypeOptions: [],
+ colorTableType: null,
+ colorTableOptions: [
+ {
+ value: 2,
+ label: "璇烽�夋嫨棰滆壊琛�",
+ },
+ {
+ value: 0,
+ label: "鏅�氶鑹茶〃",
+ },
+ {
+ value: 1,
+ label: "鐩存柟鍥惧潎琛�",
+ }]
}
},
methods: {
@@ -840,7 +909,28 @@
for (var i in this.multipleSelection) {
std.push(this.multipleSelection[i].id)
}
+ var color1 = null;
+ var color2 = null;
+ var level = null;
+ var val_data = [];
+
+ for (var i in this.renderTypeOptions) {
+ if (this.renderTypeOptions[i].name == this.renderType.value) {
+ val_data.push(this.renderTypeOptions[i].content.levels);
+ }
+ }
+ if (val_data.length > 0) {
+ level = val_data[0];
+ }
+
+ if (this.colorTableType == 0) {
+ color1 = level;
+ } else if (this.colorTableType == 1) {
+ color2 = level;
+ }
var obj = {
+ colorTable: color1, // 鏅�氶鑹茶〃锛屽彲涓嶈
+ gradientColorTable: color2,
dircode: this.formInline.dirid,
name: name,
ids: std,
@@ -904,6 +994,9 @@
} else {
this.insertLayer.showFactor = false;
}
+ this.colorTableType = 2;
+ this.renderType = null;
+ this.insertLayer.name = this.multipleSelection[0].name
this.insertDialogVisible = true;
},
@@ -1284,6 +1377,74 @@
return father.pid == 0 // 杩斿洖涓�绾ц彍鍗�
})
},
+ async getColorJson() {
+ var dt = await publish_selectSjColorTables({
+ pageIndex: 1,
+ pageSize: 100000,
+ });
+
+ if (!dt.result) return
+ this.renderTypeOptions = dt.result.item_list;
+
+ this.renderTypeOptions.forEach((e) => {
+ let css = "";
+ let css1 = "";
+ e.content.levels.forEach((v) => {
+ if ("r_start" in v) {
+ css += `rgb(${v.r_start}, ${v.g_start}, ${v.b_start}),rgb(${v.r_end}, ${v.g_end}, ${v.b_end}),`;
+ } else if ("r" in v) {
+ css1 += `rgb(${v.r}, ${v.g}, ${v.b}),`;
+ }
+ });
+
+ let cssColor = `${css1}${css}`;
+ let cssStr = "";
+
+ if (cssColor.length == 19) {
+ cssStr = `background: ${cssColor.slice(0, -1)}`;
+ } else {
+ cssStr = `background-image:linear-gradient(to right, ${cssColor.slice(
+ 0,
+ -1
+ )})`;
+ }
+ e.domCss = cssStr;
+ });
+ },
+ changeSelection(scope) {
+ // if (scope == "") {
+ // this.$refs.selectColor.$el.children[0].children[0].removeAttribute("style");
+ // this.$refs.selectColor.$el.children[0].children[0].children[0].removeAttribute(
+ // "style"
+ // );
+ // this.$refs.selectColor.$el.children[0].children[0].children[0].children[0].removeAttribute(
+ // "style"
+ // );
+ // return;
+ // }
+ // for (let index in this.renderTypeOptions) {
+ // let obj = this.renderTypeOptions[index];
+ // if (obj.name == scope) {
+ // this.$refs.selectColor.$el.children[0].children[0].setAttribute(
+ // "style",
+ // `background-image: linear-gradient(to right,${obj.domCss});
+ // width: 100%; height: 100%;
+ // border: none;
+ // height: 33px;`
+ // );
+ // this.$refs.selectColor.$el.children[0].children[0].children[0].setAttribute(
+ // "style",
+ // `display: flex;
+ // justify-content: flex-end;
+ // background:transparent;`
+ // );
+ // this.$refs.selectColor.$el.children[0].children[0].children[0].children[0].setAttribute(
+ // "style",
+ // `display: none;`
+ // );
+ // }
+ // }
+ }
},
mounted() {
this.active = 'first';
@@ -1291,7 +1452,8 @@
this.serverOption = server_option;
this.epsgOption = system_Option;
this.noDataOption = nodata_Option;
- this.enhanceOption = method_option
+ this.enhanceOption = method_option;
+ this.getColorJson()
this.setPageStart();
this.setOptions();
--
Gitblit v1.9.3