{
- if (item <= 100 * this.bigscreenScaleInWorkbench) {
- obj.index = index;
- obj.size = 100 * this.bigscreenScaleInWorkbench; // item
- }
- });
- if (obj.index === -1) {
- obj.index = 0;
- obj.size = this.sizeRange[0];
- }
- return obj;
- },
// 大屏在设计模式的大小
bigscreenWidthInWorkbench() {
return this.getPXUnderScale(this.bigscreenWidth) + this.widthPaddingTools;
@@ -536,29 +478,8 @@ export default {
},
deep: true,
},
- defaultSize: {
- handler(val) {
- if (val !== -1) {
- this.currentSizeRangeIndex = val.index;
- this.scaleNum = val.size;
- }
- },
- immediate: true,
- },
- bigscreenWidth() {
- this.initVueRulerTool();
- },
- bigscreenHeight() {
- this.initVueRulerTool();
- },
- },
- created() {
- /* 以下是记录历史的 */
- this.revoke = new Revoke();
},
mounted() {
- // 如果是新的设计工作台
- this.initEchartData();
this.widgets = [];
window.addEventListener("mouseup", () => {
this.grade = false;
@@ -568,81 +489,6 @@ export default {
});
},
methods: {
- /**
- * @param num: 0缩小 1放大 2默认比例
- * sizeRange: [20, 40, 60, 72, 100, 150, 200, 300, 400]
- */
- setSize(num) {
- if (num === 0) {
- // 缩小
- if (this.currentSizeRangeIndex === 0) return;
- this.currentSizeRangeIndex -= 1;
- } else if (num === 1) {
- // 放大
- if (this.currentSizeRangeIndex === 8) return;
- this.currentSizeRangeIndex += 1;
- } else if (num === 2) {
- // 正常比例
- this.currentSizeRangeIndex = this.defaultSize.index;
- }
- this.scaleNum =
- this.currentSizeRangeIndex === this.defaultSize.index
- ? this.defaultSize.size
- : this.sizeRange[this.currentSizeRangeIndex];
- },
- // 初始化 修正插件样式
- initVueRulerTool() {
- const vueRulerToolDom = this.$refs["vue-ruler-tool"].$el; // 操作面板 第三方插件工具
- const contentDom = vueRulerToolDom.querySelector(".vue-ruler-content");
- const vueRulerX = vueRulerToolDom.querySelector(".vue-ruler-h"); // 横向标尺
- const vueRulerY = vueRulerToolDom.querySelector(".vue-ruler-v"); // 纵向标尺
- // vueRulerToolDom.style.cssText += ';width:' + (this.bigscreenWidth + 18) + 'px !important;height:' + (this.bigscreenHeight + 18) + 'px !important;'
- contentDom.style.width = "100%";
- contentDom.style.height = "100%";
-
- let xHtmlContent = ""; // '
0'
- let yHtmlContent = ""; // '
0'
- let currentNum = 0;
- while (currentNum < +this.bigscreenWidth) {
- xHtmlContent += `
${currentNum}`;
- currentNum += 50;
- }
- currentNum = 0;
- while (currentNum < +this.bigscreenHeight) {
- yHtmlContent += `
${currentNum}`;
- currentNum += 50;
- }
- vueRulerX.innerHTML = xHtmlContent;
- vueRulerY.innerHTML = yHtmlContent;
- },
- /**
- * @description: 恢复
- * @param {*}
- * @return {*}
- */
- handleUndo() {
- const record = this.revoke.undo();
- if (!record) {
- return false;
- }
- this.widgets = record;
- },
- /**
- * @description: 重做
- * @param {*}
- * @return {*}
- */
- handleRedo() {
- const record = this.revoke.redo();
- if (!record) {
- return false;
- }
- this.widgets = record;
- },
handlerLayerWidget(val) {
const layerWidgetArr = [];
for (let i = 0; i < val.length; i++) {
@@ -670,196 +516,6 @@ export default {
return item.value.data;
});
},
- async initEchartData() {
- const reportCode = this.$route.query.reportCode;
- const { code, data } = await detailDashboard(reportCode);
- if (code != 200) return;
- const processData = this.handleInitEchartsData(data);
- const screenData = this.handleBigScreen(data.dashboard);
- this.widgets = processData;
- this.dashboard = screenData;
- this.bigscreenWidth = this.dashboard.width;
- this.bigscreenHeight = this.dashboard.height;
- },
- handleBigScreen(data) {
- const optionScreen = getToolByCode("screen").options;
- const setup = optionScreen.setup;
- for (const key in data) {
- for (let i = 0; i < setup.length; i++) {
- if (key == setup[i].name) {
- setup[i].value = data[key];
- }
- }
- }
- this.setOptionsOnClickScreen();
- return {
- backgroundColor:
- (data && data.backgroundColor) || (!data ? "#1e1e1e" : ""),
- backgroundImage: (data && data.backgroundImage) || "",
- height: (data && data.height) || "1080",
- title: (data && data.title) || "",
- width: (data && data.width) || "1920",
- };
- },
- handleInitEchartsData(data) {
- const widgets = data.dashboard ? data.dashboard.widgets : [];
- const widgetsData = [];
- for (let i = 0; i < widgets.length; i++) {
- let obj = {};
- obj.type = widgets[i].type;
- obj.value = {
- setup: widgets[i].value.setup,
- data: widgets[i].value.data,
- position: widgets[i].value.position,
- };
- const tool = this.deepClone(getToolByCode(widgets[i].type));
- if (!tool) {
- const message =
- "暂未提供该组件或该组件下线了，组件code: " + widgets[i].type;
- console.error(message);
- if (process.env.NODE_ENV === "development") {
- // 40@remarks 看生产要不要提示
- this.$message.error(message);
- }
- continue; // 找不到就跳过，避免整个报表都加载不出来
- }
- const option = tool.options;
- const options = this.handleOptionsData(widgets[i].value, option);
- obj.options = options;
- obj.value.widgetId = obj.value.setup.widgetId;
- widgetsData.push(obj);
- }
- return widgetsData;
- },
- handleOptionsData(data, option) {
- for (const key in data.setup) {
- for (let i = 0; i < option.setup.length; i++) {
- let item = option.setup[i];
- if (Object.prototype.toString.call(item) == "[object Object]") {
- if (key == option.setup[i].name) {
- option.setup[i].value = data.setup[key];
- }
- } else if (Object.prototype.toString.call(item) == "[object Array]") {
- for (let j = 0; j < item.length; j++) {
- const list = item[j].list;
- list.forEach((el) => {
- if (key == el.name) {
- el.value = data.setup[key];
- }
- });
- }
- }
- }
- }
- // position
- for (const key in data.position) {
- for (let i = 0; i < option.position.length; i++) {
- if (key == option.position[i].name) {
- option.position[i].value = data.position[key];
- }
- }
- }
- // data
- for (const key in data.data) {
- for (let i = 0; i < option.data.length; i++) {
- if (key == option.data[i].name) {
- option.data[i].value = data.data[key];
- }
- }
- }
- return option;
- },
- // 保存数据
- async saveData() {
- if (!this.widgets || this.widgets.length == 0) {
- this.$message.error("请添加组件");
- return;
- }
- const screenData = {
- reportCode: this.$route.query.reportCode,
- dashboard: {
- title: this.dashboard.title,
- width: this.dashboard.width,
- height: this.dashboard.height,
- backgroundColor: this.dashboard.backgroundColor,
- backgroundImage: this.dashboard.backgroundImage,
- },
- widgets: this.widgets,
- };
- screenData.widgets.forEach((widget) => {
- widget.value.setup.widgetId = widget.value.widgetId;
- });
- const { code, data } = await insertDashboard(screenData);
- if (code == "200") {
- this.$message.success("保存成功！");
- }
- },
- // 预览
- viewScreen() {
- let routeUrl = this.$router.resolve({
- path: "/bigscreen/viewer",
- query: { reportCode: this.$route.query.reportCode },
- });
- window.open(routeUrl.href, "_blank");
- },
- // 导出
- async exportDashboard(val) {
- const fileName = this.$route.query.reportCode + ".zip";
-
- const param = {
- reportCode: this.$route.query.reportCode,
- showDataSet: val,
- };
- exportDashboard(param).then((res) => {
- const that = this;
- const type = res.type;
- if (type == "application/json") {
- let reader = new FileReader();
- reader.readAsText(res, "utf-8");
- reader.onload = function () {
- const data = JSON.parse(reader.result);
- that.$message.error(data.message);
- };
- return;
- }
-
- const blob = new Blob([res], { type: "application/octet-stream" });
- if (window.navigator.msSaveOrOpenBlob) {
- //msSaveOrOpenBlob方法返回bool值
- navigator.msSaveBlob(blob, fileName); //本地保存
- } else {
- const link = document.createElement("a"); //a标签下载
- link.href = window.URL.createObjectURL(blob);
- link.download = fileName;
- link.click();
- window.URL.revokeObjectURL(link.href);
- }
- });
- },
- // 上传成功的回调
- handleUpload(response, file, fileList) {
- //清除el-upload组件中的文件
- this.$refs.upload.clearFiles();
- //刷新大屏页面
- this.initEchartData();
- if (response.code == "200") {
- this.$message({
- message: "导入成功！",
- type: "success",
- });
- } else {
- this.$message({
- message: response.message,
- type: "error",
- });
- }
- },
- handleError(err) {
- this.$message({
- message: "上传失败！",
- type: "error",
- });
- },
// 在缩放模式下的大小
getPXUnderScale(px) {
@@ -950,20 +606,18 @@ export default {
// 激活新组件的配置属性
this.setOptionsOnClickWidget(this.widgets.length - 1);
},
-
// 对组件默认值处理
handleDefaultValue(widgetJson) {
+ console.log(widgetJson);
for (const key in widgetJson) {
if (key == "options") {
// collapse、data、position、setup
// setup 处理
for (let i = 0; i < widgetJson.options.setup.length; i++) {
const item = widgetJson.options.setup[i];
- if (Object.prototype.toString.call(item) == "[object Object]") {
+ if (this.isObjectFn(item)) {
widgetJson.value.setup[item.name] = item.value;
- } else if (
- Object.prototype.toString.call(item) == "[object Array]"
- ) {
+ } else if (this.isArrayFn(item)) {
for (let j = 0; j < item.length; j++) {
const list = item[j].list;
list.forEach((el) => {
@@ -1003,7 +657,6 @@ export default {
this.activeName = "first";
this.widgetOptions = getToolByCode("screen")["options"];
},
-
// 如果是点击某个组件，获取该组件的配置项
setOptionsOnClickWidget(obj) {
this.screenCode = "";
@@ -1052,7 +705,7 @@ export default {
console.log("val", val);
console.log(this.widgetOptions);
if (this.screenCode == "screen") {
- let newSetup = new Array();
+ let newSetup = [];
this.dashboard = this.deepClone(val);
console.log("asd", this.dashboard);
console.log(this.widgetOptions);
@@ -1083,31 +736,15 @@ export default {
}
}
},
- rightClick(event, index) {
- this.rightClickIndex = index;
- const left = event.clientX;
- const top = event.clientY;
- if (left || top) {
- this.styleObj = {
- left: left + "px",
- top: top + "px",
- display: "block",
- };
- }
- this.visibleContentMenu = true;
- return false;
- },
setDefaultValue(options, val) {
for (let i = 0; i < options.length; i++) {
- if (Object.prototype.toString.call(options[i]) == "[object Object]") {
+ if (this.isObjectFn(options[i])) {
for (const k in val) {
if (options[i].name == k) {
options[i].value = val[k];
}
}
- } else if (
- Object.prototype.toString.call(options[i]) == "[object Array]"
- ) {
+ } else if (this.isArrayFn(options[i])) {
for (let j = 0; j < options[i].length; j++) {
const list = options[i][j].list;
for (let z = 0; z < list.length; z++) {
@@ -1125,565 +762,10 @@ export default {
evt.preventDefault();
this.widgets = this.swapArr(this.widgets, evt.oldIndex, evt.newIndex);
},
- // 数组 元素互换位置
- swapArr(arr, oldIndex, newIndex) {
- arr[oldIndex] = arr.splice(newIndex, 1, arr[oldIndex])[0];
- return arr;
- },
- // 删除
- deletelayer() {
- this.widgets.splice(this.rightClickIndex, 1);
- },
- // 锁定
- lockLayer() {
- const obj = this.widgets[this.rightClickIndex];
- this.$set(obj.value.position, "disabled", true);
- },
- // 解除锁定
- noLockLayer() {
- const obj = this.widgets[this.rightClickIndex];
- this.$set(obj.value.position, "disabled", false);
- },
- // 复制
- copylayer() {
- const obj = this.deepClone(this.widgets[this.rightClickIndex]);
- obj.value.position.top += 40; // 复制的元素向右下角偏移一点
- obj.value.position.left += 40;
- obj.value.widgetId = Number(Math.random().toString().substr(2)).toString(
- 36
- );
- this.widgets.splice(this.widgets.length, 0, obj);
- this.$nextTick(() => {
- this.layerClick(this.widgets.length - 1); // 复制后定位到最新的组件
- });
- },
- // 置顶
- istopLayer() {
- if (this.rightClickIndex + 1 < this.widgets.length) {
- const temp = this.widgets.splice(this.rightClickIndex, 1)[0];
- this.widgets.push(temp);
- }
- },
- // 置底
- setlowLayer() {
- if (this.rightClickIndex != 0) {
- this.widgets.unshift(this.widgets.splice(this.rightClickIndex, 1)[0]);
- }
- },
- // 上移一层
- moveupLayer() {
- if (this.rightClickIndex != 0) {
- this.widgets[this.rightClickIndex] = this.widgets.splice(
- this.rightClickIndex - 1,
- 1,
- this.widgets[this.rightClickIndex]
- )[0];
- } else {
- this.widgets.push(this.widgets.shift());
- }
- },
- // 下移一层
- movedownLayer() {
- if (this.rightClickIndex != this.widgets.length - 1) {
- this.widgets[this.rightClickIndex] = this.widgets.splice(
- this.rightClickIndex + 1,
- 1,
- this.widgets[this.rightClickIndex]
- )[0];
- } else {
- this.widgets.unshift(this.widgets.splice(this.rightClickIndex, 1)[0]);
- }
- },
},
};
diff --git a/report-ui/src/views/bigscreenDesigner/designer/tools/configure/scaleCharts/widget-scale.js b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/scaleCharts/widget-scale.js
new file mode 100644
index 00000000..0fbbd12a
--- /dev/null
+++ b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/scaleCharts/widget-scale.js
@@ -0,0 +1,505 @@
+
+export const widgetScale = {
+ code: 'widget-scale',
+ type: 'scaleCharts',
+ tabName: '刻度尺',
+ label: '刻度尺',
+ icon: 'iconicon_tubiao_bingtu',
+ options: {
+ // 配置
+ setup: [
+ {
+ type: 'el-input-text',
+ label: '图层名称',
+ name: 'layerName',
+ required: false,
+ placeholder: '',
+ value: '刻度尺',
+ },
+ {
+ type: 'el-input-text',
+ label: '图层唯一标识',
+ name: 'uuid',
+ disabled: true,
+ value: 'widget-scale' + Date.now()
+ },
+ {
+ type: 'el-switch',
+ label: '竖展示',
+ name: 'verticalShow',
+ required: false,
+ placeholder: '',
+ value: false,
+ },
+ {
+ type: 'vue-color',
+ label: '背景颜色',
+ name: 'background',
+ required: false,
+ placeholder: '',
+ value: ''
+ },
+ [
+ {
+ name: '标题设置',
+ list: [
+ {
+ type: 'el-switch',
+ label: '标题显示',
+ name: 'isNoTitle',
+ required: false,
+ placeholder: '',
+ value: true,
+ },
+ {
+ type: 'el-input-text',
+ label: '标题名',
+ name: 'titleText',
+ required: false,
+ placeholder: '',
+ value: '',
+ },
+ {
+ type: 'vue-color',
+ label: '字体颜色',
+ name: 'textColor',
+ required: false,
+ placeholder: '',
+ value: '#FFD700'
+ },
+ {
+ type: 'el-input-number',
+ label: '字体字号',
+ name: 'textFontSize',
+ required: false,
+ placeholder: '',
+ value: 20
+ },
+ {
+ type: 'el-select',
+ label: '字体粗细',
+ name: 'textFontWeight',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'bold', name: '粗体' },
+ { code: 'bolder', name: '特粗体' },
+ { code: 'lighter', name: '细体' }
+ ],
+ value: 'normal'
+ },
+ {
+ type: 'el-select',
+ label: '字体风格',
+ name: 'textFontStyle',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'italic', name: 'italic斜体' },
+ { code: 'oblique', name: 'oblique斜体' },
+ ],
+ value: 'normal'
+ },
+ {
+ type: 'el-select',
+ label: '字体位置',
+ name: 'textAlign',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'center', name: '居中' },
+ { code: 'left', name: '左对齐' },
+ { code: 'right', name: '右对齐' },
+ ],
+ value: 'center'
+ },
+ {
+ type: 'el-input-text',
+ label: '副标题名',
+ name: 'subText',
+ required: false,
+ placeholder: '',
+ value: ''
+ },
+ {
+ type: 'vue-color',
+ label: '字体颜色',
+ name: 'subTextColor',
+ required: false,
+ placeholder: '',
+ value: 'rgba(30, 144, 255, 1)'
+ },
+ {
+ type: 'el-input-number',
+ label: '字体字号',
+ name: 'subTextFontSize',
+ required: false,
+ placeholder: '',
+ value: 20
+ },
+ {
+ type: 'el-select',
+ label: '字体粗细',
+ name: 'subTextFontWeight',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'bold', name: '粗体' },
+ { code: 'bolder', name: '特粗体' },
+ { code: 'lighter', name: '细体' }
+ ],
+ value: 'normal'
+ },
+ {
+ type: 'el-select',
+ label: '字体风格',
+ name: 'subTextFontStyle',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'italic', name: 'italic斜体' },
+ { code: 'oblique', name: 'oblique斜体' },
+ ],
+ value: 'normal'
+ },
+ ],
+ },
+ {
+ name: '刻度设定',
+ list: [
+ {
+ type: 'el-input-number',
+ label: '最大刻度',
+ name: 'maxScale',
+ require: false,
+ placeholder: '',
+ value: 100,
+ },
+ {
+ type: 'vue-color',
+ label: '刻度颜色',
+ name: 'scaleColor',
+ required: false,
+ placeholder: '',
+ value: 'rgba(56, 128, 138,1)'
+ },
+ {
+ type: 'el-input-number',
+ label: '刻度宽度',
+ name: 'scaleBarWidth',
+ required: false,
+ placeholder: '',
+ value: 2,
+ },
+ {
+ type: 'el-input-number',
+ label: '刻度值字号',
+ name: 'scaleFontSize',
+ required: false,
+ placeholder: '',
+ value: 16,
+ },
+ {
+ type: 'vue-color',
+ label: '刻度值颜色',
+ name: 'scaleDataColor',
+ required: false,
+ placeholder: '',
+ value: 'rgba(56, 128, 138,1)'
+ },
+ {
+ type: 'el-select',
+ label: '刻度值粗细',
+ name: 'scaleFontWeight',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'bold', name: '粗体' },
+ { code: 'bolder', name: '特粗体' },
+ { code: 'lighter', name: '细体' }
+ ],
+ value: 'normal'
+ },
+ ],
+ },
+ {
+ name: '外框设置',
+ list: [
+ {
+ type: 'el-input-number',
+ label: '宽度',
+ name: 'outBarWidth',
+ required: false,
+ placeholder: '',
+ value: 45,
+ },
+ {
+ type: 'vue-color',
+ label: '颜色',
+ name: 'outBarColor',
+ require: false,
+ placeholder: '',
+ value: '#00FEFF',
+ },
+ {
+ type: 'el-slider',
+ label: '圆角',
+ name: 'outBarRadius',
+ require: false,
+ placeholder: '',
+ value: 50,
+ },
+ ],
+ },
+ {
+ name: '内框设置',
+ list: [
+ {
+ type: 'el-input-number',
+ label: '宽度',
+ name: 'inBarWidth',
+ required: false,
+ placeholder: '',
+ value: 35,
+ },
+ {
+ type: 'vue-color',
+ label: '空白区颜色',
+ name: 'inBarColor',
+ require: false,
+ placeholder: '',
+ value: 'rgba(56, 128, 138,1)',
+ },
+ {
+ type: 'el-slider',
+ label: '圆角',
+ name: 'inBarRadius',
+ require: false,
+ placeholder: '',
+ value: 50,
+ },
+ ],
+ },
+ {
+ name: '数值设定',
+ list: [
+ {
+ type: 'el-switch',
+ label: '显示',
+ name: 'isShow',
+ required: false,
+ placeholder: '',
+ value: true,
+ },
+ {
+ type: 'el-input-number',
+ label: '字体字号',
+ name: 'fontSize',
+ required: false,
+ placeholder: '',
+ value: 16,
+ },
+ {
+ type: 'el-select',
+ label: '字体粗细',
+ name: 'fontWeight',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'bold', name: '粗体' },
+ { code: 'bolder', name: '特粗体' },
+ { code: 'lighter', name: '细体' }
+ ],
+ value: 'normal'
+ },
+ ],
+ },
+ {
+ name: '渐变色',
+ list: [
+ {
+ type: 'vue-color',
+ label: '0%',
+ name: 'bar0Color',
+ required: false,
+ placeholder: '',
+ value: '#00FEFF'
+ },
+ {
+ type: 'vue-color',
+ label: '30%',
+ name: 'bar30Color',
+ required: false,
+ placeholder: '',
+ value: '#93FE94'
+ },
+ {
+ type: 'vue-color',
+ label: '70%',
+ name: 'bar70Color',
+ required: false,
+ placeholder: '',
+ value: '#E4D225'
+ },
+ {
+ type: 'vue-color',
+ label: '100%',
+ name: 'bar100Color',
+ required: false,
+ placeholder: '',
+ value: '#E01F28'
+ },
+ ],
+ },
+ {
+ name: '提示语设置',
+ list: [
+ {
+ type: 'el-input-number',
+ label: '字体字号',
+ name: 'tipFontSize',
+ required: false,
+ placeholder: '',
+ value: 16
+ },
+ {
+ type: 'vue-color',
+ label: '字体颜色',
+ name: 'tipsColor',
+ required: false,
+ placeholder: '',
+ value: '#00FEFF'
+ },
+ ],
+ },
+ {
+ name: '坐标轴边距设置',
+ list: [
+ {
+ type: 'el-slider',
+ label: '左边距(像素)',
+ name: 'marginLeft',
+ required: false,
+ placeholder: '',
+ value: 60,
+ }, {
+ type: 'el-slider',
+ label: '顶边距(像素)',
+ name: 'marginTop',
+ required: false,
+ placeholder: '',
+ value: 20,
+ }, {
+ type: 'el-slider',
+ label: '右边距(像素)',
+ name: 'marginRight',
+ required: false,
+ placeholder: '',
+ value: 30,
+ }, {
+ type: 'el-slider',
+ label: '底边距(像素)',
+ name: 'marginBottom',
+ required: false,
+ placeholder: '',
+ value: 10,
+ },
+ ],
+ },
+ ],
+ ],
+ // 数据
+ data: [
+ {
+ type: 'el-radio-group',
+ label: '数据类型',
+ name: 'dataType',
+ require: false,
+ placeholder: '',
+ selectValue: true,
+ selectOptions: [
+ {
+ code: 'staticData',
+ name: '静态数据',
+ },
+ {
+ code: 'dynamicData',
+ name: '动态数据',
+ },
+ ],
+ value: 'staticData',
+ },
+ {
+ type: 'el-input-number',
+ label: '刷新时间(毫秒)',
+ name: 'refreshTime',
+ relactiveDom: 'dataType',
+ relactiveDomValue: 'dynamicData',
+ value: 5000
+ },
+ {
+ type: 'el-button',
+ label: '静态数据',
+ name: 'staticData',
+ required: false,
+ placeholder: '',
+ relactiveDom: 'dataType',
+ relactiveDomValue: 'staticData',
+ value: [{"num": 50 }]
+ },
+ {
+ type: 'dycustComponents',
+ label: '',
+ name: 'dynamicData',
+ required: false,
+ placeholder: '',
+ relactiveDom: 'dataType',
+ chartType: 'widget-scale',
+ relactiveDomValue: 'dynamicData',
+ dictKey: 'TEXT_PROPERTIES',
+ value: '',
+ },
+ ],
+ // 坐标
+ position: [
+ {
+ type: 'el-input-number',
+ label: '左边距',
+ name: 'left',
+ required: false,
+ placeholder: '',
+ value: 0,
+ },
+ {
+ type: 'el-input-number',
+ label: '上边距',
+ name: 'top',
+ required: false,
+ placeholder: '',
+ value: 0,
+ },
+ {
+ type: 'el-input-number',
+ label: '宽度',
+ name: 'width',
+ required: false,
+ placeholder: '该容器在1920px大屏中的宽度',
+ value: 250,
+ },
+ {
+ type: 'el-input-number',
+ label: '高度',
+ name: 'height',
+ required: false,
+ placeholder: '该容器在1080px大屏中的高度',
+ value: 400,
+ },
+ ],
+ }
+}
diff --git a/report-ui/src/views/bigscreenDesigner/designer/tools/main.js b/report-ui/src/views/bigscreenDesigner/designer/tools/main.js
index 73d5f75f..288a466f 100644
--- a/report-ui/src/views/bigscreenDesigner/designer/tools/main.js
+++ b/report-ui/src/views/bigscreenDesigner/designer/tools/main.js
@@ -41,6 +41,7 @@ import { widgetBarLineStack } from "./configure/barlineCharts/widget-bar-line-st
import { widgetSelect } from "./configure/form/widget-select";
import { widgetInput } from "./configure/form/widget-input";
import { widgetFormTime } from "./configure/form/widget-form-time";
+import {widgetScale} from "./configure/scaleCharts/widget-scale";
export const widgetTool = [
// type=html类型的组件
@@ -71,10 +72,11 @@ export const widgetTool = [
widgetLineCompare,
widgetDecoratePie,
widgetMoreBarLine,
- // widgetWordCloud,
+ widgetWordCloud,
widgetHeatmap,
widgetRadar,
widgetBarLineStack,
+ widgetScale,
widgetSelect,
widgetInput,
widgetFormTime
diff --git a/report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetFormTime.vue b/report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetFormTime.vue
index 3a3cb933..421ac9db 100644
--- a/report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetFormTime.vue
+++ b/report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetFormTime.vue
@@ -31,7 +31,6 @@ export default {
},
computed: {
styleObj() {
- console.log(this.optionsSetup);
return {
position: this.ispreview ? "absolute" : "static",
width: this.optionsStyle.width + "px",
@@ -121,4 +120,4 @@ export default {
}
}
}
-
\ No newline at end of file
+
diff --git a/report-ui/src/views/bigscreenDesigner/designer/widget/scale/widgetScale.vue b/report-ui/src/views/bigscreenDesigner/designer/widget/scale/widgetScale.vue
new file mode 100644
index 00000000..b32b6d9d
--- /dev/null
+++ b/report-ui/src/views/bigscreenDesigner/designer/widget/scale/widgetScale.vue
@@ -0,0 +1,524 @@
+
+
+
+
+
+
+
+
+
diff --git a/report-ui/src/views/bigscreenDesigner/designer/widget/temp.vue b/report-ui/src/views/bigscreenDesigner/designer/widget/temp.vue
index ce65716b..64ab0ddc 100644
--- a/report-ui/src/views/bigscreenDesigner/designer/widget/temp.vue
+++ b/report-ui/src/views/bigscreenDesigner/designer/widget/temp.vue
@@ -43,6 +43,7 @@ import widgetBarLineStackChart from "./barline/widgetBarLineStackChart";
import widgetSelect from "./form/widgetSelect";
import widgetInput from "./form/widgetInput.vue";
import widgetFormTime from "./form/widgetFormTime.vue";
+import widgetScale from "./scale/widgetScale.vue";
export default {
name: "WidgetTemp",
@@ -77,6 +78,7 @@ export default {
widgetHeatmap,
widgetRadar,
widgetBarLineStackChart,
+ widgetScale,
widgetSelect,
widgetInput,
widgetFormTime,
diff --git a/report-ui/src/views/bigscreenDesigner/designer/widget/widget.vue b/report-ui/src/views/bigscreenDesigner/designer/widget/widget.vue
index 0d21a369..ce2f4d5f 100644
--- a/report-ui/src/views/bigscreenDesigner/designer/widget/widget.vue
+++ b/report-ui/src/views/bigscreenDesigner/designer/widget/widget.vue
@@ -50,6 +50,7 @@ import widgetBarLineStackChart from "./barline/widgetBarLineStackChart";
import widgetSelect from "./form/widgetSelect";
import widgetInput from "./form/widgetInput.vue";
import widgetFormTime from "./form/widgetFormTime.vue";
+import widgetScale from "./scale/widgetScale.vue";
export default {
name: "Widget",
@@ -84,6 +85,7 @@ export default {
widgetHeatmap,
widgetRadar,
widgetBarLineStackChart,
+ widgetScale,
widgetSelect,
widgetInput,
widgetFormTime,