From db113db393fc1710d5e36fc003fa4d16aa47c519 Mon Sep 17 00:00:00 2001 From: qianbao Date: Tue, 2 Sep 2025 01:59:25 +0800 Subject: [PATCH] 122121 --- config/dev.env.js | 2 +- src/mixins/queryform.js | 71 +++++++---------------------------------------------------------------- src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue | 58 ++-------------------------------------------------------- src/views/bigscreenDesigner/designer/widget/barline/widgetBarLineStackChart.vue | 87 +-------------------------------------------------------------------------------------- src/views/bigscreenDesigner/designer/widget/div/widgetHtmlSlider.vue | 460 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------------------------------- src/views/bigscreenDesigner/designer/widget/table/widgetTable.vue | 23 +++++++++-------------- 6 files changed, 439 insertions(+), 262 deletions(-) diff --git a/config/dev.env.js b/config/dev.env.js index 6aab87a..e7039f8 100644 --- a/config/dev.env.js +++ b/config/dev.env.js @@ -5,7 +5,7 @@ const prodEnv = require('./prod.env') const isDev = false; //开发API地址 // const devAdrress='"http://weberp.xlyprint.cn/xlyReport"'; -const devAdrress='"http://172.16.114.9:8085/xlyReport"'; +const devAdrress='"http://weberp.xlyprint.cn:8888/xlyReport"'; //正式打包API地址 const ipAdrress='"http://"+location.host+"/xlyReport"'; diff --git a/src/mixins/queryform.js b/src/mixins/queryform.js index b2e1317..93403dd 100644 --- a/src/mixins/queryform.js +++ b/src/mixins/queryform.js @@ -122,8 +122,8 @@ export default { return this.barOrLineChartFn(params.chartProperties, data); }else if (chartType == "widget-barlinechart" ) { return this.barLineChartFn(params.chartProperties, data); - } else if ( chartType == "widget-barchart") { - return this.barOrLineChartFn(params.chartProperties, data); + // } else if ( chartType == "widget-barchart") { + // return this.barOrLineChartFn(params.chartProperties, data); } else if ( chartType == "widget-piechart" || chartType == "widget-funnel" @@ -132,7 +132,8 @@ export default { } else if (chartType == "widget-text") { return this.widgettext(params.chartProperties, data) } else if (chartType == "widget-stackchart") { - return this.stackChartFn(params.chartProperties, data) + return this.stackChartFn(params.chartProperties, data); + // return this.stackChartFn(params.chartProperties, data) } else if (chartType == "widget-coord") { return this.coordChartFn(params.chartProperties, data) } else if (chartType == "widget-linemap") { @@ -236,70 +237,12 @@ export default { } ananysicData["xAxis"] = xAxisList; ananysicData["series"] = series; - // console.log("11111",ananysicData); + return ananysicData; }, //堆叠图 - stackChartFn(chartProperties, val) { - const ananysicData = {}; - // const series = []; - // //全部字段字典值 - // const types = Object.values(chartProperties) - // //x轴字段、y轴字段名 - // const xAxisField = Object.keys(chartProperties)[types.indexOf('xAxis')] - // const yAxisField = Object.keys(chartProperties)[types.indexOf('yAxis')] - // const dataField = Object.keys(chartProperties)[types.indexOf('bar')] - // //x轴数值去重，y轴去重 - // const xAxisList = this.setUnique(data.map(item => item[xAxisField])) - // const yAxisList = this.setUnique(data.map(item => item[yAxisField])) - // const dataFieldList = this.setUnique(data.map(item => item[dataField])) - // const dataGroup = this.setGroupByNew(data, xAxisList,'axis'); - // console.log("1111",types,dataGroup); - // for (const key in chartProperties) { - // if (chartProperties[key] !== 'yAxis' && !chartProperties[key].startsWith('xAxis')) { - // Object.keys(dataGroup).forEach(item => { - // const data = new Array(xAxisList.length).fill(0) - // dataGroup[item].forEach(res => { - // data[xAxisList.indexOf(res[xAxisField])] = res[key] - // }) - // series.push({ - // name: yAxisList[item], - // type: chartProperties[key], - // data: data, - // }) - // }) - // } - // } - const series = []; - let xAxisList = []; - let yAxisList = []; - for (const i in val) { - xAxisList[i] = val[i].axis; - yAxisList[i] = val[i].name; - } - xAxisList = this.setUnique(xAxisList); - yAxisList = this.setUnique(yAxisList); - for (const i in yAxisList) { - const data = new Array(xAxisList.length).fill(0); - for (const j in xAxisList) { - for (const k in val) { - if (val[k].name == yAxisList[i]) { - if (val[k].axis == xAxisList[j]) { - data[j] = val[k].data; - } - } - } - } - series.push({ - name: yAxisList[i], - type: 'bar', - data: data, - }); - } - - ananysicData["xAxis"] = xAxisList; - ananysicData["series"] = series; - return ananysicData; + stackChartFn(chartProperties, data) { + return data; }, // 饼图、漏斗图 piechartFn(chartProperties, data) { diff --git a/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue b/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue index ba3bcfe..8181e10 100644 --- a/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue +++ b/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue @@ -288,7 +288,7 @@ export default { }, //静态数据 staticDataFn(val) { - console.log("staticDataFn",val); + // console.log("staticDataFn",val); const optionsSetup = this.optionsSetup; //颜色 const customColor = optionsSetup.customColor; @@ -388,63 +388,9 @@ export default { getEchartData(val, optionsSetup) { const data = this.queryEchartsData(val); data.then(res => { - this.renderingFn(optionsSetup, res); + this.staticDataFn(res) }); }, - renderingFn(optionsSetup, val) { - //颜色 - const customColor = optionsSetup.customColor; - const arrColor = []; - for (let i = 0; i < customColor.length; i++) { - arrColor.push(customColor[i].color); - } - // x轴 - if (optionsSetup.verticalShow) { - this.options.xAxis.data = []; - this.options.yAxis.data = val.xAxis; - this.options.xAxis.type = "value"; - this.options.yAxis.type = "category"; - } else { - this.options.xAxis.data = val.xAxis; - this.options.yAxis.data = []; - this.options.xAxis.type = "category"; - this.options.yAxis.type = "value"; - } - const series = []; - let legendName = []; - legendName = this.setUnique(legendName); - for (const i in val.series) { - if (val.series[i].type == "bar") { - series.push({ - name: val.series[i].name, - type: "bar", - data: val.series[i].data, - barGap: "0%", - stack: this.getStackStyle(), - barWidth: optionsSetup.maxWidth, - label: { - show: optionsSetup.isShow, - position: "top", - distance: 10, - fontSize: optionsSetup.fontSize, - color: optionsSetup.subTextColor, - fontWeight: optionsSetup.fontWeight, - }, - //颜色，圆角属性 - itemStyle: { - normal: { - color: arrColor[i], - barBorderRadius: optionsSetup.radius, - } - } - }) - } - legendName.push(val.series[i].name); - } - this.options.series = series; - this.options.legend['data'] = legendName; - this.setOptionsLegendName(legendName); - } } }; diff --git a/src/views/bigscreenDesigner/designer/widget/barline/widgetBarLineStackChart.vue b/src/views/bigscreenDesigner/designer/widget/barline/widgetBarLineStackChart.vue index 66ca643..3a0edbb 100644 --- a/src/views/bigscreenDesigner/designer/widget/barline/widgetBarLineStackChart.vue +++ b/src/views/bigscreenDesigner/designer/widget/barline/widgetBarLineStackChart.vue @@ -487,92 +487,7 @@ export default { }); }, renderingFn(optionsSetup, val) { - //颜色 - const customColor = optionsSetup.customColor; - const arrColor = []; - if(customColor){ - for (let i = 0; i < customColor.length; i++) { - arrColor.push(customColor[i].color); - } - } - this.options.xAxis.data = val.xAxis; - this.options.yAxis.data = []; - this.options.xAxis.type = "category"; - this.options.yAxis.type = "value"; - const series = []; - let legendName = []; - for (const i in val.series) { - legendName.push(val.series[i].name); - } - legendName = this.setUnique(legendName); - for (let i = 0; i < legendName.length; i++) { - const bar = this.getDynamicSeriesData(legendName[i], val.series, "bar"); - series.push({ - name: legendName[i], - type: 'bar', - data: bar, - barGap: '0%', - barWidth: optionsSetup.maxWidth, - label: { - show: optionsSetup.isShowBar, - position: 'top', - distance: optionsSetup.distanceBar, - fontSize: optionsSetup.fontSizeBar, - color: optionsSetup.subTextColorBar, - fontWeight: optionsSetup.fontWeightBar, - }, - //颜色，圆角属性 - itemStyle: { - normal: { - color: arrColor[i], - barBorderRadius: optionsSetup.radius, - } - } - }) - } - for (let i = 0; i < legendName.length; i++) { - const line = this.getDynamicSeriesData(legendName[i], val.series, "line"); - series.push({ - name: legendName[i], - type: "line", - data: line, - yAxisIndex: 1, - symbol: optionsSetup.symbol, - showSymbol: optionsSetup.markPoint, - symbolSize: optionsSetup.pointSize, - smooth: optionsSetup.smoothCurve, - itemStyle: { - normal: { - color: arrColor[i], - } - }, - // 线条 - lineStyle: { - color: arrColor[i], - width: optionsSetup.lineWidth, - }, - label: { - show: optionsSetup.isShowLine, - position: 'top', - distance: optionsSetup.distanceLine, - fontSize: optionsSetup.fontSizeLine, - color: optionsSetup.subTextColorLine, - fontWeight: optionsSetup.fontWeightLine, - }, - }) - } - this.options.series = series; - this.options.legend['data'] = legendName; - this.setOptionsLegendName(legendName); - }, - getDynamicSeriesData(legend, series, type) { - let data = []; - for (const i in series) { - if (series[i].name == legend && series[i].type == type) { - data = series[i].data; - } - } - return data + this.staticDataFn(val); }, } }; diff --git a/src/views/bigscreenDesigner/designer/widget/div/widgetHtmlSlider.vue b/src/views/bigscreenDesigner/designer/widget/div/widgetHtmlSlider.vue index 5a339ff..254840b 100644 --- a/src/views/bigscreenDesigner/designer/widget/div/widgetHtmlSlider.vue +++ b/src/views/bigscreenDesigner/designer/widget/div/widgetHtmlSlider.vue @@ -1,18 +1,89 @@ + +
+ +

报表加载中...

+
+ +
+ +

报表加载失败

+
+ + + + +
+
+
+
+ + + +/* 加载动画 */ +.spinner { + width: 40px; + height: 40px; + border: 4px solid rgba(255, 255, 255, 0.3); + border-radius: 50%; + border-top-color: #fff; + animation: spin 1s ease-in-out infinite; +} + +@keyframes spin { + to { transform: rotate(360deg); } +} + +/* 圆圈页码指示器 */ +.circle-indicator { + position: fixed; + bottom: 20px; + left: 50%; + transform: translateX(-50%); + display: flex; + gap: 10px; + z-index: 100; +} + +.circle { + width: 12px; + height: 12px; + border-radius: 50%; + background: rgba(255, 255, 255, 0.4); + transition: all 0.3s ease; + cursor: pointer; +} + +.circle.active { + background: #fff; + transform: scale(1.2); + box-shadow: 0 0 5px rgba(255, 255, 255, 0.8); +} + +.circle:hover { + background: rgba(255, 255, 255, 0.7); +} + +/* 控制按钮 */ +.controls { + position: fixed; + top: 50%; + transform: translateY(-50%); + width: 100%; + display: flex; + justify-content: space-between; + padding: 0 20px; + z-index: 100; + opacity: 0; + transition: opacity 0.3s ease; +} + +.fullscreen-carousel:hover .controls { + opacity: 0.7; +} + +.controls:hover { + opacity: 1; +} +//el-icon-arrow-left +.control-btn { + background: rgba(0, 0, 0, 0.5); + color: white; + border: none; + width: 50px; + height: 50px; + border-radius: 50%; + display: flex; + justify-content: center; + align-items: center; + cursor: pointer; + font-size: 1.5rem; + transition: all 0.3s ease; +} + +.control-btn:hover { + background: rgba(0, 0, 0, 0.8); + transform: scale(1.1); +} + +/* 进度指示器 */ +.progress-indicator { + position: fixed; + top: 0; + left: 0; + height: 3px; + background: linear-gradient(90deg, #4ca1af, #2c3e50); + z-index: 101; + transition: width 0.3s ease; +} + diff --git a/src/views/bigscreenDesigner/designer/widget/table/widgetTable.vue b/src/views/bigscreenDesigner/designer/widget/table/widgetTable.vue index 08e9b2a..8ad25fc 100644 --- a/src/views/bigscreenDesigner/designer/widget/table/widgetTable.vue +++ b/src/views/bigscreenDesigner/designer/widget/table/widgetTable.vue @@ -18,9 +18,8 @@
  • -
    -- libgit2 0.22.2