目录代码整合
This commit is contained in:
		
							
								
								
									
										178
									
								
								packages/conv/AppReportAiWill/components/Setting.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										178
									
								
								packages/conv/AppReportAiWill/components/Setting.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,178 @@ | ||||
| <template> | ||||
|   <ai-list class="notice"> | ||||
|     <template slot="title"> | ||||
|       <ai-title  isShowBack isShowBottomBorder title="事件类型" @onBackClick="cancel(false)"></ai-title> | ||||
|     </template> | ||||
|     <template slot="content"> | ||||
|       <ai-search-bar class="search-bar"> | ||||
|         <template #left> | ||||
|           <el-button size="small" type="primary" icon="iconfont iconAdd" @click="isShowAdd = true">添加事件类型</el-button> | ||||
|         </template> | ||||
|         <template slot="right"> | ||||
|           <el-input | ||||
|             v-model="search.groupName" | ||||
|             class="search-input" | ||||
|             size="small" | ||||
|             v-throttle="() => {search.current = 1, getList()}" | ||||
|             placeholder="请输入事件类型名称" | ||||
|             clearable | ||||
|             @change="getList" | ||||
|             @clear="search.current = 1, search.groupName = '', getList()" | ||||
|             suffix-icon="iconfont iconSearch"> | ||||
|           </el-input> | ||||
|         </template> | ||||
|       </ai-search-bar> | ||||
|       <ai-table | ||||
|         :tableData="tableData" | ||||
|         :col-configs="colConfigs" | ||||
|         :total="total" | ||||
|         style="margin-top: 6px;" | ||||
|         :current.sync="search.current" | ||||
|         :size.sync="search.size" | ||||
|         @getList="getList"> | ||||
|         <el-table-column slot="tags" label="标签"> | ||||
|           <template slot-scope="{ row }"> | ||||
|             <div class="table-tags"> | ||||
|               <el-tag type="info" v-for="(item, index) in row.tags" size="small" :key="index">{{ item }}</el-tag> | ||||
|             </div> | ||||
|           </template> | ||||
|         </el-table-column> | ||||
|         <el-table-column slot="options" width="120px" fixed="right" label="操作" align="center"> | ||||
|           <div class="table-options" slot-scope="{ row }"> | ||||
|             <el-button type="text" @click="edit(row)">编辑</el-button> | ||||
|             <el-button type="text" @click="remove(row.id)">删除</el-button> | ||||
|           </div> | ||||
|         </el-table-column> | ||||
|       </ai-table> | ||||
|       <ai-dialog | ||||
|         :visible.sync="isShowAdd" | ||||
|         width="780px" | ||||
|         height="580px" | ||||
|         :title="id ? '编辑事件类型' : '添加事件类型'" | ||||
|         @close="onClose" | ||||
|         @onConfirm="onConfirm"> | ||||
|         <el-form ref="form" class="ai-form" :model="form" label-width="110px" label-position="right"> | ||||
|           <el-form-item label="事件类型" prop="groupName" style="width: 100%;" :rules="[{ required: true, message: '请输入事件类型名称', trigger: 'blur' }]"> | ||||
|             <el-input size="small" :maxlength="10" show-word-limit placeholder="请输入事件类型名称" v-model="form.groupName"></el-input> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="排序" prop="showIndex" style="width: 100%;" :rules="[{ required: true, message: '请输入排序', trigger: 'blur' }]"> | ||||
|             <el-input-number size="small" v-model="form.showIndex" :min="1" :max="100" label="请输入排序"></el-input-number> | ||||
|           </el-form-item> | ||||
|         </el-form> | ||||
|       </ai-dialog> | ||||
|     </template> | ||||
|   </ai-list> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   import { mapState } from 'vuex' | ||||
|   export default { | ||||
|     name: 'List', | ||||
|  | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object | ||||
|     }, | ||||
|  | ||||
|     data() { | ||||
|       return { | ||||
|         search: { | ||||
|           current: 1, | ||||
|           size: 10, | ||||
|           groupName: '' | ||||
|         }, | ||||
|         form: { | ||||
|           groupName: '', | ||||
|           showIndex: '' | ||||
|         }, | ||||
|         id: '', | ||||
|         isShowAdd: false, | ||||
|         total: 0, | ||||
|         colConfigs: [ | ||||
|           {prop: 'groupName', label: '事件类型', align: 'left'}, | ||||
|           {prop: 'showIndex', label: '排序', align: 'center'}, | ||||
|           {slot: 'options', label: '操作'} | ||||
|         ], | ||||
|         tableData: [] | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     computed: { | ||||
|       ...mapState(['user']) | ||||
|     }, | ||||
|  | ||||
|     mounted() { | ||||
|       this.getList() | ||||
|     }, | ||||
|  | ||||
|     methods: { | ||||
|       getList() { | ||||
|         this.instance.post(`/app/appclapeventgroup/list`, null, { | ||||
|           params: { | ||||
|             ...this.search | ||||
|           } | ||||
|         }).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.tableData = res.data.records | ||||
|             this.total = res.data.total | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       edit (e) { | ||||
|         this.id = e.id | ||||
|         this.form.groupName = e.groupName | ||||
|         this.form.showIndex = '' | ||||
|  | ||||
|         this.$nextTick(() => { | ||||
|           this.isShowAdd = true | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       onClose () { | ||||
|         this.id = '' | ||||
|         this.form.showIndex = '' | ||||
|         this.form.groupName = '' | ||||
|       }, | ||||
|  | ||||
|       onConfirm () { | ||||
|         this.$refs.form.validate((valid) => { | ||||
|           if (valid) { | ||||
|             this.instance.post(`/app/appclapeventgroup/addOrUpdate`, { | ||||
|               ...this.form, | ||||
|               id: this.id || null | ||||
|             }).then(res => { | ||||
|               if (res.code === 0) { | ||||
|                 this.$message.success('添加成功') | ||||
|                 this.isShowAdd = false | ||||
|  | ||||
|                 this.getList() | ||||
|               } | ||||
|             }) | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       cancel (isRefresh) { | ||||
|         this.$emit('change', { | ||||
|           type: 'list', | ||||
|           isRefresh: !!isRefresh | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       remove(id) { | ||||
|         this.$confirm('确定删除该数据?').then(() => { | ||||
|           this.instance.post(`/app/appclapeventgroup/delete?ids=${id}`).then(res => { | ||||
|             if (res.code == 0) { | ||||
|               this.$message.success('删除成功!') | ||||
|               this.getList() | ||||
|             } | ||||
|           }) | ||||
|         }) | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| </style> | ||||
		Reference in New Issue
	
	Block a user