136 lines
		
	
	
		
			3.9 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			136 lines
		
	
	
		
			3.9 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <ai-detail>
 | |
|     <template slot="title">
 | |
|       <ai-title title="添加二维码" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
 | |
|       </ai-title>
 | |
|     </template>
 | |
|     <template slot="content">
 | |
|       <ai-card title="基本信息">
 | |
|         <template #content>
 | |
|           <el-form class="ai-form" ref="form" :model="form" label-width="110px" label-position="right">
 | |
|             <el-form-item label="地区" style="width: 100%;" prop="codeName">
 | |
|               <span style="color: #666;">{{ form.areaName }}</span>
 | |
|             </el-form-item>
 | |
|             <el-form-item label="二维码名称" prop="codeName" :rules="[{ required: true, message: '请输入二维码名称', trigger: 'blur' }]">
 | |
|               <el-input size="small" placeholder="请输入二维码名称" style="width: 328px;" v-model="form.codeName"></el-input>
 | |
|             </el-form-item>
 | |
|             <el-form-item style="width: 100%;" label="二维码类型" prop="type" :rules="[{ required: true, message: '请选择二维码类型', trigger: 'change' }]">
 | |
|               <el-radio-group v-model="form.type">
 | |
|                 <el-radio label="0">群二维码</el-radio>
 | |
|                 <el-radio label="1">个人二维码</el-radio>
 | |
|               </el-radio-group>
 | |
|             </el-form-item>
 | |
|             <el-form-item label="上传二维码" prop="codeUrl" style="width: 100%;" :rules="[{ required: true, message: '请上传二维码', trigger: 'change' }]">
 | |
|               <ai-uploader :instance="instance" v-model="form.codeUrl" :limit="1"></ai-uploader>
 | |
|             </el-form-item>
 | |
|           </el-form>
 | |
|         </template>
 | |
|       </ai-card>
 | |
|     </template>
 | |
|     <template #footer>
 | |
|       <el-button @click="cancel">取消</el-button>
 | |
|       <el-button type="primary" @click="confirm">提交</el-button>
 | |
|     </template>
 | |
|   </ai-detail>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
|   export default {
 | |
|     name: 'Add',
 | |
| 
 | |
|     props: {
 | |
|       instance: Function,
 | |
|       dict: Object,
 | |
|       params: Object
 | |
|     },
 | |
| 
 | |
|     data () {
 | |
|       return {
 | |
|         info: {},
 | |
|         form: {
 | |
|           areaId: '',
 | |
|           codeName: '',
 | |
|           areaName: '',
 | |
|           code: '',
 | |
|           codeUrl: [],
 | |
|           type: '',
 | |
|         },
 | |
|         id: '',
 | |
|         areaList: []
 | |
|       }
 | |
|     },
 | |
| 
 | |
|     created () {
 | |
|       this.getAreaList()
 | |
| 
 | |
|       if (this.params && this.params.areaId && !this.params.id) {
 | |
|         this.form.areaId = this.params.areaId
 | |
|         this.form.areaName = this.params.areaName
 | |
|       }
 | |
| 
 | |
|       if (this.params && this.params.id) {
 | |
|         this.id = this.params.id
 | |
|         this.getInfo(this.params.id)
 | |
|       }
 | |
|     },
 | |
| 
 | |
|     methods: {
 | |
|       getInfo (id) {
 | |
|         this.instance.post(`/app/appeveryvillagecode/queryDetailById?id=${id}`).then(res => {
 | |
|           if (res.code === 0) {
 | |
|             this.form = res.data
 | |
|             this.form.codeUrl = [{
 | |
|               url: res.data.codeUrl
 | |
|             }]
 | |
|           }
 | |
|         })
 | |
|       },
 | |
| 
 | |
|       getAreaList() {
 | |
|         this.instance.post(`/admin/area/queryAreaByParentId?id=341021104000`).then(res => {
 | |
|           if (res.code == 0) {
 | |
|             this.areaList = res.data.map(item => {
 | |
|               item.dictName = item.name
 | |
|               item.dictValue = item.id
 | |
| 
 | |
|               return item
 | |
|             })
 | |
|           }
 | |
|         })
 | |
|       },
 | |
| 
 | |
|       onClose () {
 | |
|         this.form.explain = ''
 | |
|       },
 | |
| 
 | |
|       confirm () {
 | |
|         this.$refs.form.validate((valid) => {
 | |
|           if (valid) {
 | |
|             this.instance.post(`/app/appeveryvillagecode/addOrUpdate`, {
 | |
|               ...this.form,
 | |
|               codeUrl: this.form.codeUrl[0].url
 | |
|             }).then(res => {
 | |
|               if (res.code == 0) {
 | |
|                 this.$message.success('提交成功')
 | |
|                 setTimeout(() => {
 | |
|                   this.cancel(true)
 | |
|                 }, 600)
 | |
|               }
 | |
|             })
 | |
|           }
 | |
|         })
 | |
|       },
 | |
| 
 | |
|       cancel (isRefresh) {
 | |
|         this.$emit('change', {
 | |
|           type: 'list',
 | |
|           isRefresh: !!isRefresh
 | |
|         })
 | |
|       }
 | |
|     }
 | |
|   }
 | |
| </script>
 | |
| 
 | |
| <style scoped lang="scss">
 | |
| </style>
 |