大屏
This commit is contained in:
		| @@ -17,7 +17,7 @@ | ||||
|                   <el-radio-group v-model="form.sendScope" @change="onScopeChange"> | ||||
|                     <el-radio label="0">全部居民群</el-radio> | ||||
|                     <el-radio label="1">按部门选择</el-radio> | ||||
|                     <el-radio label="2">按网格选择</el-radio> | ||||
|                     <!-- <el-radio label="2">按网格选择</el-radio> --> | ||||
|                   </el-radio-group> | ||||
|                 </el-form-item> | ||||
|                 <el-form-item label="选择群主" v-if="form.sendScope !== '0'" prop="wxGroupsName" style="width: 100%;" :rules="[{ required: true, message: '请选择选择群主', trigger: 'change' }]"> | ||||
| @@ -140,16 +140,6 @@ | ||||
|                     <em>从本地上传,图片最大支持10MB,支持JPG,PNG格式;视频最大支持10MB,支持MP4格式;文件最大支持20MB</em> | ||||
|                   </div> | ||||
|                 </el-form-item> | ||||
|                 <el-form-item label="标签" style="width: 100%;" prop="markTag"> | ||||
|                   <el-checkbox-group v-model="form.markTag"> | ||||
|                     <el-checkbox | ||||
|                       v-for="(item, index) in dict.getDict('mstTag')" | ||||
|                       :key="index" | ||||
|                       :label="item.dictValue"> | ||||
|                       {{ item.dictName }} | ||||
|                     </el-checkbox> | ||||
|                   </el-checkbox-group> | ||||
|                 </el-form-item> | ||||
|                 <el-form-item label="结束时间" style="width: 100%;" prop="taskEndTime" :rules="[{ required: true, message: '请选择结束时间', trigger: 'change' }]"> | ||||
|                   <el-date-picker | ||||
|                     style="width: 100%;" | ||||
| @@ -291,7 +281,7 @@ | ||||
|             <el-button @click="onDateForm" type="primary" :loading="isLoading2" style="width: 92px;">确认</el-button> | ||||
|           </div> | ||||
|         </ai-dialog> | ||||
|         <!-- <ChooseMaterial ref="ChooseMaterial" :instance="instance" @change="onChooseChange"></ChooseMaterial> --> | ||||
|         <ChooseMaterial ref="ChooseMaterial" :instance="instance" @change="onChooseChange"></ChooseMaterial> | ||||
|       </div> | ||||
|     </template> | ||||
|     <template #footer> | ||||
| @@ -356,7 +346,6 @@ export default { | ||||
|         taskEndTime: '', | ||||
|         examines: [], | ||||
|         wxGroups: [], | ||||
|         markTag: [], | ||||
|         wxGroupsName: '', | ||||
|         sendScope: '0', | ||||
|         sendType: 0, | ||||
| @@ -393,10 +382,8 @@ export default { | ||||
|     if (this.params && this.params.id) { | ||||
|       this.id = this.params.id | ||||
|       this.getInfo(this.params.id) | ||||
|       this.dict.load('mstTag') | ||||
|     } else { | ||||
|       this.getWxGroups() | ||||
|       this.dict.load('mstTag') | ||||
|     } | ||||
|   }, | ||||
|  | ||||
| @@ -416,8 +403,7 @@ export default { | ||||
|             ...this.form, | ||||
|             ...res.data, | ||||
|             wxGroupsName: '1', | ||||
|             filterCriteria: res.data.filterCriteria.split(','), | ||||
|             markTag: res.data.markTag.split(',') | ||||
|             filterCriteria: res.data.filterCriteria.split(',') | ||||
|           } | ||||
|  | ||||
|           if (res.data.girdNames) { | ||||
| @@ -670,7 +656,6 @@ export default { | ||||
|             wxGroups: this.form.wxGroups, | ||||
|             contents, | ||||
|             sendType, | ||||
|             markTag: this.form.markTag.join(','), | ||||
|             sendChannel: this.params.sendChannel, | ||||
|             choiceTime: this.dateForm.choiceTime, | ||||
|             filterCriteria: this.form.filterCriteria.join(','), | ||||
|   | ||||
| @@ -37,11 +37,9 @@ | ||||
|                 </div> | ||||
|               </div> | ||||
|             </ai-info-item> | ||||
|             <ai-info-item label="发送方式"> | ||||
|             <ai-info-item label="发送方式" isLine> | ||||
|               <span>{{ info.sendChannel === '1' ? '通知员工转发' : '成员一键群发' }}</span> | ||||
|             </ai-info-item> | ||||
|             <ai-info-item label="标签" :value="info.markTag"> | ||||
|             </ai-info-item> | ||||
|             <ai-info-item label="创建时间" :value="info.createTime"></ai-info-item> | ||||
|             <ai-info-item label="群发时间" :value="info.choiceTime"></ai-info-item> | ||||
|             <ai-info-item label="结束时间" :value="info.taskEndTime" v-if="info.sendChannel === '1'"></ai-info-item> | ||||
|   | ||||
| @@ -78,7 +78,7 @@ | ||||
|               <el-button type="text" @click="close(row.id)" v-if="['4'].includes(row.status)">关闭</el-button> | ||||
|               <el-button type="text" @click="cancel(row.id)" v-if="['0'].includes(row.status)">撤回</el-button> | ||||
|               <el-button type="text" @click="toDetail(row.id)">详情</el-button> | ||||
|               <el-button type="text" @click="toAdd(row.id)" v-if="['1', '3'].includes(row.status)">编辑</el-button> | ||||
|               <el-button type="text" @click="toAdd(row.sendChannel, row.id)" v-if="['1', '3'].includes(row.status)">编辑</el-button> | ||||
|             </div> | ||||
|           </template> | ||||
|         </el-table-column> | ||||
| @@ -141,7 +141,6 @@ | ||||
|           { slot: 'user', label: '创建人', openType: 'userName', align: 'center' }, | ||||
|           { prop: 'choiceTime', label: '群发时间', align: 'center' }, | ||||
|           { prop: 'taskEndTime', label: '群发结束时间', align: 'center' }, | ||||
|           { prop: 'markTag', label: '标签', align: 'center' }, | ||||
|           { | ||||
|             prop: 'status', | ||||
|             align: 'center', | ||||
| @@ -160,7 +159,7 @@ | ||||
|     }, | ||||
|  | ||||
|     created () { | ||||
|       this.dict.load('mstStatus', 'mstSendType', 'mstTag').then(() => { | ||||
|       this.dict.load('mstStatus', 'mstSendType').then(() => { | ||||
|         this.getList() | ||||
|       }) | ||||
|     }, | ||||
|   | ||||
| @@ -103,18 +103,6 @@ | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|       <div class="bottom"> | ||||
|         <ai-card title="宣发分类数" style="flex: 1; margin-right: 20px;"> | ||||
|           <template #content> | ||||
|             <div id="chart1" style="width: 100%; height: 300px;"></div> | ||||
|           </template> | ||||
|         </ai-card> | ||||
|         <ai-card title="宣发分类占比" style="width: 600px"> | ||||
|           <template #content> | ||||
|             <div id="chart2" style="width: 100%; height: 300px;"></div> | ||||
|           </template> | ||||
|         </ai-card> | ||||
|       </div> | ||||
|       <div class="statistics-content"> | ||||
|         <div class="flex-between mar-b16"> | ||||
|           <ai-title title="宣发明细"></ai-title> | ||||
| @@ -175,14 +163,6 @@ | ||||
|         isDepartData: true, | ||||
|         departBarData: [], | ||||
|         type: '', | ||||
|         date: '', | ||||
|         search: { | ||||
|           current: 1, | ||||
|           size: 10, | ||||
|           type: '0' | ||||
|         }, | ||||
|         chart1: null, | ||||
|         chart2: null | ||||
|       } | ||||
|     }, | ||||
|     computed: { | ||||
| @@ -237,14 +217,6 @@ | ||||
|       this.getDepart() | ||||
|       this.dict.load('mstSendType') | ||||
|     }, | ||||
|  | ||||
|     mounted () { | ||||
|       this.$nextTick(() => { | ||||
|         this.chart1 = echarts.init(document.querySelector('#chart1')) | ||||
|         this.chart2 = echarts.init(document.querySelector('#chart2')) | ||||
|         window.addEventListener('resize', this.onResize) | ||||
|       }) | ||||
|     }, | ||||
|     methods: { | ||||
|       ...mapActions(['initOpenData', 'transCanvas']), | ||||
|       onUserChange (e) { | ||||
| @@ -318,8 +290,6 @@ | ||||
|             this.setLineChart(xData, createData, 'createChart', ['#2891FF']) | ||||
|             this.setLineChart(xData, executeData, 'executeChart', ['#FFB865']) | ||||
|             this.setLineChart(xData, receiveData, 'receiveChart', ['#26D52B']) | ||||
|             this.initChart1(res.data.tagTrend) | ||||
|             this.initChart2(res.data.tagDistribution) | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
| @@ -486,137 +456,8 @@ | ||||
|         //   ] | ||||
|         // }; | ||||
|         this.departBarChart.setOption(option) | ||||
|       }, | ||||
|  | ||||
|       initChart1 (data) { | ||||
|         const x = Object.keys(data) | ||||
|         const tags = data[x[0]].map(v => v.tag) | ||||
|         let option = { | ||||
|           tooltip: { | ||||
|             trigger: 'axis' | ||||
|           }, | ||||
|           legend: { | ||||
|             type: "plain" | ||||
|           }, | ||||
|           grid: { | ||||
|             left: '10px', | ||||
|             right: '28px', | ||||
|             bottom: '14px', | ||||
|             top: '30px', | ||||
|             containLabel: true | ||||
|           }, | ||||
|           dataZoom: [ | ||||
|             { | ||||
|               type: 'inside', | ||||
|               start: 0, | ||||
|               end: 7, | ||||
|               minValueSpan: 7 | ||||
|             }, | ||||
|             { | ||||
|               start: 0, | ||||
|               end: 7 | ||||
|             } | ||||
|           ], | ||||
|           color: ['#2266FF', '#22AA99', '#F8B425', '#29ABF7', '#49DFCB'], | ||||
|           xAxis: { | ||||
|             type: 'category', | ||||
|             axisLabel: { | ||||
|               align: 'center', | ||||
|               padding: [2, 0, 0, 0], | ||||
|               interval: 0, | ||||
|               fontSize: 14, | ||||
|               color: '#666666' | ||||
|             }, | ||||
|             boundaryGap: false, | ||||
|             axisLine: { | ||||
|               lineStyle: { | ||||
|                 color: '#E1E5EF' | ||||
|               } | ||||
|             }, | ||||
|             data: x | ||||
|           }, | ||||
|           yAxis: { | ||||
|             axisTick: { | ||||
|               length: 0, | ||||
|               show: false | ||||
|             }, | ||||
|             splitLine: { | ||||
|               show: true, | ||||
|               lineStyle:{ | ||||
|                 color: ['#E1E5EF'], | ||||
|                 width: 1, | ||||
|                 type: 'solid' | ||||
|               } | ||||
|             }, | ||||
|             nameTextStyle: { | ||||
|               color: '#666666', | ||||
|               align: 'left' | ||||
|             }, | ||||
|             axisLine: { | ||||
|               show: false | ||||
|             }, | ||||
|             axisLabel: { | ||||
|               color: '#666666' | ||||
|             }, | ||||
|             type: 'value' | ||||
|           }, | ||||
|           series: tags.map(v => { | ||||
|             return { | ||||
|               name: v, | ||||
|               type: 'line', | ||||
|               data: x.map(e => data[e]).filter(z => { | ||||
|                 return z.filter(y => y.tag === v)[0].c | ||||
|               }) | ||||
|             } | ||||
|           }) | ||||
|         } | ||||
|         this.chart1.setOption(option) | ||||
|       }, | ||||
|  | ||||
|       initChart2 (data) { | ||||
|         let option = { | ||||
|           grid: { | ||||
|             left: '1%', | ||||
|             right: '0%', | ||||
|             bottom: '2%', | ||||
|             top: '0px', | ||||
|             containLabel: true | ||||
|           }, | ||||
|           tooltip: { | ||||
|             trigger: 'item', | ||||
|             axisPointer: { | ||||
|             } | ||||
|           }, | ||||
|           legend: { | ||||
|             left: 'center', | ||||
|             top: '0px', | ||||
|             textStyle: { | ||||
|             } | ||||
|           }, | ||||
|           color: ['#2266FF', '#22AA99', '#F8B425', '#29ABF7', '#49DFCB'], | ||||
|           series: [ | ||||
|             { | ||||
|               type: 'pie', | ||||
|               radius: '50%', | ||||
|               data: data.map(v => { | ||||
|                 return { | ||||
|                   value: v.c, | ||||
|                   name: v.tag | ||||
|                 } | ||||
|               }), | ||||
|               label: { | ||||
|                 normal: { | ||||
|                   textStyle: { | ||||
|                     fontSize: '12' | ||||
|                   }, | ||||
|                   formatter: '{b}: {@2012} ({d}%)' | ||||
|                 } | ||||
|               } | ||||
|             } | ||||
|           ] | ||||
|         } | ||||
|         this.chart2.setOption(option) | ||||
|       } | ||||
|  | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
| @@ -628,10 +469,6 @@ | ||||
|       display: flex; | ||||
|       justify-content: space-between; | ||||
|     } | ||||
|  | ||||
|     .bottom { | ||||
|       display: flex; | ||||
|     } | ||||
|     .mar-b16{ | ||||
|       margin-bottom: 16px; | ||||
|     } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user