dai
3 years ago
5 changed files with 350 additions and 30 deletions
@ -0,0 +1,221 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<el-form |
|||
ref="ref_form" |
|||
:inline="true" |
|||
:model="fmData" |
|||
:rules="dataRule" |
|||
class="form" |
|||
> |
|||
<el-form-item |
|||
label="文章名称" |
|||
prop="title" |
|||
label-width="150px" |
|||
style="display: block" |
|||
> |
|||
<div style="width: 610px"> |
|||
{{ fmData.title || "--" }} |
|||
</div> |
|||
</el-form-item> |
|||
|
|||
<el-form-item |
|||
label="下线网格 " |
|||
prop="gridIdList" |
|||
label-width="150px" |
|||
style="display: block" |
|||
> |
|||
<el-cascader |
|||
v-model="fmData.gridIdList" |
|||
placeholder="请选择" |
|||
:options="gridOptions" |
|||
:props="{ |
|||
multiple: true, |
|||
value: 'value', |
|||
label: 'label', |
|||
children: 'children', |
|||
checkStrictly: false, |
|||
emitPath: false, |
|||
}" |
|||
:show-all-levels="false" |
|||
size="small" |
|||
clearable |
|||
class="item-select" |
|||
style="width: 500px" |
|||
@change="handleChangeCascader" |
|||
> |
|||
</el-cascader> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="div_btn resi-btns"> |
|||
<el-button size="small" @click="handleCancle">取 消</el-button> |
|||
<el-button |
|||
type="primary" |
|||
size="small" |
|||
:disabled="btnDisable" |
|||
@click="handleComfirm" |
|||
>确 定</el-button |
|||
> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
|
|||
export default { |
|||
props: {}, |
|||
|
|||
data() { |
|||
return { |
|||
btnDisable: false, |
|||
|
|||
fmData: { |
|||
articleId: "", |
|||
title: "", |
|||
gridIdList: [], |
|||
}, |
|||
|
|||
gridOptions: [], |
|||
}; |
|||
}, |
|||
components: {}, |
|||
computed: { |
|||
dataRule() { |
|||
return { |
|||
gridIdList: [ |
|||
{ required: true, message: "下线网格不能为空", trigger: "blur" }, |
|||
], |
|||
}; |
|||
}, |
|||
}, |
|||
watch: {}, |
|||
|
|||
async mounted() {}, |
|||
|
|||
methods: { |
|||
handleChangeCascader(e) { |
|||
console.log(e); |
|||
}, |
|||
async initForm({ articleId, title }) { |
|||
this.fmData.articleId = articleId; |
|||
this.fmData.title = title; |
|||
this.fmData.gridIdList = []; |
|||
this.gridOptions = []; |
|||
this.getGridOpitons(articleId); |
|||
}, |
|||
|
|||
async getGridOpitons(articleId) { |
|||
const url = "/gov/voice/article/publishgridlist"; |
|||
const params = { |
|||
articleId, |
|||
}; |
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
if (code === 0) { |
|||
function poll(list) { |
|||
return list.map((item) => { |
|||
return { |
|||
label: item.agencyName, |
|||
value: item.agencyId, |
|||
type: "agency", |
|||
children: [ |
|||
...poll(item.subAgencyGridList), |
|||
...item.gridList.map((grid) => ({ |
|||
label: grid.gridName, |
|||
value: grid.gridId, |
|||
type: "grid", |
|||
})), |
|||
], |
|||
}; |
|||
}); |
|||
} |
|||
let gridOptions = poll([data.agencyGridList]); |
|||
console.log(gridOptions); |
|||
this.gridOptions = gridOptions; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
async handleComfirm() { |
|||
this.btnDisable = true; |
|||
setTimeout(() => { |
|||
this.btnDisable = false; |
|||
}, 5000); |
|||
this.$refs["ref_form"].validate((valid, messageObj) => { |
|||
if (!valid) { |
|||
app.util.validateRule(messageObj); |
|||
this.btnDisable = false; |
|||
} else { |
|||
this.submit(); |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
async submit() { |
|||
let url = "/gov/voice/article/offlinearticle"; |
|||
|
|||
let params = { ...this.fmData }; |
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message({ |
|||
type: "success", |
|||
message: "操作成功", |
|||
}); |
|||
this.$emit("afterOffline"); |
|||
this.btnDisable = false; |
|||
} else { |
|||
this.btnDisable = false; |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
handleCancle() { |
|||
this.$emit("close"); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.item_width_1 { |
|||
width: 500px; |
|||
} |
|||
.item_width_2 { |
|||
width: 400px; |
|||
} |
|||
.item_width_3 { |
|||
margin-left: 10px; |
|||
width: 200px; |
|||
} |
|||
.item_width_4 { |
|||
width: 200px; |
|||
} |
|||
|
|||
.div_map { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.div_btn { |
|||
// display: flex; |
|||
// justify-content: flex-end; |
|||
} |
|||
.el-tabs { |
|||
margin: 0 20px; |
|||
} |
|||
.el-upload__tip { |
|||
color: rgb(155, 155, 155); |
|||
margin: 0; |
|||
} |
|||
.form { |
|||
margin-top: 30px; |
|||
} |
|||
|
|||
.attachement-list { |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue