diff --git a/components/AiDvRender.vue b/components/AiDvRender.vue index 524b6df7..a5eb5bd7 100644 --- a/components/AiDvRender.vue +++ b/components/AiDvRender.vue @@ -1,24 +1,24 @@ - + - - + - - - - + - - + v-else-if="currentType === 'video'"/> + + @@ -109,14 +109,7 @@ export default { }, computed: { ...mapState(['user']), - values() { - if (!this.data) { - return [] - } - return this.data.type === 'map' ? this.data[this.data.dataType]?.map(e => { - return {lng: e['经度'], lat: e['纬度'], label: e['地区名称'], ...e} - }) || [] : this.data[this.data.dataType] - }, + values: v => v.data?.[v.data?.dataType] || [], currentType: v => v.data.type }, watch: { @@ -186,7 +179,9 @@ export default { map.setPitch(0) this.mapDialog = false }) - this.values.filter(e => e.lng).map((e) => { + const markers = Array.isArray(this.values) ? this.values : this.values.markers + const polylines = Array.isArray(this.values) ? [] : this.values.polylines || [] + markers.map(e => ({lng: e['经度'], lat: e['纬度'], label: e['地区名称'], ...e})).filter(e => e.lng).map((e) => { const {icon = "https://cdn.cunwuyun.cn/dvcp/h5/Location2.png"} = e return new AMap.Marker({ map, @@ -204,6 +199,9 @@ export default { }) }) }) + polylines.filter(e => e.path?.length > 0)?.map(e => new AMap.Polyline({ + map, strokeColor: "#00FFAE", ...e, path: e.path.map(p => new AMap.LngLat(p[1], p[0])) + })) this.data.is3d > 0 && map.setPitch(65) if (this.data.is3dAround == 1) { this.timer = setInterval(() => map?.setRotation(360, false, 16000)) @@ -215,7 +213,7 @@ export default { } }, mounted() { - if (this.data.type == 'table') { + if (this.currentType == 'table') { this.$injectLib("https://cdn.cunwuyun.cn/datav.map.vue.js") } } diff --git a/components/AiSwiper.vue b/components/AiSwiper.vue index cb7c457d..f9a6a284 100644 --- a/components/AiSwiper.vue +++ b/components/AiSwiper.vue @@ -1,93 +1,107 @@ - - + + - + {{ item.title }} {{ item.content }} + diff --git a/components/layout/AiDvPanel/AiDvPanel.vue b/components/layout/AiDvPanel/AiDvPanel.vue index 70476fc6..62645528 100644 --- a/components/layout/AiDvPanel/AiDvPanel.vue +++ b/components/layout/AiDvPanel/AiDvPanel.vue @@ -25,10 +25,27 @@ import border10 from "./borders/border10"; import border11 from "./borders/border11"; import border12 from "./borders/border12"; import border13 from "./borders/border13"; +import Border14 from "./borders/border14.vue"; export default { name: "AiDvPanel", - components: { Border0, Border1, Border2, Border3, Border4, Border5, border6, border7, border8, border9, border10, border11, border12, border13 }, + components: { + Border14, + Border0, + Border1, + Border2, + Border3, + Border4, + Border5, + border6, + border7, + border8, + border9, + border10, + border11, + border12, + border13 + }, props: { title: {default: "请传入标题"}, border: {default: "border0"}, diff --git a/components/layout/AiDvPanel/asset/border14-icon.svg b/components/layout/AiDvPanel/asset/border14-icon.svg new file mode 100644 index 00000000..9dccd8cd --- /dev/null +++ b/components/layout/AiDvPanel/asset/border14-icon.svg @@ -0,0 +1,25 @@ + + + 形状结合 + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/components/layout/AiDvPanel/asset/border14.svg b/components/layout/AiDvPanel/asset/border14.svg new file mode 100644 index 00000000..1a9d25c6 --- /dev/null +++ b/components/layout/AiDvPanel/asset/border14.svg @@ -0,0 +1,36 @@ + + + 编组 2 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/components/layout/AiDvPanel/borders/border14.vue b/components/layout/AiDvPanel/borders/border14.vue new file mode 100644 index 00000000..6d86646f --- /dev/null +++ b/components/layout/AiDvPanel/borders/border14.vue @@ -0,0 +1,64 @@ + + + + + {{ title }} + + + + + + + + + + diff --git a/packages/bigscreen/designer/components/Layout.vue b/packages/bigscreen/designer/components/Layout.vue index e686d7e5..111a9b7d 100644 --- a/packages/bigscreen/designer/components/Layout.vue +++ b/packages/bigscreen/designer/components/Layout.vue @@ -109,13 +109,7 @@ - - + @@ -214,7 +208,8 @@ - + -1 ? this.componentList[this.activeIndex] : {} + } }, - widget() { if (this.components.length && this.components[this.parentIndex].list.length) { return this.components[this.parentIndex].list[this.subIndex].list @@ -410,13 +407,9 @@ export default { clone(e) { this.componentList.push(this.deepClone(e)) }, - - onChange(e) { - if (e.indexOf('Chart') > -1) { - this.$refs[`chart${this.activeIndex}`]?.[0]?.refresh() - } + onChange() { + this.$refs[`chart${this.activeIndex}`]?.[0]?.refresh() }, - deepClone(obj) { if (obj instanceof Object) { let newObj = {} @@ -993,8 +986,8 @@ export default { } :deep(.layout-right__content ) { - height: calc(100% - 40px); - overflow-y: overlay; + height: calc(100% - 50px); + overflow-y: auto; overflow-x: hidden; .layout-config__group { diff --git a/packages/bigscreen/designer/components/form/DataConfig.vue b/packages/bigscreen/designer/components/form/DataConfig.vue index 37cd6eb8..58661227 100644 --- a/packages/bigscreen/designer/components/form/DataConfig.vue +++ b/packages/bigscreen/designer/components/form/DataConfig.vue @@ -1,19 +1,32 @@ - - - 标记点设置 - 添加 - - - - - - + + + + 标记点设置 + 添加 - - - + + + + + + + + + + + + + 点击查看连线设置参考文档 + + + + + + 基础设置 数据类型 @@ -29,8 +42,10 @@ - - + + @@ -38,10 +53,10 @@ + v-for="item in sourceData" + :key="item.id" + :label="item.description" + :value="item.id"> @@ -65,7 +80,8 @@ - + 字段设置 监控视频 @@ -81,7 +97,8 @@ - + 字段设置 X轴设置 @@ -99,7 +116,8 @@ Y轴设置 - - + @@ -149,17 +168,19 @@ import 'brace/mode/json' import 'brace/snippets/json'; import 'brace/theme/github'; import 'brace/theme/monokai'; +import AiDialogBtn from "dui/packages/layout/AiDialogBtn.vue"; export default { name: 'dataConfig', - + model: { + prop: "options", + event: "change" + }, props: { options: Object, instance: Function, dict: Object, - params: Object, }, - data() { return { dataTypes: [ @@ -177,25 +198,32 @@ export default { } ], isShowEditor: false, - json: {}, + json: "", sourceDataId: '', sourceData: [], keys: [], monitorList: [], list: [], - jsonData: `{"title":"测试json数据","children":[{"name":"子项名称", "desc":"子项说明" },{"name":"子项名称1", "desc":"子项说明1" }]}`, showMapEditor: false, form: {} } }, - - components: { - CodeEditor + computed: { + markers: v => v.options.staticData?.markers || [] + }, + components: { + AiDialogBtn, + CodeEditor, + }, + created() { + if (this.options.type == "map" && Array.isArray(this.options.staticData)) {//处理历史数据,并更新最新数据结构 + const values = this.$copy(this.options) + values.staticData = {markers: this.$copy(this.options.staticData)} + this.$emit("change", values) + } }, - mounted() { this.getDataList() - if ((this.options.dataY && this.options.dataY.length && this.options.dataX) || this.options.type === 'monitor') { const api = this.options.dataType === 'apiData' ? this.options.api : `/app/appdiylargescreen/statisticsByLsid?id=${this.options.sourceDataId}` this.instance.post(api).then(res => { @@ -364,10 +392,19 @@ export default { const i = this.$copy(this.form.index) delete this.form.index if (i > -1) { - this.options.staticData.splice(i, 1, this.form) - } else this.options.staticData.push(this.form) + this.options.staticData.markers.splice(i, 1, this.form) + } else this.options.staticData.markers.push(this.form) this.showMapEditor = false }) + }, + savePolylines() { + this.$set(this.options.staticData, 'polylines', JSON.parse(this.json)) + }, + handleMapPolylines() { + this.json = JSON.stringify(this.options.staticData.polylines || [{path: [[31.547706, 107.224325], [31.552456, 107.201185]]}]) + }, + handleMapPolylineDoc() { + window.open('https://lbs.amap.com/api/javascript-api-v2/documentation#polyline') } } } @@ -384,11 +421,15 @@ export default { } } +.ai-dialog__wrapper { + color: #333; +} + .layout-config__group--wrapper { .layout-config__code .bin-ace-editor { } - .layout-config__group { + :deep(.layout-config__group) { padding: 10px 10px 20px; border-bottom: 1px solid #000000; @@ -491,6 +532,10 @@ export default { color: #fff; } } + + :deep(.el-collapse) { + height: 18px; + } } } diff --git a/packages/bigscreen/designer/config.js b/packages/bigscreen/designer/config.js index 193b5349..6148f90c 100644 --- a/packages/bigscreen/designer/config.js +++ b/packages/bigscreen/designer/config.js @@ -552,9 +552,9 @@ const components = [ dataType: 'staticData', dynamicData: [], staticData: [ - { name: '列1', value: 23 }, - { name: '列2', value: 12 }, - { name: '列2', value: 12 } + {name: '列1', value: 23}, + {name: '列2', value: 12}, + {name: '列2', value: 12} ] } ] @@ -610,7 +610,7 @@ const components = [ thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/map.png', is3dAround: '0', limitArea: '0', - layers:'vector' + layers: 'vector' }, { type: 'AiDvMap', @@ -743,6 +743,29 @@ const components = [ } ], thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png' + }, + { + type: 'swiper', + label: '轮播图(点指示器)', + width: 800, + height: 358, + zIndex: 1, + border: 'border14', + dataType: 'staticData', + staticData: [ + { + content: `歙县众城湖羊养殖专业合作社 + 徐晓红 - 18273645627 + 歙县郑村镇唐跃村碉墅` + }, + { + content: `歙县众城湖羊养殖专业合作社 + 徐晓红 - 18273645627 + 歙县郑村镇唐跃村碉墅` + }, + ], + thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png', + dotIndicator: true } ] }, diff --git a/ui/lib/js/utils.js b/ui/lib/js/utils.js index 9362e779..e384b9ef 100644 --- a/ui/lib/js/utils.js +++ b/ui/lib/js/utils.js @@ -220,5 +220,17 @@ export default { $load, $reg, Area, - ID + ID, + $arrDepth: (arr) => { + if (Array.isArray(arr)) { + let max = 1 + for (let i = 0; i < arr.length; i++) { + const depth = this.$arrDepth(arr[i]) + if (depth > max) { + max = depth + } + } + return max + } else return 0 + } } diff --git a/ui/lib/styles/common.scss b/ui/lib/styles/common.scss index 701c4795..61afc2b0 100644 --- a/ui/lib/styles/common.scss +++ b/ui/lib/styles/common.scss @@ -295,7 +295,7 @@ input::-ms-input-placeholder { /** 自定义弹性盒子快速用 */ -div[flex] { +div[flex], .flex { display: flex; align-items: center; @@ -717,3 +717,8 @@ h1, h2, h3, p { pointer-events: all; } } + +.m-center { + margin-left: 50%; + transform: translateX(-50%); +} diff --git a/ui/packages/layout/AiFold.vue b/ui/packages/layout/AiFold.vue new file mode 100644 index 00000000..1e55f1ec --- /dev/null +++ b/ui/packages/layout/AiFold.vue @@ -0,0 +1,66 @@ + + + + + + + + + + + + + + + +
{{ item.content }}