feat:大屏echarts组件开发

main
liu.tao3 2 years ago
parent 9ed35ed36b
commit dfdb1313e7

@ -3397,27 +3397,6 @@
"whatwg-fetch": "^3.6.2" "whatwg-fetch": "^3.6.2"
}, },
"dependencies": { "dependencies": {
"@vue/vue-loader-v15": {
"version": "npm:vue-loader@15.10.2",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.2.tgz",
"integrity": "sha512-ndeSe/8KQc/nlA7TJ+OBhv2qalmj1s+uBs7yHDRFaAXscFTApBzY9F1jES3bautmgWjDlDct0fw8rPuySDLwxw==",
"dev": true,
"requires": {
"@vue/component-compiler-utils": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0"
},
"dependencies": {
"hash-sum": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
"integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
"dev": true
}
}
},
"acorn-walk": { "acorn-walk": {
"version": "8.2.0", "version": "8.2.0",
"resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.2.0.tgz", "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.2.0.tgz",
@ -3489,26 +3468,6 @@
"tapable": "^2.0.0" "tapable": "^2.0.0"
} }
}, },
"json5": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
"integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
"dev": true,
"requires": {
"minimist": "^1.2.0"
}
},
"loader-utils": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
"integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^1.0.1"
}
},
"ms": { "ms": {
"version": "2.1.2", "version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
@ -3726,6 +3685,47 @@
"lodash": "^4.17.4" "lodash": "^4.17.4"
} }
}, },
"@vue/vue-loader-v15": {
"version": "npm:vue-loader@15.10.2",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.2.tgz",
"integrity": "sha512-ndeSe/8KQc/nlA7TJ+OBhv2qalmj1s+uBs7yHDRFaAXscFTApBzY9F1jES3bautmgWjDlDct0fw8rPuySDLwxw==",
"dev": true,
"requires": {
"@vue/component-compiler-utils": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0"
},
"dependencies": {
"hash-sum": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
"integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
"dev": true
},
"json5": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
"integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
"dev": true,
"requires": {
"minimist": "^1.2.0"
}
},
"loader-utils": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
"integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^1.0.1"
}
}
}
},
"@vue/vue2-jest": { "@vue/vue2-jest": {
"version": "27.0.0", "version": "27.0.0",
"resolved": "https://registry.npmjs.org/@vue/vue2-jest/-/vue2-jest-27.0.0.tgz", "resolved": "https://registry.npmjs.org/@vue/vue2-jest/-/vue2-jest-27.0.0.tgz",
@ -7545,6 +7545,11 @@
"minimatch": "^3.0.4" "minimatch": "^3.0.4"
} }
}, },
"downloadjs": {
"version": "1.4.7",
"resolved": "https://registry.npmjs.org/downloadjs/-/downloadjs-1.4.7.tgz",
"integrity": "sha512-LN1gO7+u9xjU5oEScGFKvXhYf7Y/empUIIEAGBs1LzUq/rg5duiDrkuH5A2lQGd5jfMOb9X9usDa2oVXwJ0U/Q=="
},
"duplexer": { "duplexer": {
"version": "0.1.2", "version": "0.1.2",
"resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz",
@ -19918,6 +19923,14 @@
"vue": "^2.2.6" "vue": "^2.2.6"
} }
}, },
"vue-json-excel": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/vue-json-excel/-/vue-json-excel-0.3.0.tgz",
"integrity": "sha512-FrSh0tVUpw4K+ilLO8g0Qp52eFJw/hkk3rZPTEKo9qVkJgVfQtZwzj3UWc5ACYxA3jLk9HtjK+f9xKHCN4Kgag==",
"requires": {
"downloadjs": "^1.4.7"
}
},
"vue-json-viewer": { "vue-json-viewer": {
"version": "2.2.22", "version": "2.2.22",
"resolved": "https://registry.npmjs.org/vue-json-viewer/-/vue-json-viewer-2.2.22.tgz", "resolved": "https://registry.npmjs.org/vue-json-viewer/-/vue-json-viewer-2.2.22.tgz",

@ -120,6 +120,15 @@ const setting = [
value: '', value: '',
tabName: 'data' tabName: 'data'
}, },
{
label: '柱形颜色',
type: 'colorPicker',
field: 'color',
optionField: 'color',
value: '#007aff',
tabName: 'custom',
groupName: 'graph'
},
{ {
label: 'x轴类型', label: 'x轴类型',
type: 'input', type: 'input',
@ -129,6 +138,33 @@ const setting = [
tabName: 'custom', tabName: 'custom',
groupName: 'xAxis' groupName: 'xAxis'
}, },
{
label: '是否显示标签',
type: 'switch',
field: 'xAxis_axisLabel_show',
optionField: 'xAxis.axisLabel.show',
value: true,
tabName: 'custom',
groupName: 'xAxis'
},
{
label: '标签旋转角度',
type: 'inputNumber',
field: 'xAxis_axisLabel_rotate',
optionField: 'xAxis.axisLabel.rotate',
value: 0,
tabName: 'custom',
groupName: 'xAxis'
},
{
label: '标签颜色',
type: 'colorPicker',
field: 'xAxis_axisLabel_color',
optionField: 'xAxis.axisLabel.color',
value: '#fff',
tabName: 'custom',
groupName: 'xAxis'
},
{ {
label: 'y轴类型', label: 'y轴类型',
type: 'input', type: 'input',
@ -158,14 +194,19 @@ const option = {
// 数据将要放入到哪个字段中 // 数据将要放入到哪个字段中
dataKey: 'data', dataKey: 'data',
data, data,
color: '', //柱状图颜色
color: '#007aff',
appendPadding: [16, 16, 16, 16], // 设置图标的边距 appendPadding: [16, 16, 16, 16], // 设置图标的边距
xField: 'Date', xField: 'Date',
yField: 'scales', yField: 'scales',
smooth: true,
xAxis: { xAxis: {
type:'category', type:'category',
data: [] data: [],
axisLabel:{
show:true,
color:'#fff',
rotate:0
}
}, },
yAxis: { yAxis: {
type: 'value' type: 'value'
@ -173,7 +214,10 @@ const option = {
series:[ series:[
{ {
data: [], data: [],
type:'line' type: 'bar',
backgroundStyle: {
color: '#fff'
}
} }
] ]
} }

@ -145,7 +145,7 @@ export default {
}, },
data () { data () {
return { return {
bizType:'', bizType:'native',
resolutionRatioValue: '', resolutionRatioValue: '',
resolutionRatio: {}, resolutionRatio: {},
BizList:[ BizList:[
@ -252,6 +252,7 @@ export default {
closeAddDialog () { closeAddDialog () {
this.formVisible = false this.formVisible = false
this.$refs.dataForm.resetFields() this.$refs.dataForm.resetFields()
this.bizType='native'
}, },
// //
init (nodeData, parentCode) { init (nodeData, parentCode) {

Loading…
Cancel
Save