Merge branch 'build' of http://git.sinoecare.com/sinoecare/digital_village_v2/dvcp_v2_webapp into build
This commit is contained in:
		| @@ -1,40 +1,123 @@ | ||||
| <script> | ||||
| import AiDrag from "./AiDrag.vue"; | ||||
| import {Loading} from "element-ui"; | ||||
| import AiDvSvg from "./layout/AiDvSvg/AiDvSvg.vue"; | ||||
| import AiEchart from "dui/packages/tools/AiEchart.vue"; | ||||
|  | ||||
| export default { | ||||
|   name: "AiAssist", | ||||
|   components: {AiDrag}, | ||||
|   components: {AiEchart, AiDvSvg, AiDrag}, | ||||
|   data() { | ||||
|     return { | ||||
|       dialog: false, | ||||
|       prompt: "", | ||||
|       content: "", | ||||
|       assistPos: {} | ||||
|       assistPos: {}, | ||||
|       reply: { | ||||
|         table: [ | ||||
|           {address: "张家堡街道", count: 132, handle: 132}, | ||||
|           {address: "徐家湾街道", count: 125, handle: 225}, | ||||
|           {address: "未央湖街道", count: 157, handle: 572}, | ||||
|           {address: "辛家庙街道", count: 142, handle: 422}, | ||||
|           {address: "六村堡街道", count: 233, handle: 453}, | ||||
|         ], | ||||
|         chart: { | ||||
|           ops: { | ||||
|             tooltip: { | ||||
|               trigger: 'axis', | ||||
|               axisPointer: { | ||||
|                 type: 'shadow' | ||||
|               } | ||||
|             }, | ||||
|             color: '#00EFFF', | ||||
|             yAxis: { | ||||
|               type: 'category', | ||||
|               axisLine: { | ||||
|                 show: true, | ||||
|                 lineStyle: { | ||||
|                   color: 'rgba(179, 223, 255, 0.5)', | ||||
|                   width: 1 | ||||
|                 } | ||||
|               }, | ||||
|               axisLabel: { | ||||
|                 color: '#8FABBF', | ||||
|               }, | ||||
|               axisTick: { | ||||
|                 alignWithLabel: true, | ||||
|                 show: false | ||||
|               }, | ||||
|               data: ['贷款', '诈骗', '失火', '消防', '醉酒'] | ||||
|             }, | ||||
|             xAxis: { | ||||
|               type: 'value', | ||||
|               axisLabel: { | ||||
|                 color: '#8FABBF', | ||||
|                 interval: 0 | ||||
|               }, | ||||
|               splitLine: { | ||||
|                 show: true, | ||||
|                 lineStyle: { | ||||
|                   color: 'rgba(61, 82, 102, 0.65)', | ||||
|                   width: 1, | ||||
|                   type: 'dashed' | ||||
|                 } | ||||
|               } | ||||
|             }, | ||||
|             grid: { | ||||
|               left: '4%', | ||||
|               right: '1%', | ||||
|               bottom:0, | ||||
|               top: 0, | ||||
|               containLabel: true | ||||
|             }, | ||||
|             series: [ | ||||
|               { | ||||
|                 data: [919, 1210, 9794, 3559, 743], | ||||
|                 type: 'bar', | ||||
|                 barWidth: '25%', | ||||
|                 itemStyle: { | ||||
|                   color: { | ||||
|                     type: 'linear', x: 1, y: 0, x2: 0, y2: 0, colorStops: [ | ||||
|                       {offset: 0, color: '#02FEFF'}, | ||||
|                       {offset: 1, color: '#00527d1c'} | ||||
|                     ] | ||||
|                   } | ||||
|                 }, | ||||
|                 backgroundStyle: { | ||||
|                   color: '#00527d1c' | ||||
|                 } | ||||
|               } | ||||
|             ] | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     isAiResult: v => v.content == "您好!一下是这个月敏感词触发情况概览:" | ||||
|   }, | ||||
|   methods: { | ||||
|     confirm() { | ||||
|       const loading = Loading.service({fullscreen: true, text: "助手回复中..."}); | ||||
|       if (this.prompt.includes("")) { | ||||
|       const loading = Loading.service({fullscreen: true, text: "助手回复中...", background: "rgba(0, 0, 0, 0.2)"}); | ||||
|       if (/(网格建设|居民报事|居民档案|两委干部|敏感词)/.test(this.prompt)) { | ||||
|         setTimeout(() => { | ||||
|           loading.close() | ||||
|           this.dialog = false | ||||
|           if (/(网格建设|居民报事|居民档案|两委干部|敏感词)/.test(this.prompt)) { | ||||
|  | ||||
|           } | ||||
|         },) | ||||
|           this.content = "您好!一下是这个月敏感词触发情况概览:" | ||||
|         }, 3000) | ||||
|       } else { | ||||
|         this.content = "抱歉,我还没有学习到关于这个话题的内容,无法提供相关信息。您可以选择其他问题,我将努力为您解答。" | ||||
|         loading.close() | ||||
|         this.dialog = false | ||||
|         // this.dialog = false | ||||
|       } | ||||
|       this.prompt = "" | ||||
|     } | ||||
|     }, | ||||
|   }, | ||||
|   watch: { | ||||
|     dialog(v) { | ||||
|       document.body.onclick = v ? () => this.dialog = false : null | ||||
|       if (!v) { | ||||
|         this.content = "" | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
| @@ -51,8 +134,8 @@ export default { | ||||
|       <div class="avatar-text" v-text="'全局AI助手'"/> | ||||
|     </div> | ||||
|     <ai-drag class="assistDialog" v-if="dialog" :resizable="false"> | ||||
|       <div class="inbox" :style="assistPos" v-if="!content"> | ||||
|         <dv-border-box-1 background-color="#001C30"> | ||||
|       <div class="inbox" :style="assistPos"> | ||||
|         <dv-border-box-1 v-if="!content" background-color="#001C30"> | ||||
|           <div class="title mar-b32 mar-t16">慧智会言</div> | ||||
|           <el-input v-model="prompt" placeholder="您说,我在听~" clearable size="small"> | ||||
|             <template #append><i class="el-icon-microphone">语音输入</i></template> | ||||
| @@ -62,9 +145,28 @@ export default { | ||||
|             <div class="btn" @click="confirm">确定</div> | ||||
|           </div> | ||||
|         </dv-border-box-1> | ||||
|         <div class="reply"> | ||||
|           <div v-html="content"/> | ||||
|         </div> | ||||
|         <ai-dv-svg v-else class="reply" @close="dialog=false"> | ||||
|           <div class="w100" v-html="content"/> | ||||
|           <template v-if="isAiResult"> | ||||
|             <div class="glass flex mar-v8"> | ||||
|               <div class="sta fill">网格员总人数<span>5118</span> | ||||
|                 <p>人</p></div> | ||||
|               <div class="sta">网格划分<span>3118</span> | ||||
|                 <p>个</p></div> | ||||
|             </div> | ||||
|             <h2>敏感词处理情况</h2> | ||||
|             <el-table size="mini" :data="reply.table" stripe class="w100 mar-v8"> | ||||
|               <el-table-column prop="address" label="地方"/> | ||||
|               <el-table-column prop="count" label="触发次数" width="100" align="right"/> | ||||
|               <el-table-column prop="handle" label="已处理" width="100" align="right"/> | ||||
|             </el-table> | ||||
|             <h2>敏感词触发统计</h2> | ||||
|             <ai-echart v-bind="reply.chart" class="mar-v8" id="KeywordChart"/> | ||||
|             <div class="flex column mar-b16"> | ||||
|               <div class="btn">导出到本地</div> | ||||
|             </div> | ||||
|           </template> | ||||
|         </ai-dv-svg> | ||||
|       </div> | ||||
|     </ai-drag> | ||||
|   </section> | ||||
| @@ -138,17 +240,106 @@ $theme-color: #23ECFD; | ||||
|     } | ||||
|  | ||||
|     .reply { | ||||
|       min-width: 300px; | ||||
|       min-height: 400px; | ||||
|       $bg: rgba(#0A2234, .88); | ||||
|       background-image: linear-gradient(to bottom, #5ac8f6 0, $bg 20px, $bg 100%); | ||||
|       box-shadow: 1px 1px 1px $theme-color inset, -1px -1px 1px $theme-color inset; | ||||
|       $w: 16px; | ||||
|       $h: 14px; | ||||
|       $r: 200px; | ||||
|       $vv: calc(100% - #{$w}); | ||||
|       $hh: calc(100% - #{$h}); | ||||
|       clip-path: polygon($w 0, calc(100% - #{$w} * 2 - #{$r}) 0, calc(100% - #{$w} - #{$r}) $h, $vv $h, 100% calc(#{$h} * 2), 100% $hh, $vv 100%, $w 100%, 0 $hh, 0 $h); | ||||
|       font-size: 14px; | ||||
|  | ||||
|       .glass { | ||||
|         width: 100%; | ||||
|         padding: 18px 14px; | ||||
|         background: hsla(0, 0%, 100%, .04); | ||||
|       } | ||||
|  | ||||
|       .sta { | ||||
|         display: flex; | ||||
|         align-items: baseline; | ||||
|         gap: 4px; | ||||
|         font-size: 12px; | ||||
|  | ||||
|         span { | ||||
|           font-family: D-DIN; | ||||
|           font-size: 18px; | ||||
|           color: $theme-color; | ||||
|         } | ||||
|  | ||||
|         p { | ||||
|           color: $theme-color; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       h2 { | ||||
|         font-size: 14px; | ||||
|         height: 30px; | ||||
|         line-height: 30px; | ||||
|         padding: 0px 10px; | ||||
|         background-image: linear-gradient(270deg, rgba(31, 67, 102, 0), rgba(31, 78, 102, 0.4)); | ||||
|       } | ||||
|  | ||||
|       .el-table { | ||||
|         font-size: 13px; | ||||
|         color: #fff; | ||||
|         background-color: transparent !important; | ||||
|  | ||||
|         .el-table__header { | ||||
|           background: rgba(33, 180, 253, 0.1); | ||||
|         } | ||||
|  | ||||
|         &::before { | ||||
|           display: none !important; | ||||
|         } | ||||
|  | ||||
|         tr.el-table__row--striped td { | ||||
|           background: rgba(33, 180, 253, 0.1) !important; | ||||
|         } | ||||
|  | ||||
|         .el-table th.el-table__cell { | ||||
|           background: transparent !important; | ||||
|         } | ||||
|  | ||||
|         .el-table__header tr th:first-child .cell { | ||||
|           padding-left: 20px !important; | ||||
|         } | ||||
|  | ||||
|         .el-table__header tr th.is-right .cell { | ||||
|           padding-right: 20px !important; | ||||
|         } | ||||
|  | ||||
|         .el-table__body tr td.is-right .cell { | ||||
|           padding-right: 20px !important; | ||||
|         } | ||||
|  | ||||
|         .el-table__body tr td:first-child .cell { | ||||
|           padding-left: 20px !important; | ||||
|         } | ||||
|  | ||||
|         &.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell { | ||||
|           background-color: rgba(33, 180, 253, 0.1) !important; | ||||
|         } | ||||
|  | ||||
|         td.el-table__cell, th.el-table__cell.is-leaf { | ||||
|           border-bottom: none !important; | ||||
|         } | ||||
|  | ||||
|         th.el-table__cell { | ||||
|           background-color: transparent !important; | ||||
|         } | ||||
|  | ||||
|         tr { | ||||
|           background-color: transparent !important; | ||||
|         } | ||||
|  | ||||
|         .el-table__cell { | ||||
|           padding: 7px 0; | ||||
|           color: #d0e1e8; | ||||
|         } | ||||
|  | ||||
|         .el-table__header tr .cell { | ||||
|           color: #02FEFF !important; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       #KeywordChart { | ||||
|         width: 100%; | ||||
|         height: 180px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   | ||||
							
								
								
									
										56
									
								
								components/AiDvDialog.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										56
									
								
								components/AiDvDialog.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,56 @@ | ||||
| <script> | ||||
| import AiDrag from "./AiDrag.vue"; | ||||
| import AiDvSvg from "./layout/AiDvSvg/AiDvSvg.vue"; | ||||
|  | ||||
| export default { | ||||
|   name: "AiDvDialog", | ||||
|   components: {AiDvSvg, AiDrag}, | ||||
|   props: { | ||||
|     title: {default: "弹窗"}, | ||||
|     tableData: {default: () => []}, | ||||
|     columns: {type: [Array, Object]} | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       dialog: false, | ||||
|       detail: {} | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     colConfigs() { | ||||
|       let config = [] | ||||
|       if (!Array.isArray(this.columns)) { | ||||
|         config = Object.entries(this.columns).map(([key, value]) => { | ||||
|           return {...value, prop: key} | ||||
|         }) | ||||
|       } else config = this.columns | ||||
|       return config | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <section class="AiDvDialog"> | ||||
|     <ai-drag v-if="dialog" :resizable="false"> | ||||
|       <ai-dv-svg :title="title" @close="dialog=false"> | ||||
|         <slot v-if="$slots.default"/> | ||||
|         <el-table v-else class="simple" :data="tableData"> | ||||
|           <el-table-column v-for="item in colConfigs" :key="item.prop" :prop="item.prop" :label="item.label"/> | ||||
|         </el-table> | ||||
|       </ai-dv-svg> | ||||
|     </ai-drag> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| @import "dv"; | ||||
|  | ||||
| .AiDvDialog { | ||||
|   position: fixed; | ||||
|   top: 50%; | ||||
|   left: 50%; | ||||
|   z-index: 999; | ||||
|   transform: translate(-50%, -50%); | ||||
| } | ||||
| </style> | ||||
| @@ -32,7 +32,7 @@ | ||||
|           :theme="theme" | ||||
|           :isShowIndex="data.isShowIndex" | ||||
|           :config="dvTableConfig" | ||||
|           :data="values"> | ||||
|           :data="values" :simple="data.simple==1"> | ||||
|       </AiDvTable> | ||||
|       <AiRanking | ||||
|           v-else-if="currentType === 'AiRanking'" | ||||
|   | ||||
							
								
								
									
										62
									
								
								components/dv.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										62
									
								
								components/dv.scss
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,62 @@ | ||||
| :deep(.el-table.simple) { | ||||
|   font-size: 13px; | ||||
|   color: #fff; | ||||
|   background-color: transparent !important; | ||||
|  | ||||
|   .el-table__header { | ||||
|     background: rgba(33, 180, 253, 0.1); | ||||
|   } | ||||
|  | ||||
|   &::before { | ||||
|     display: none !important; | ||||
|   } | ||||
|  | ||||
|   tr.el-table__row--striped td { | ||||
|     background: rgba(33, 180, 253, 0.1) !important; | ||||
|   } | ||||
|  | ||||
|   .el-table th.el-table__cell { | ||||
|     background: transparent !important; | ||||
|   } | ||||
|  | ||||
|   .el-table__header tr th:first-child .cell { | ||||
|     padding-left: 20px !important; | ||||
|   } | ||||
|  | ||||
|   .el-table__header tr th.is-right .cell { | ||||
|     padding-right: 20px !important; | ||||
|   } | ||||
|  | ||||
|   .el-table__body tr td.is-right .cell { | ||||
|     padding-right: 20px !important; | ||||
|   } | ||||
|  | ||||
|   .el-table__body tr td:first-child .cell { | ||||
|     padding-left: 20px !important; | ||||
|   } | ||||
|  | ||||
|   &.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell { | ||||
|     background-color: rgba(33, 180, 253, 0.1) !important; | ||||
|   } | ||||
|  | ||||
|   td.el-table__cell, th.el-table__cell.is-leaf { | ||||
|     border-bottom: none !important; | ||||
|   } | ||||
|  | ||||
|   th.el-table__cell { | ||||
|     background-color: transparent !important; | ||||
|   } | ||||
|  | ||||
|   tr { | ||||
|     background-color: transparent !important; | ||||
|   } | ||||
|  | ||||
|   .el-table__cell { | ||||
|     padding: 7px 0; | ||||
|     color: #d0e1e8; | ||||
|   } | ||||
|  | ||||
|   .el-table__header tr .cell { | ||||
|     color: #02FEFF !important; | ||||
|   } | ||||
| } | ||||
| @@ -25,11 +25,13 @@ import Summary15 from './components/Summary15' | ||||
| import Summary16 from './components/Summary16' | ||||
| import Summary17 from './components/Summary17' | ||||
| import Summary18 from './components/Summary18' | ||||
| import Summary19 from "./components/Summary19"; | ||||
|  | ||||
| export default { | ||||
|   name: 'AiDvSummary', | ||||
|  | ||||
|   components: { | ||||
|     Summary19, | ||||
|     Summary0, | ||||
|     Summary1, | ||||
|     Summary2, | ||||
|   | ||||
							
								
								
									
										69
									
								
								components/layout/AiDvSummary/components/Summary19.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										69
									
								
								components/layout/AiDvSummary/components/Summary19.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,69 @@ | ||||
| <template> | ||||
|   <div class="summary19"> | ||||
|     <div class="summary19-item" v-for="(item, index) in data" :key="index" v-if="index < 4"> | ||||
|       <div style="color: white" v-text="item[keys]"/> | ||||
|       <span v-text="item[value]"/> | ||||
|       <p v-if="item.unit" v-text="item.unit"/> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'summary19', | ||||
|  | ||||
|   props: { | ||||
|     data: { | ||||
|       type: Array, | ||||
|       default: () => [] | ||||
|     }, | ||||
|  | ||||
|     keys: { | ||||
|       type: String, | ||||
|       default: 'key' | ||||
|     }, | ||||
|  | ||||
|     value: { | ||||
|       type: String, | ||||
|       default: 'value' | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| $theme-color: #23ECFD; | ||||
| .summary19 { | ||||
|   height: 100%; | ||||
|   padding: 18px 14px; | ||||
|   background: hsla(0, 0%, 100%, .04); | ||||
|   margin: -16px 16px auto; | ||||
|   display: grid; | ||||
|   grid-template-columns: repeat(2, 1fr); | ||||
|  | ||||
|   div { | ||||
|     box-sizing: border-box; | ||||
|   } | ||||
|  | ||||
|   .summary19-item { | ||||
|     display: flex; | ||||
|     align-items: baseline; | ||||
|     gap: 4px; | ||||
|     font-size: 12px; | ||||
|  | ||||
|     span { | ||||
|       font-family: D-DIN; | ||||
|       font-size: 18px; | ||||
|       color: $theme-color; | ||||
|     } | ||||
|  | ||||
|     p { | ||||
|       color: $theme-color; | ||||
|     } | ||||
|  | ||||
|     &:nth-of-type(2n) { | ||||
|       justify-self: flex-end; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										146
									
								
								components/layout/AiDvSvg/AiDvSvg.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										146
									
								
								components/layout/AiDvSvg/AiDvSvg.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,146 @@ | ||||
| <script> | ||||
| const w = 12, h = 10, r = 200 | ||||
| export default { | ||||
|   name: "AiDvSvg", | ||||
|   props: { | ||||
|     title: {default: "慧智会言"}, | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       border: "", | ||||
|       box: {}, | ||||
|       height: 0, | ||||
|       width: 0 | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     init() { | ||||
|       let {width, height} = this.$el.getBoundingClientRect() | ||||
|       width -= 13 * 2 | ||||
|       height -= 13 * 2 | ||||
|       this.width = width | ||||
|       this.height = height | ||||
|       this.getBorder(width, height) | ||||
|       const vv = width - w | ||||
|       this.box = { | ||||
|         top: `m${vv - r + 33},${13 + h}l7,0l-2.5,-3l-7,0l2.5,3zm-1.5,0l-4.5,-5.5l-7,0l4.5,5.5l7,0zm-21,-7l6,7l7,0l-6,-7l-7,0z`, | ||||
|         leftBottom: `m46.5,${height + 10}l7,0l-2.5,-3l-7,0l2.5,3zm-1.5,0l-4.5,-5.5l-7,0l4.5,5.5l7,0zm-21,-7l6,7l7,0l-6,-7l-7,0z`, | ||||
|         rightBottom: `m${vv - 8},${height + 8}l-2.5,3l7,0l2.5,-3l-7,0zm17.5,-2.5l-7,0l-4.5,5.5l7,0l4.5,-5.5zm-3.5,5.5l7,0l6,-7l-7,0l-6,7z`, | ||||
|       } | ||||
|     }, | ||||
|     getBorder(cw, ch) { | ||||
|       const vv = cw - w, hh = ch - h | ||||
|       this.border = `${w} 0,${cw - w * 2 - r} 0,${cw - w - r} ${h}, ${vv} ${h},${cw} ${h * 2},${cw} ${hh}, ${vv} ${ch},${w} ${ch},0 ${hh},0 ${h}` | ||||
|     }, | ||||
|   }, | ||||
|   mounted() { | ||||
|     this.$nextTick(() => this.init()) | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <section class="AiDvSvg"> | ||||
|     <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"> | ||||
|       <defs> | ||||
|         <polygon :points="border" id="path-1"/> | ||||
|         <filter id="filter-2" filterUnits="objectBoundingBox" height="105.6%" width="108.5%" y="-3.3%" x="-4.2%"> | ||||
|           <feGaussianBlur result="shadowBlurOuter1" in="shadowOffsetOuter1" stdDeviation="6"/> | ||||
|         </filter> | ||||
|         <linearGradient id="linearGradient-3" y2="50.1547687%" x2="23.733%" y1="49.6234888%" x1="23.7333333%"> | ||||
|           <stop offset="0%" stop-color="#0D5B8C"/> | ||||
|           <stop offset="61.81%" stop-opacity="0.18" stop-color="#1275B3"/> | ||||
|           <stop offset="100%" stop-opacity="0.01" stop-color="#137ABA"/> | ||||
|         </linearGradient> | ||||
|         <linearGradient id="linearGradient-4" y2="50%" x2="100%" y1="50%" x1="0%"> | ||||
|           <stop offset="0%" stop-opacity="0" stop-color="#4ACCED"/> | ||||
|           <stop offset="48.88%" stop-color="#4ACCED"/> | ||||
|           <stop offset="100%" stop-opacity="0" stop-color="#49CDEE"/> | ||||
|         </linearGradient> | ||||
|         <linearGradient id="linearGradient-5" y2="50%" x2="100%" y1="50%" x1="0%"> | ||||
|           <stop offset="0%" stop-opacity="0" stop-color="#A4EEEF"/> | ||||
|           <stop offset="48.88%" stop-color="#A4EEEF"/> | ||||
|           <stop offset="100%" stop-opacity="0" stop-color="#A4EEEF"/> | ||||
|         </linearGradient> | ||||
|         <linearGradient id="linearGradient-6" y2="50%" x2="100%" y1="50%" x1="0%"> | ||||
|           <stop offset="0%" stop-color="#21EDED"/> | ||||
|           <stop offset="100%" stop-color="#276269"/> | ||||
|         </linearGradient> | ||||
|         <linearGradient id="linearGradient-7" y2="50%" x2="0%" y1="50%" x1="100%"> | ||||
|           <stop offset="0%" stop-color="#21EDED"/> | ||||
|           <stop offset="100%" stop-color="#276269"/> | ||||
|         </linearGradient> | ||||
|         <linearGradient id="linearGradient-8" y2="50%" x2="100%" y1="50%" x1="0%"> | ||||
|           <stop offset="0%" stop-opacity="0" stop-color="#0061AB"/> | ||||
|           <stop offset="51.39%" stop-color="#0061AB"/> | ||||
|           <stop offset="100%" stop-opacity="0" stop-color="#0062AB"/> | ||||
|         </linearGradient> | ||||
|       </defs> | ||||
|       <g> | ||||
|         <g fill-rule="evenodd" fill="none" id="未央区"> | ||||
|           <g id="弹窗6备份"> | ||||
|             <g id="编组-11"> | ||||
|               <g stroke-dasharray="0,0" id="路径"> | ||||
|                 <use id="svg_1" x="13" y="17" xlink:href="#path-1" filter="url(#filter-2)" fill="black"/> | ||||
|                 <use id="svg_2" x="13" y="17" xlink:href="#path-1" fill-rule="evenodd" fill="#0A2234" fill-opacity="0.88" stroke="#22D3D4"/> | ||||
|               </g> | ||||
|               <!--              <path fill="url(#linearGradient-3)" id="路径" d="m497,46.5l-15,-14l-250.5,0l-16.5,-15.5l-188.5,0l-13.5,15.5l0,26.5l484,0l0,-12.5z"/>--> | ||||
|               <line stroke-dasharray="0,0" stroke-width="2" stroke="url(#linearGradient-4)" id="路径-3" y2="17.5" x2="175" y1="17.5" x1="26.5"/> | ||||
|               <line stroke-dasharray="0,0" stroke-width="2" stroke="url(#linearGradient-5)" id="路径-3" y2="17.5" x2="149.5" y1="17.5" x1="58"/> | ||||
|               <path fill="url(#linearGradient-6)" id="上部拼合图形" :d="box.top"/> | ||||
|               <path fill="url(#linearGradient-6)" id="左下拼合图形" :d="box.leftBottom"/> | ||||
|               <path fill="url(#linearGradient-7)" id="右下拼合图形" :d="box.rightBottom"/> | ||||
|               <line stroke-dasharray="0,0" stroke-width="2" stroke="url(#linearGradient-8)" id="底部亮线" :y2="height+10" :x2="width/2+110" :y1="height+10" :x1="width/2-110+26"/> | ||||
|               <line stroke-dasharray="0,0" stroke-width="2" stroke="url(#linearGradient-8)" id="标题下划线" y2="65" x2="248" y1="65" x1="23"/> | ||||
|             </g> | ||||
|           </g> | ||||
|         </g> | ||||
|       </g> | ||||
|     </svg> | ||||
|     <div class="close" @click="$emit('close')"/> | ||||
|     <div class="content"> | ||||
|       <div class="header" v-text="title"/> | ||||
|       <slot/> | ||||
|     </div> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .AiDvSvg { | ||||
|   position: relative; | ||||
|   width: max(400px, 100%); | ||||
|   height: auto; | ||||
|  | ||||
|   & > svg { | ||||
|     position: absolute; | ||||
|     top: 0; | ||||
|     left: 0; | ||||
|     right: 0; | ||||
|     bottom: 0; | ||||
|     width: 100%; | ||||
|     height: 100%; | ||||
|     z-index: -1; | ||||
|   } | ||||
|  | ||||
|   .content { | ||||
|     width: 100%; | ||||
|     height: 100%; | ||||
|     padding: 14px 33px; | ||||
|  | ||||
|     .header { | ||||
|       padding: 16px 0; | ||||
|       font-weight: bold; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .close { | ||||
|     background-image: url("./assets/close.png"); | ||||
|     width: 24px; | ||||
|     height: 24px; | ||||
|     position: absolute; | ||||
|     right: 20px; | ||||
|     top: 35px; | ||||
|     z-index: 6; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										
											BIN
										
									
								
								components/layout/AiDvSvg/assets/close.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								components/layout/AiDvSvg/assets/close.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| After Width: | Height: | Size: 521 B | 
| @@ -1,163 +1,300 @@ | ||||
| <template> | ||||
|   <div class="aiDvTable" :class="'aiDvTable-' + theme + ' aiDvTable-' + size"> | ||||
|     <div class="header" :style="headerStyle"> | ||||
|   <section class="AiDvTable"> | ||||
|     <el-table v-if="simple" class="simple" :data="tableData"> | ||||
|       <el-table-column v-for="item in columns" :key="item.prop" v-bind="item"/> | ||||
|     </el-table> | ||||
|     <div v-else class="aiDvTable" :class="'aiDvTable-' + theme + ' aiDvTable-' + size"> | ||||
|       <div class="header" :style="headerStyle"> | ||||
|       <span | ||||
|         v-for="(item, index) in header" | ||||
|         :key="index" | ||||
|         :style="{ | ||||
|           v-for="(item, index) in header" | ||||
|           :key="index" | ||||
|           :style="{ | ||||
|           width: config[index].width ? config[index].width + 'px' : '', | ||||
|           textAlign: config[index].align, | ||||
|           flex: config[index].width ? 'inherit' : 1 | ||||
|         }"> | ||||
|         {{ item.v }} | ||||
|       </span> | ||||
|     </div> | ||||
|     <div class="body"> | ||||
|       <div class="row" v-for="(item, index) in body" :class="[stripe === '1' ? 'stripe' : '']" :key="index"> | ||||
|         <div | ||||
|           v-for="(column, i) in item" | ||||
|           :key="i" | ||||
|           :style="{ | ||||
|       </div> | ||||
|       <div class="body"> | ||||
|         <div class="row" v-for="(item, index) in body" :class="[stripe === '1' ? 'stripe' : '']" :key="index"> | ||||
|           <div | ||||
|               v-for="(column, i) in item" | ||||
|               :key="i" | ||||
|               :style="{ | ||||
|             color: config[i].color, | ||||
|             textAlign: config[i].align, | ||||
|             fontSize: config[i].fontSize, | ||||
|             width: config[i].width ? config[i].width + 'px' : '', | ||||
|             flex: config[i].width ? 'inherit' : 1 | ||||
|           }"> | ||||
|           <i v-if="isShowIndex === '1' && i === 0">{{ index + 1 }}</i> | ||||
|           <render-slot | ||||
|             v-if="config[i].render" | ||||
|             :render="config[i].render" | ||||
|             :row="item" | ||||
|             :column="column"> | ||||
|           </render-slot> | ||||
|           <span v-else :title="column" @click="onClick(config[i], item)">{{ column }}</span> | ||||
|             <i v-if="isShowIndex === '1' && i === 0">{{ index + 1 }}</i> | ||||
|             <render-slot | ||||
|                 v-if="config[i].render" | ||||
|                 :render="config[i].render" | ||||
|                 :row="item" | ||||
|                 :column="column"> | ||||
|             </render-slot> | ||||
|             <span v-else :title="column" @click="onClick(config[i], item)">{{ column }}</span> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   export default { | ||||
|     name: 'AiDvTable', | ||||
| export default { | ||||
|   name: 'AiDvTable', | ||||
|  | ||||
|     components: { | ||||
|       renderSlot: { | ||||
|         functional: true, | ||||
|         props: { | ||||
|           render: Function, | ||||
|           column: {type: [String, Number] }, | ||||
|           row: {type: [Array, Object] }, | ||||
|         }, | ||||
|         render: (h, data) => { | ||||
|           let params = { | ||||
|             row: data.props.row | ||||
|           } | ||||
|           if (data.props.column) { | ||||
|             params.column = data.props.column | ||||
|           } | ||||
|           return data.props.render(h, params) | ||||
|   components: { | ||||
|     renderSlot: { | ||||
|       functional: true, | ||||
|       props: { | ||||
|         render: Function, | ||||
|         column: {type: [String, Number]}, | ||||
|         row: {type: [Array, Object]}, | ||||
|       }, | ||||
|       render: (h, data) => { | ||||
|         let params = { | ||||
|           row: data.props.row | ||||
|         } | ||||
|         if (data.props.column) { | ||||
|           params.column = data.props.column | ||||
|         } | ||||
|         return data.props.render(h, params) | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|  | ||||
|   props: { | ||||
|     data: { | ||||
|       type: Array, | ||||
|       default: () => [] | ||||
|     }, | ||||
|  | ||||
|     headerStyle: { | ||||
|       type: Object, | ||||
|       default: () => { | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     props: { | ||||
|       data: { | ||||
|         type: Array, | ||||
|         default: () => [] | ||||
|       }, | ||||
|     isShowIndex: { | ||||
|       type: String, | ||||
|       default: '0' | ||||
|     }, | ||||
|  | ||||
|       headerStyle: { | ||||
|         type: Object, | ||||
|         default: () => {} | ||||
|       }, | ||||
|     stripe: { | ||||
|       type: String, | ||||
|       default: '1' | ||||
|     }, | ||||
|  | ||||
|       isShowIndex: { | ||||
|         type: String, | ||||
|         default: '0' | ||||
|       }, | ||||
|     theme: { | ||||
|       type: String, | ||||
|       default: '0' | ||||
|     }, | ||||
|  | ||||
|       stripe: { | ||||
|         type: String, | ||||
|         default: '1' | ||||
|       }, | ||||
|     config: { | ||||
|       type: Array, | ||||
|       default: () => [] | ||||
|     }, | ||||
|  | ||||
|       theme: { | ||||
|         type: String, | ||||
|         default: '0' | ||||
|       }, | ||||
|     size: { | ||||
|       type: String, | ||||
|       default: 'small' | ||||
|     }, | ||||
|     simple: Boolean | ||||
|   }, | ||||
|  | ||||
|       config: { | ||||
|         type: Array, | ||||
|         default: () => [] | ||||
|   data() { | ||||
|     return { | ||||
|       header: [], | ||||
|       body: [] | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     columns: v => v.header.map((e, i) => { | ||||
|       let item = {} | ||||
|       Object.values(e).forEach(label => { | ||||
|         const {align} = v.config[i] | ||||
|         item.align = align | ||||
|         item.prop = `col${i}` | ||||
|         item.label = label | ||||
|       }) | ||||
|       return item | ||||
|     }), | ||||
|     tableData: v => v.body.map(arr => { | ||||
|       const item = {} | ||||
|       Object.values(arr).forEach((value, i) => { | ||||
|         item[`col${i}`] = value | ||||
|       }) | ||||
|       return item | ||||
|     }) | ||||
|   }, | ||||
|   watch: { | ||||
|     data: { | ||||
|       handler(v) { | ||||
|         this.init(v) | ||||
|       }, | ||||
|       deep: true, | ||||
|       immediate: true | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     init(value) { | ||||
|       if (!value.length) { | ||||
|         this.header = [] | ||||
|         this.body = [] | ||||
|  | ||||
|       size: { | ||||
|         type: String, | ||||
|         default: 'small' | ||||
|         return false | ||||
|       } | ||||
|  | ||||
|       const headerKey = Object.keys(value[0])[0] | ||||
|       const bodyKey = Object.keys(value[0]).filter(v => { | ||||
|         return v !== headerKey | ||||
|       }) | ||||
|  | ||||
|       this.header = value.map(v => { | ||||
|         return { | ||||
|           v: v[headerKey] | ||||
|         } | ||||
|       }) | ||||
|  | ||||
|       this.body = bodyKey.map(v => { | ||||
|         return value.map(e => e[v]) | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     onClick(config, e) { | ||||
|       if (config.click && typeof config.click === 'function') { | ||||
|         return config.click.call(this, e) | ||||
|       } | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
|     data () { | ||||
|       return { | ||||
|         header: [], | ||||
|         body: [] | ||||
| <style lang="scss" scoped> | ||||
| @import "../../dv"; | ||||
|  | ||||
| .aiDvTable { | ||||
|   height: 100%; | ||||
|   overflow: hidden; | ||||
|  | ||||
|   ::-webkit-scrollbar { | ||||
|     width: 5px; | ||||
|     height: 14px; | ||||
|   } | ||||
|  | ||||
|   ::-webkit-scrollbar-corner { | ||||
|     background: transparent; | ||||
|   } | ||||
|  | ||||
|   ::-webkit-scrollbar-thumb { | ||||
|     min-height: 20px; | ||||
|     background-clip: content-box; | ||||
|     box-shadow: 0 0 0 5px rgba(116, 148, 170, 0.5) inset; | ||||
|   } | ||||
|  | ||||
|   ::-webkit-scrollbar-track { | ||||
|     box-shadow: 1px 1px 5px rgba(116, 148, 170, 0.5) inset; | ||||
|   } | ||||
|  | ||||
|   .header { | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|     width: 100%; | ||||
|     height: 40px; | ||||
|     font-size: 16px; | ||||
|     padding: 0 16px; | ||||
|     color: rgba(255, 255, 255, 0.7); | ||||
|     background: rgba(70, 70, 70, 0.35); | ||||
|  | ||||
|     span { | ||||
|       flex: 1; | ||||
|       text-align: center; | ||||
|       overflow: hidden; | ||||
|       white-space: nowrap; | ||||
|       text-overflow: ellipsis; | ||||
|       -o-text-overflow: ellipsis; | ||||
|  | ||||
|       &:first-child { | ||||
|         text-align: left; | ||||
|       } | ||||
|     }, | ||||
|     } | ||||
|   } | ||||
|  | ||||
|     watch: { | ||||
|       data: { | ||||
|         handler (v) { | ||||
|           this.init(v) | ||||
|         }, | ||||
|         deep: true, | ||||
|         immediate: true | ||||
|   .body { | ||||
|     height: calc(100% - 40px); | ||||
|     padding: 10px 0; | ||||
|     overflow-y: auto; | ||||
|     box-sizing: border-box; | ||||
|  | ||||
|     .row { | ||||
|       display: flex; | ||||
|       align-items: center; | ||||
|       width: 100%; | ||||
|       height: 52px; | ||||
|       padding: 0 16px; | ||||
|       box-sizing: border-box; | ||||
|  | ||||
|       &.stripe:nth-of-type(2n) { | ||||
|         background: rgba(48, 48, 48, 0.4); | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     mounted () { | ||||
|     }, | ||||
|       div { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         justify-content: center; | ||||
|         flex: 1; | ||||
|         font-size: 16px; | ||||
|         text-align: center; | ||||
|         color: #ffffff; | ||||
|         overflow: hidden; | ||||
|         white-space: nowrap; | ||||
|         text-overflow: ellipsis; | ||||
|         -o-text-overflow: ellipsis; | ||||
|  | ||||
|     methods: { | ||||
|       init (value) { | ||||
|         if (!value.length) { | ||||
|           this.header = [] | ||||
|           this.body = [] | ||||
|  | ||||
|           return false | ||||
|         span { | ||||
|           flex: 1; | ||||
|           overflow: hidden; | ||||
|           white-space: nowrap; | ||||
|           text-overflow: ellipsis; | ||||
|           -o-text-overflow: ellipsis; | ||||
|         } | ||||
|  | ||||
|         const headerKey = Object.keys(value[0])[0] | ||||
|         const bodyKey = Object.keys(value[0]).filter(v => { | ||||
|           return v !== headerKey | ||||
|         }) | ||||
|         i { | ||||
|           width: 20px; | ||||
|           height: 20px; | ||||
|           line-height: 20px; | ||||
|           margin-right: 10px; | ||||
|           text-align: center; | ||||
|           font-size: 12px; | ||||
|           color: #18FEFE; | ||||
|           font-style: normal; | ||||
|           background: url(./asset/rankbg.png) no-repeat; | ||||
|           background-size: 100% 100%; | ||||
|         } | ||||
|  | ||||
|         this.header = value.map(v => { | ||||
|           return { | ||||
|             v: v[headerKey] | ||||
|           } | ||||
|         }) | ||||
|  | ||||
|         this.body = bodyKey.map(v => { | ||||
|           return value.map(e => e[v]) | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       onClick (config, e) { | ||||
|         if (config.click && typeof config.click === 'function') { | ||||
|           return config.click.call(this, e) | ||||
|         &:first-child { | ||||
|           justify-content: start; | ||||
|           text-align: left; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
|   .aiDvTable { | ||||
|     height: 100%; | ||||
|     overflow: hidden; | ||||
|   &.aiDvTable-mini { | ||||
|     .header { | ||||
|       height: 36px; | ||||
|     } | ||||
|  | ||||
|     .row { | ||||
|       height: 40px; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   &.aiDvTable-1 { | ||||
|     ::-webkit-scrollbar { | ||||
|       width: 5px; | ||||
|       height: 14px; | ||||
| @@ -170,138 +307,26 @@ | ||||
|     ::-webkit-scrollbar-thumb { | ||||
|       min-height: 20px; | ||||
|       background-clip: content-box; | ||||
|       box-shadow: 0 0 0 5px rgba(116, 148, 170, 0.5) inset; | ||||
|       box-shadow: 0 0 0 5px rgba(250, 181, 108, 0.5) inset; | ||||
|     } | ||||
|  | ||||
|     ::-webkit-scrollbar-track { | ||||
|       box-shadow: 1px 1px 5px rgba(116, 148, 170, 0.5) inset; | ||||
|       box-shadow: 1px 1px 5px rgba(50, 181, 108, 0.5) inset; | ||||
|     } | ||||
|  | ||||
|     .header { | ||||
|       display: flex; | ||||
|       align-items: center; | ||||
|       width: 100%; | ||||
|       height: 40px; | ||||
|       font-size: 16px; | ||||
|       padding: 0 16px; | ||||
|       color: rgba(255, 255, 255, 0.7); | ||||
|       background: rgba(70, 70, 70, 0.35); | ||||
|  | ||||
|       span { | ||||
|         flex: 1; | ||||
|         text-align: center; | ||||
|         overflow: hidden; | ||||
|         white-space: nowrap; | ||||
|         text-overflow: ellipsis; | ||||
|         -o-text-overflow:ellipsis; | ||||
|  | ||||
|         &:first-child { | ||||
|           text-align: left; | ||||
|         } | ||||
|       } | ||||
|       background: rgba(226, 121, 81, 0.2); | ||||
|     } | ||||
|  | ||||
|     .body { | ||||
|       height: calc(100% - 40px); | ||||
|       padding: 10px 0; | ||||
|       overflow-y: auto; | ||||
|       box-sizing: border-box; | ||||
|       .row { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         width: 100%; | ||||
|         height: 52px; | ||||
|         padding: 0 16px; | ||||
|         box-sizing: border-box; | ||||
|  | ||||
|         &.stripe:nth-of-type(2n) { | ||||
|           background: rgba(48, 48, 48, 0.4); | ||||
|         } | ||||
|  | ||||
|         div { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           justify-content: center; | ||||
|           flex: 1; | ||||
|           font-size: 16px; | ||||
|           text-align: center; | ||||
|           color: #ffffff; | ||||
|           overflow: hidden; | ||||
|           white-space: nowrap; | ||||
|           text-overflow: ellipsis; | ||||
|           -o-text-overflow:ellipsis; | ||||
|  | ||||
|           span { | ||||
|             flex: 1; | ||||
|             overflow: hidden; | ||||
|             white-space: nowrap; | ||||
|             text-overflow: ellipsis; | ||||
|             -o-text-overflow:ellipsis; | ||||
|           } | ||||
|  | ||||
|           i { | ||||
|             width: 20px; | ||||
|             height: 20px; | ||||
|             line-height: 20px; | ||||
|             margin-right: 10px; | ||||
|             text-align: center; | ||||
|             font-size: 12px; | ||||
|             color: #18FEFE; | ||||
|             font-style: normal; | ||||
|             background: url(./asset/rankbg.png) no-repeat; | ||||
|             background-size: 100% 100%; | ||||
|           } | ||||
|  | ||||
|           &:first-child { | ||||
|             justify-content: start; | ||||
|             text-align: left; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     &.aiDvTable-mini { | ||||
|       .header { | ||||
|         height: 36px; | ||||
|       } | ||||
|  | ||||
|       .row { | ||||
|         height: 40px; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     &.aiDvTable-1 { | ||||
|       ::-webkit-scrollbar { | ||||
|         width: 5px; | ||||
|         height: 14px; | ||||
|       } | ||||
|  | ||||
|       ::-webkit-scrollbar-corner { | ||||
|         background: transparent; | ||||
|       } | ||||
|  | ||||
|       ::-webkit-scrollbar-thumb { | ||||
|         min-height: 20px; | ||||
|         background-clip: content-box; | ||||
|         box-shadow: 0 0 0 5px rgba(250, 181, 108, 0.5) inset; | ||||
|       } | ||||
|  | ||||
|       ::-webkit-scrollbar-track { | ||||
|         box-shadow: 1px 1px 5px rgba(50, 181, 108, 0.5) inset; | ||||
|       } | ||||
|       .header { | ||||
|         background: rgba(226, 121, 81, 0.2); | ||||
|       } | ||||
|  | ||||
|       .body { | ||||
|         div { | ||||
|           i { | ||||
|             color: #FFA086; | ||||
|             background: url(./asset/rankbg-dj.png) no-repeat; | ||||
|             background-size: 100% 100%; | ||||
|           } | ||||
|       div { | ||||
|         i { | ||||
|           color: #FFA086; | ||||
|           background: url(./asset/rankbg-dj.png) no-repeat; | ||||
|           background-size: 100% 100%; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
|   | ||||
| @@ -103,6 +103,15 @@ | ||||
|               </el-select> | ||||
|             </div> | ||||
|           </div> | ||||
|           <div class="layout-config__item" v-if="config.type === 'AiDvTable'"> | ||||
|             <label>简易样式</label> | ||||
|             <div class="layout-config__item--right"> | ||||
|               <el-select size="mini" v-model="config.simple" placeholder="请选择" clearable> | ||||
|                 <el-option label="是" value="1"/> | ||||
|                 <el-option label="否" value="0"/> | ||||
|               </el-select> | ||||
|             </div> | ||||
|           </div> | ||||
|           <div class="layout-config__item" v-if="config.type !== 'AiDvTable'"> | ||||
|             <label>表格行数</label> | ||||
|             <div class="layout-config__item--right"> | ||||
| @@ -207,12 +216,25 @@ | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="layout-right__content--wrapper"> | ||||
|       <div class="layout-config__group"> | ||||
|         <h2>进阶设置</h2> | ||||
|         <config-item label="设置弹窗"> | ||||
|           <config-item label="标题"> | ||||
| <!--            <el-input v-model="config.dialog.title" clearable/>--> | ||||
|           </config-item> | ||||
|         </config-item> | ||||
|       </div> | ||||
|     </div> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import ConfigItem from "./configItem.vue"; | ||||
|  | ||||
| export default { | ||||
|   name: 'componentConfig', | ||||
|   components: {ConfigItem}, | ||||
|  | ||||
|   props: { | ||||
|     config: {default: () => ({})}, | ||||
| @@ -226,7 +248,7 @@ export default { | ||||
|         'border11', 'border12', 'border13'],//边框待选项 | ||||
|       summaryList: ['summary0', 'summary1', 'summary2', 'summary3', 'summary4', 'summary6', 'summary5', | ||||
|         'summary7', 'summary8', 'summary9', 'summary10', 'summary11', 'summary12', 'summary13', 'summary14', | ||||
|         'summary15', 'summary16', 'summary17', 'summary18'],//汇总待选项 | ||||
|         'summary15', 'summary16', 'summary17', 'summary18', 'summary19'],//汇总待选项 | ||||
|       //是否显示排名 | ||||
|       tableStatus: [ | ||||
|         {label: '是', value: '1'}, | ||||
|   | ||||
| @@ -426,76 +426,78 @@ const components = [{ | ||||
|     }] | ||||
|   }] | ||||
| }, { | ||||
|   type: 'table', label: '表格', list: [{ | ||||
|     label: '表格', type: 'table', list: [{ | ||||
|       type: 'table', | ||||
|       label: '表格', | ||||
|       title: '表格', | ||||
|       border: 'border6', | ||||
|       width: 650, | ||||
|       height: 400, | ||||
|       zIndex: 1, | ||||
|       thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/table.png', | ||||
|       dataX: '', | ||||
|       dataY: [], | ||||
|       rowNum: 7, | ||||
|       isShowIndex: '1', | ||||
|       sourceDataId: '', | ||||
|       api: '', | ||||
|       apiData: [], | ||||
|       dataType: 'staticData', | ||||
|       dynamicData: [], | ||||
|       staticData: [{name: '列1', v: 23, v2: 3}, {name: '列2', v: 12, v2: 4}, {name: '列2', v: 12, v2: 4}] | ||||
|     }, { | ||||
|       type: 'AiDvTable', | ||||
|       label: '新版表格', | ||||
|       title: '新版表格', | ||||
|       border: 'border6', | ||||
|       width: 650, | ||||
|       height: 400, | ||||
|       zIndex: 1, | ||||
|       thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/table.png', | ||||
|       dataX: '', | ||||
|       dataY: [], | ||||
|       rowNum: 7, | ||||
|       stripe: '1', | ||||
|       isShowIndex: '1', | ||||
|       sourceDataId: '', | ||||
|       api: '', | ||||
|       config: [{ | ||||
|         width: '', color: '', align: '' | ||||
|   label: '表格', list: [ | ||||
|     { | ||||
|       label: '单表格', list: [{ | ||||
|         type: 'table', | ||||
|         label: '表格', | ||||
|         title: '表格', | ||||
|         border: 'border6', | ||||
|         width: 650, | ||||
|         height: 400, | ||||
|         zIndex: 1, | ||||
|         thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/table.png', | ||||
|         dataX: '', | ||||
|         dataY: [], | ||||
|         rowNum: 7, | ||||
|         isShowIndex: '1', | ||||
|         sourceDataId: '', | ||||
|         api: '', | ||||
|         apiData: [], | ||||
|         dataType: 'staticData', | ||||
|         dynamicData: [], | ||||
|         staticData: [{name: '列1', v: 23, v2: 3}, {name: '列2', v: 12, v2: 4}, {name: '列2', v: 12, v2: 4}] | ||||
|       }, { | ||||
|         width: '', color: '', align: '' | ||||
|         type: 'AiDvTable', | ||||
|         label: '新版表格', | ||||
|         title: '新版表格', | ||||
|         border: 'border6', | ||||
|         width: 650, | ||||
|         height: 400, | ||||
|         zIndex: 1, | ||||
|         thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/table.png', | ||||
|         dataX: '', | ||||
|         dataY: [], | ||||
|         rowNum: 7, | ||||
|         stripe: '1', | ||||
|         isShowIndex: '1', | ||||
|         sourceDataId: '', | ||||
|         api: '', | ||||
|         config: [{ | ||||
|           width: '', color: '', align: '' | ||||
|         }, { | ||||
|           width: '', color: '', align: '' | ||||
|         }, { | ||||
|           width: '', color: '', align: '' | ||||
|         }], | ||||
|         apiData: [], | ||||
|         dataType: 'staticData', | ||||
|         dynamicData: [], | ||||
|         staticData: [{name: '列1', v: 23, v2: 3}, {name: '列2', v: 12, v2: 4}, {name: '列2', v: 12, v2: 4}] | ||||
|       }, { | ||||
|         width: '', color: '', align: '' | ||||
|       }], | ||||
|       apiData: [], | ||||
|       dataType: 'staticData', | ||||
|       dynamicData: [], | ||||
|       staticData: [{name: '列1', v: 23, v2: 3}, {name: '列2', v: 12, v2: 4}, {name: '列2', v: 12, v2: 4}] | ||||
|     }, { | ||||
|       type: 'AiRanking', | ||||
|       label: '排行榜', | ||||
|       title: '排行榜', | ||||
|       border: 'border6', | ||||
|       width: 523, | ||||
|       height: 400, | ||||
|       zIndex: 1, | ||||
|       thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/table.png', | ||||
|       dataX: '', | ||||
|       dataY: [], | ||||
|       rowNum: 7, | ||||
|       subType: 'Ranking1', | ||||
|       stripe: '1', | ||||
|       isShowIndex: '1', | ||||
|       sourceDataId: '', | ||||
|       api: '', | ||||
|       apiData: [], | ||||
|       dataType: 'staticData', | ||||
|       dynamicData: [], | ||||
|       staticData: [{name: '列1', value: 23}, {name: '列2', value: 12}, {name: '列2', value: 12}] | ||||
|     }] | ||||
|   }] | ||||
|         type: 'AiRanking', | ||||
|         label: '排行榜', | ||||
|         title: '排行榜', | ||||
|         border: 'border6', | ||||
|         width: 523, | ||||
|         height: 400, | ||||
|         zIndex: 1, | ||||
|         thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/table.png', | ||||
|         dataX: '', | ||||
|         dataY: [], | ||||
|         rowNum: 7, | ||||
|         subType: 'Ranking1', | ||||
|         stripe: '1', | ||||
|         isShowIndex: '1', | ||||
|         sourceDataId: '', | ||||
|         api: '', | ||||
|         apiData: [], | ||||
|         dataType: 'staticData', | ||||
|         dynamicData: [], | ||||
|         staticData: [{name: '列1', value: 23}, {name: '列2', value: 12}, {name: '列2', value: 12}] | ||||
|       }] | ||||
|     }, | ||||
|   ] | ||||
| }, { | ||||
|   type: 'ai3d', label: "3D", list: [{ | ||||
|     label: "3D楼栋", type: 'building', list: [{ | ||||
|   | ||||
		Reference in New Issue
	
	Block a user