10 changed files with 3115 additions and 3 deletions
@ -0,0 +1,2 @@ |
|||||
|
// 文章一级栏目id 先写死吧
|
||||
|
export const parentCategoryId = "1645734953282990083"; |
@ -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> |
@ -0,0 +1,479 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<base-page |
||||
|
ref="basePage" |
||||
|
:searchParams="searchParams" |
||||
|
:tableParams="tableParams" |
||||
|
:tableUrl="tableUrl" |
||||
|
:addUrl="addUrl" |
||||
|
:editUrl="editUrl" |
||||
|
:delUrl="delUrl" |
||||
|
:editAuth="editAuth" |
||||
|
:delAuth="delAuth" |
||||
|
:infoUrl="infoUrl" |
||||
|
:exportUrl="exportUrl" |
||||
|
:importUrl="importUrl" |
||||
|
:mubanUrl="mubanUrl" |
||||
|
:editParams="editParams" |
||||
|
:editFixedParams="editFixedParams" |
||||
|
:editElseRules="editElseRules" |
||||
|
:editConfig="editConfig" |
||||
|
:editParamsDiv="5" |
||||
|
:infoAuth="() => false" |
||||
|
:formBtnFixed="true" |
||||
|
idName="draftId" |
||||
|
> |
||||
|
<template v-slot:editOperateSup="{ id, formType, info }"> |
||||
|
<el-button |
||||
|
v-if="formType != 'watch' && info.richTextFlag == '1'" |
||||
|
type="warning" |
||||
|
size="small" |
||||
|
:disabled="draftBtnDisable" |
||||
|
@click="handleClickDraft(info)" |
||||
|
>存草稿</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</base-page> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import basePage from "@/views/modules/cpts/base/index"; |
||||
|
import { getItemByIdInCascader, collapse } from "@/utils/cascader"; |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import dateFormat from "dai-js/tools/dateFormat.js"; |
||||
|
import { parentCategoryId } from "./conf"; |
||||
|
|
||||
|
export default { |
||||
|
props: {}, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
draftBtnDisable: false, |
||||
|
|
||||
|
searchParams: [ |
||||
|
{ field: "文章标题", keyName: "title", type: "input" }, |
||||
|
{ |
||||
|
field: "创建时间", |
||||
|
keyName: "createdTime", |
||||
|
type: "date-range", |
||||
|
supKeys: ["startDate", "endDate"], |
||||
|
supValues: ["", ""], |
||||
|
}, |
||||
|
], |
||||
|
|
||||
|
tableParams: [ |
||||
|
{ field: "序号", keyName: "", type: "no" }, |
||||
|
{ field: "文章标题", keyName: "title", type: "text" }, |
||||
|
{ field: "创建时间", keyName: "createdTime", type: "text" }, |
||||
|
], |
||||
|
tableUrl: "/gov/voice/draft/draftListV2", |
||||
|
mubanUrl: "", |
||||
|
importUrl: "", |
||||
|
exportUrl: "", |
||||
|
|
||||
|
addUrl: "", |
||||
|
editUrl: "/gov/voice/article/addOrSaveDraft", |
||||
|
infoUrl: "/gov/voice/draft/detailV2", |
||||
|
delUrl: "/gov/voice/draft/deletedraft", |
||||
|
editAuth(item) { |
||||
|
return true; |
||||
|
}, |
||||
|
delAuth(item) { |
||||
|
return true; |
||||
|
}, |
||||
|
|
||||
|
editParams: [ |
||||
|
{ |
||||
|
field: "所属栏目", |
||||
|
keyName: "tagIds", |
||||
|
type: "select", |
||||
|
value: parentCategoryId, |
||||
|
multiple: true, |
||||
|
optionUrl: `/gov/voice/categoryDict/subCategories?parentCategoryId=${parentCategoryId}`, |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return [ |
||||
|
list.map((item) => ({ |
||||
|
label: item.categoryName, |
||||
|
value: item.id, |
||||
|
})), |
||||
|
]; |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "所属栏目不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标题", |
||||
|
keyName: "title", |
||||
|
type: "input", |
||||
|
maxlength: 50, |
||||
|
editDisabled: true, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "文章标题不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "封面图片", |
||||
|
keyName: "imgArr", |
||||
|
type: "upload", |
||||
|
limit: 1, |
||||
|
listType: "picture-card", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["imgUrlArr", "imgUrl"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type; |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("image") == -1) { |
||||
|
that.$message.error("仅限图片格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "gridIdList", |
||||
|
type: "cascader", |
||||
|
value: [], |
||||
|
supKeys: ["publishRangeDesc"], |
||||
|
supValues: [""], |
||||
|
optionUrl: "/gov/org/customeragency/agencygridtree", |
||||
|
optionUrlParams: { |
||||
|
agencyId: this.$store.state.user.agencyId, |
||||
|
}, |
||||
|
optionList: [], |
||||
|
optionProps: { |
||||
|
multiple: true, |
||||
|
value: "agencyId", |
||||
|
label: "agencyName", |
||||
|
children: "subAgencyList", |
||||
|
checkStrictly: false, |
||||
|
emitPath: false, |
||||
|
}, |
||||
|
optionCook(obj) { |
||||
|
return [obj]; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
console.log("handleChangeFn", vals); |
||||
|
const { optionList } = item; |
||||
|
const optionPlaneList = collapse( |
||||
|
optionList, |
||||
|
"subAgencyList" |
||||
|
); |
||||
|
if (vals.length > 0) { |
||||
|
let selectedList = vals.map( |
||||
|
(v) => |
||||
|
getItemByIdInCascader( |
||||
|
optionPlaneList, |
||||
|
[v], |
||||
|
"agencyId", |
||||
|
"subAgencyList" |
||||
|
)[0] |
||||
|
); |
||||
|
console.log("handleChangeFn", selectedList); |
||||
|
let selectedFilterList = selectedList.filter( |
||||
|
(a) => a.level == "grid" |
||||
|
); |
||||
|
that.fmData[item["keyName"]] = |
||||
|
selectedFilterList.map((a) => a.agencyId); |
||||
|
that.fmData[item["supKeys"][0]] = selectedFilterList |
||||
|
.map((a) => a.agencyName) |
||||
|
.join("、"); |
||||
|
} else { |
||||
|
} |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布范围不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布时间", |
||||
|
keyName: "publishDate", |
||||
|
type: "date", |
||||
|
value: dateFormat(new Date(), "yyyy-MM-dd"), |
||||
|
pickerOptions: { |
||||
|
disabledDate(time) { |
||||
|
return time.getTime() > Date.now(); |
||||
|
}, |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布时间不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布单位", |
||||
|
keyName: "publisher", |
||||
|
type: "select", |
||||
|
optionUrl: "/gov/voice/article/publishagencylist", |
||||
|
optionList: [], |
||||
|
optionType: "group", |
||||
|
supKeys: ["publisherName", "publisherType"], |
||||
|
supValues: ["", ""], |
||||
|
optionCook(data) { |
||||
|
let ret = []; |
||||
|
const { |
||||
|
agencyDeptList, |
||||
|
agencyGridList, |
||||
|
agencyId, |
||||
|
agencyName, |
||||
|
} = data; |
||||
|
if (agencyId) { |
||||
|
ret.push({ |
||||
|
label: "以组织名义", |
||||
|
optionList: [ |
||||
|
{ |
||||
|
label: agencyName, |
||||
|
value: agencyId, |
||||
|
type: "agency", |
||||
|
}, |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyDeptList) && |
||||
|
agencyDeptList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以部门名义", |
||||
|
optionList: [ |
||||
|
...agencyDeptList.map((d) => ({ |
||||
|
label: d.agencyDeptName, |
||||
|
value: d.departmentId, |
||||
|
type: "department", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyGridList) && |
||||
|
agencyGridList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以网格名义", |
||||
|
optionList: [ |
||||
|
...agencyGridList.map((d) => ({ |
||||
|
label: d.agencyGridName, |
||||
|
value: d.gridId, |
||||
|
type: "grid", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
return ret; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
const { optionList } = item; |
||||
|
let opts = []; |
||||
|
optionList.forEach((g) => { |
||||
|
opts = [...opts, ...g.optionList]; |
||||
|
}); |
||||
|
let publisher = opts.find((p) => vals == p.value); |
||||
|
that.fmData[item["supKeys"][0]] = publisher.label; |
||||
|
that.fmData[item["supKeys"][1]] = publisher.type; |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布单位不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标签", |
||||
|
keyName: "tagNameList", |
||||
|
type: "select", |
||||
|
multiple: true, |
||||
|
filterable: true, |
||||
|
allowCreate: true, |
||||
|
optionUrl: "/gov/voice/tag/taglist", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.tagName, |
||||
|
value: item.tagName, |
||||
|
})); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "内容", |
||||
|
keyName: "content", |
||||
|
type: "rich-text", |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "内容不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
// 需要转换一下,后端给的参数不适用 |
||||
|
field: "附件", |
||||
|
keyName: "fileList2", |
||||
|
type: "upload", |
||||
|
limit: 3, |
||||
|
listType: "file", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["fileListArr2", "fileListItem2"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type.toLowerCase(); |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("pdf") == -1) { |
||||
|
that.$message.error("仅限pdf格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "置顶", |
||||
|
keyName: "isTop", |
||||
|
type: "switch", |
||||
|
activeValue: "1", |
||||
|
inactiveValue: "0", |
||||
|
}, |
||||
|
], |
||||
|
editFixedParams: { |
||||
|
type: "article", |
||||
|
}, |
||||
|
editElseRules: {}, |
||||
|
editConfig: { |
||||
|
confirmBtnName: "发布", |
||||
|
cookInfoFn(data) { |
||||
|
if (data.richTextFlag == "0") { |
||||
|
data.content = data.contentList |
||||
|
.map((item) => { |
||||
|
if (item.contentType == "text") { |
||||
|
return `<p>${item.content}</p>`; |
||||
|
} else if (item.contentType == "img") { |
||||
|
return `<img src="${item.content}" style="max-width:100%"></img>`; |
||||
|
} else if (item.contentType == "video") { |
||||
|
return `<video src="${item.content}" style="max-width:100%" controls></video>`; |
||||
|
} else if (item.contentType == "file") { |
||||
|
return `<a src="${item.content}" target="_blank">附件:${item.fileName}</a>`; |
||||
|
} |
||||
|
}) |
||||
|
.join(" "); |
||||
|
} else { |
||||
|
data.content = |
||||
|
Array.isArray(data.contentList) && |
||||
|
data.contentList.length > 0 |
||||
|
? data.contentList[0].content |
||||
|
: ""; |
||||
|
} |
||||
|
if (data.imgUrl) { |
||||
|
data.imgArr = [ |
||||
|
{ |
||||
|
name: "封面", |
||||
|
url: data.imgUrl, |
||||
|
}, |
||||
|
]; |
||||
|
data.imgUrlArr = [data.imgUrl]; |
||||
|
} |
||||
|
data.fileList2 = (data.fileList || []).map((item) => ({ |
||||
|
url: item.content, |
||||
|
name: item.fileName, |
||||
|
size: 0, |
||||
|
type: item.content.split(".").pop(), |
||||
|
format: item.content.split(".").pop(), |
||||
|
})); |
||||
|
|
||||
|
return data; |
||||
|
}, |
||||
|
|
||||
|
beforeSubmit(formType, fmData, that) { |
||||
|
if (fmData.isTop == "1" && !fmData.imgUrl) { |
||||
|
that.$message.error("请上传封面图片"); |
||||
|
return false; |
||||
|
} |
||||
|
fmData.fileList = (fmData.fileList2 || []).map((item) => ({ |
||||
|
content: item.url, |
||||
|
fileName: item.name, |
||||
|
contentType: "file", |
||||
|
})); |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
}, |
||||
|
components: { basePage }, |
||||
|
computed: {}, |
||||
|
watch: {}, |
||||
|
|
||||
|
async mounted() {}, |
||||
|
|
||||
|
methods: { |
||||
|
async handleClickDraft(fmData) { |
||||
|
let url = "/gov/voice/article/addOrSaveDraft"; |
||||
|
let params = { |
||||
|
...fmData, |
||||
|
type: "draft", |
||||
|
}; |
||||
|
params = |
||||
|
this.$refs.basePage.$refs.editForm.cookBeforeSubmit(params); |
||||
|
if (!params.title && !params.content) { |
||||
|
return this.$message.error("标题或内容不能为空"); |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message({ |
||||
|
type: "success", |
||||
|
message: "保存成功", |
||||
|
}); |
||||
|
this.$refs.basePage.handleClose(); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped></style> |
@ -0,0 +1,831 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<base-page |
||||
|
ref="basePage" |
||||
|
:searchParams="searchParams" |
||||
|
:tableParams="tableParams" |
||||
|
:tableUrl="tableUrl" |
||||
|
:addUrl="addUrl" |
||||
|
:editUrl="editUrl" |
||||
|
:delUrl="delUrl" |
||||
|
:editAuth="editAuth" |
||||
|
:delAuth="delAuth" |
||||
|
:infoUrl="infoUrl" |
||||
|
:exportUrl="exportUrl" |
||||
|
:importUrl="importUrl" |
||||
|
:mubanUrl="mubanUrl" |
||||
|
:editParams="editParams" |
||||
|
:editFixedParams="editFixedParams" |
||||
|
:editElseRules="editElseRules" |
||||
|
:editConfig="editConfig" |
||||
|
:editParamsDiv="5" |
||||
|
:editBtnName="(item) => '修改'" |
||||
|
:formBtnFixed="true" |
||||
|
idName="articleId" |
||||
|
> |
||||
|
<template v-slot:editOperateSup="{ id, formType, info }"> |
||||
|
<el-button |
||||
|
v-if="formType == 'add'" |
||||
|
type="warning" |
||||
|
size="small" |
||||
|
:disabled="draftBtnDisable" |
||||
|
@click="handleClickDraft(info)" |
||||
|
>存草稿</el-button |
||||
|
> |
||||
|
</template> |
||||
|
|
||||
|
<template v-slot:listBtnSup="{ item }"> |
||||
|
<el-button |
||||
|
v-if=" |
||||
|
item.statusFlag == 'published' && |
||||
|
item.agencyId == $store.state.user.agencyId |
||||
|
" |
||||
|
@click="handleOfflineShow(item)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
style="color: #666" |
||||
|
>下线</el-button |
||||
|
> |
||||
|
</template> |
||||
|
|
||||
|
<template v-slot:listBtnbefore="{ item }"> |
||||
|
<el-button |
||||
|
v-if="item.isTop == '1'" |
||||
|
v-show="item.statusFlag == 'published'" |
||||
|
@click="handleCancleTopArticle(item, 'cancel_top')" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
style="color: #fe6252" |
||||
|
>取消置顶</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
v-show="item.statusFlag == 'published'" |
||||
|
v-else |
||||
|
@click="handleTopArticle(item, 'top')" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
style="color: #22c1c3" |
||||
|
>置顶</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</base-page> |
||||
|
|
||||
|
<el-dialog |
||||
|
:visible.sync="offlineShowed" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
title="下线" |
||||
|
width="850px" |
||||
|
top="5vh" |
||||
|
class="dialog-h" |
||||
|
@closed="offlineShowed = false" |
||||
|
> |
||||
|
<offline |
||||
|
ref="offlineForm" |
||||
|
@close="offlineShowed = false" |
||||
|
@afterOffline="handleOfflineSuccess" |
||||
|
></offline> |
||||
|
</el-dialog> |
||||
|
<el-dialog |
||||
|
:visible.sync="showAddImage" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
title="上传封面图片" |
||||
|
width="650px" |
||||
|
top="5vh" |
||||
|
class="dialog-h" |
||||
|
@closed="showAddImage = false" |
||||
|
> |
||||
|
<div class="dialog-h-content scroll-h"> |
||||
|
<!-- <span>请先上 传封面图片</span> --> |
||||
|
<el-form |
||||
|
ref="ref_form" |
||||
|
:inline="true" |
||||
|
:model="formData" |
||||
|
class="div_form" |
||||
|
> |
||||
|
<div class="form_flex"> |
||||
|
<div class="form_item"> |
||||
|
<el-form-item |
||||
|
label="" |
||||
|
prop="selImgUrl" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-upload |
||||
|
:headers="$getElUploadHeaders()" |
||||
|
:class="[ |
||||
|
'avatar-uploader', |
||||
|
{ hide: hideUploadBtn }, |
||||
|
]" |
||||
|
ref="uploadPic" |
||||
|
:action="uploadUlr" |
||||
|
list-type="picture-card" |
||||
|
:on-exceed="exceedPic" |
||||
|
:before-upload="beforeAvatarUpload" |
||||
|
:on-remove="removePic" |
||||
|
:file-list="replayImgList" |
||||
|
:on-change="handleEditChange" |
||||
|
:on-success="handleSuccess" |
||||
|
:limit="1" |
||||
|
> |
||||
|
<span class="font-14">选择图片</span> |
||||
|
</el-upload> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
<div class="div_btn"> |
||||
|
<el-button size="small" @click="showAddImage = false" |
||||
|
>取 消</el-button |
||||
|
> |
||||
|
<el-button size="small" type="primary" @click="handleAddImage" |
||||
|
>确 定</el-button |
||||
|
> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import basePage from "@/views/modules/cpts/base/index"; |
||||
|
import { getItemByIdInCascader, collapse } from "@/utils/cascader"; |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import dateFormat from "dai-js/tools/dateFormat.js"; |
||||
|
import nextTick from "dai-js/tools/nextTick"; |
||||
|
import offline from "./cpts/offline"; |
||||
|
import { parentCategoryId } from "./conf"; |
||||
|
|
||||
|
export default { |
||||
|
props: {}, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
offlineShowed: false, |
||||
|
|
||||
|
draftBtnDisable: false, |
||||
|
|
||||
|
searchParams: [ |
||||
|
{ |
||||
|
field: "所属栏目", |
||||
|
keyName: "category", |
||||
|
type: "select", |
||||
|
value: parentCategoryId, |
||||
|
multiple: false, |
||||
|
optionUrl: `/gov/voice/categoryDict/subCategories?parentCategoryId=${parentCategoryId}`, |
||||
|
optionUrlMethod: "get", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return [ |
||||
|
{ |
||||
|
label: "全部", |
||||
|
value: parentCategoryId, |
||||
|
}, |
||||
|
...list.map((item) => ({ |
||||
|
label: item.categoryName, |
||||
|
value: item.id, |
||||
|
})), |
||||
|
]; |
||||
|
}, |
||||
|
}, |
||||
|
{ field: "文章标题", keyName: "title", type: "input" }, |
||||
|
{ |
||||
|
field: "标签", |
||||
|
keyName: "tagIds", |
||||
|
type: "select", |
||||
|
multiple: true, |
||||
|
optionUrl: "/gov/voice/tag/taglist", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.tagName, |
||||
|
value: item.tagId, |
||||
|
})); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "状态", |
||||
|
keyName: "statusFlag", |
||||
|
value: "", |
||||
|
type: "select", |
||||
|
optionUrl: "", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [ |
||||
|
{ |
||||
|
label: "已发布", |
||||
|
value: "published", |
||||
|
}, |
||||
|
{ |
||||
|
label: "已下线", |
||||
|
value: "offline", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "publishRangeIds", |
||||
|
type: "cascader", |
||||
|
optionUrl: "/gov/org/customeragency/agencygridtree", |
||||
|
optionUrlParams: { |
||||
|
agencyId: this.$store.state.user.agencyId, |
||||
|
}, |
||||
|
optionList: [], |
||||
|
optionProps: { |
||||
|
multiple: false, |
||||
|
value: "agencyId", |
||||
|
label: "agencyName", |
||||
|
children: "subAgencyList", |
||||
|
checkStrictly: true, |
||||
|
}, |
||||
|
optionCook(obj) { |
||||
|
return [obj]; |
||||
|
}, |
||||
|
supKeys: ["publishRangeId", "publishRangeType"], |
||||
|
supValues: ["", ""], |
||||
|
handleChangeFn(vals, item) { |
||||
|
const { optionList } = item; |
||||
|
if (vals.length > 0) { |
||||
|
item["supValues"][0] = vals[vals.length - 1]; |
||||
|
item["supValues"][1] = getItemByIdInCascader( |
||||
|
optionList, |
||||
|
vals, |
||||
|
"agencyId", |
||||
|
"subAgencyList" |
||||
|
)[vals.length - 1]["level"]; |
||||
|
item["supValues"][1] = |
||||
|
item["supValues"][1] == "grid" |
||||
|
? "grid" |
||||
|
: "agency"; |
||||
|
} else { |
||||
|
item["supValues"][0] = ""; |
||||
|
item["supValues"][1] = ""; |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布时间", |
||||
|
keyName: "publishTime", |
||||
|
type: "date-range", |
||||
|
supKeys: ["startDate", "endDate"], |
||||
|
supValues: ["", ""], |
||||
|
}, |
||||
|
], |
||||
|
|
||||
|
tableParams: [ |
||||
|
{ field: "序号", keyName: "", type: "no" }, |
||||
|
{ field: "文章标题", keyName: "title", type: "text" }, |
||||
|
{ field: "所属栏目", keyName: "categoryName", type: "text" }, |
||||
|
{ |
||||
|
field: "标签", |
||||
|
keyName: "tagNameList", |
||||
|
type: "array", |
||||
|
arrayDiv: "、", |
||||
|
}, |
||||
|
{ field: "状态", keyName: "statusFlagName", type: "text" }, |
||||
|
{ field: "发布单位", keyName: "publisherName", type: "text" }, |
||||
|
{ field: "发布时间", keyName: "publishDate", type: "text" }, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "publishRangeDesc", |
||||
|
type: "text", |
||||
|
}, |
||||
|
{ field: "置顶", keyName: "isTopName", type: "text" }, |
||||
|
], |
||||
|
tableUrl: "/gov/voice/article/articleListV2", |
||||
|
mubanUrl: "", |
||||
|
importUrl: "", |
||||
|
exportUrl: "", |
||||
|
|
||||
|
addUrl: "/gov/voice/article/addOrSaveDraft", |
||||
|
editUrl: "/gov/voice/article/updateArticle", |
||||
|
infoUrl: "/gov/voice/article/detailV2", |
||||
|
delUrl: "/gov/voice/article/delete批量", |
||||
|
editAuth(item) { |
||||
|
return item.statusFlagName == "已发布"; |
||||
|
}, |
||||
|
delAuth(item) { |
||||
|
return item.statusFlagName == "已下线"; |
||||
|
}, |
||||
|
|
||||
|
editParams: [ |
||||
|
{ |
||||
|
field: "所属栏目", |
||||
|
keyName: "category", |
||||
|
type: "select", |
||||
|
value: "", |
||||
|
multiple: false, |
||||
|
optionUrl: `/gov/voice/categoryDict/subCategories?parentCategoryId=${parentCategoryId}`, |
||||
|
optionUrlMethod: "get", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.categoryName, |
||||
|
value: item.id, |
||||
|
})); |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "所属栏目不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标题", |
||||
|
keyName: "title", |
||||
|
type: "input", |
||||
|
maxlength: 50, |
||||
|
editDisabled: true, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "文章标题不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "封面图片", |
||||
|
keyName: "imgArr", |
||||
|
type: "upload", |
||||
|
limit: 1, |
||||
|
listType: "picture-card", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["imgUrlArr", "imgUrl"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type; |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("image") == -1) { |
||||
|
that.$message.error("仅限图片格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "gridIdList", |
||||
|
type: "cascader", |
||||
|
value: () => [], |
||||
|
supKeys: ["publishRangeDesc"], |
||||
|
supValues: [""], |
||||
|
optionUrl: "/gov/org/customeragency/agencygridtree", |
||||
|
optionUrlParams: { |
||||
|
agencyId: this.$store.state.user.agencyId, |
||||
|
}, |
||||
|
optionList: [], |
||||
|
optionProps: { |
||||
|
multiple: true, |
||||
|
value: "agencyId", |
||||
|
label: "agencyName", |
||||
|
children: "subAgencyList", |
||||
|
checkStrictly: false, |
||||
|
emitPath: false, |
||||
|
}, |
||||
|
optionCook(obj) { |
||||
|
return [obj]; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
console.log("handleChangeFn", vals); |
||||
|
const { optionList } = item; |
||||
|
const optionPlaneList = collapse( |
||||
|
optionList, |
||||
|
"subAgencyList" |
||||
|
); |
||||
|
if (vals.length > 0) { |
||||
|
let selectedList = vals.map( |
||||
|
(v) => |
||||
|
getItemByIdInCascader( |
||||
|
optionPlaneList, |
||||
|
[v], |
||||
|
"agencyId", |
||||
|
"subAgencyList" |
||||
|
)[0] |
||||
|
); |
||||
|
console.log("handleChangeFn", selectedList); |
||||
|
let selectedFilterList = selectedList.filter( |
||||
|
(a) => a.level == "grid" |
||||
|
); |
||||
|
that.fmData[item["keyName"]] = |
||||
|
selectedFilterList.map((a) => a.agencyId); |
||||
|
that.fmData[item["supKeys"][0]] = selectedFilterList |
||||
|
.map((a) => a.agencyName) |
||||
|
.join("、"); |
||||
|
} else { |
||||
|
} |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布范围不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布时间", |
||||
|
keyName: "publishDate", |
||||
|
type: "date", |
||||
|
value: dateFormat(new Date(), "yyyy-MM-dd"), |
||||
|
pickerOptions: { |
||||
|
disabledDate(time) { |
||||
|
return time.getTime() > Date.now(); |
||||
|
}, |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布时间不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布单位", |
||||
|
keyName: "publisher", |
||||
|
type: "select", |
||||
|
optionUrl: "/gov/voice/article/publishagencylist", |
||||
|
optionList: [], |
||||
|
optionType: "group", |
||||
|
supKeys: ["publisherName", "publisherType"], |
||||
|
supValues: ["", ""], |
||||
|
optionCook(data) { |
||||
|
let ret = []; |
||||
|
const { |
||||
|
agencyDeptList, |
||||
|
agencyGridList, |
||||
|
agencyId, |
||||
|
agencyName, |
||||
|
} = data; |
||||
|
if (agencyId) { |
||||
|
ret.push({ |
||||
|
label: "以组织名义", |
||||
|
optionList: [ |
||||
|
{ |
||||
|
label: agencyName, |
||||
|
value: agencyId, |
||||
|
type: "agency", |
||||
|
}, |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyDeptList) && |
||||
|
agencyDeptList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以部门名义", |
||||
|
optionList: [ |
||||
|
...agencyDeptList.map((d) => ({ |
||||
|
label: d.agencyDeptName, |
||||
|
value: d.departmentId, |
||||
|
type: "department", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyGridList) && |
||||
|
agencyGridList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以网格名义", |
||||
|
optionList: [ |
||||
|
...agencyGridList.map((d) => ({ |
||||
|
label: d.agencyGridName, |
||||
|
value: d.gridId, |
||||
|
type: "grid", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
return ret; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
const { optionList } = item; |
||||
|
let opts = []; |
||||
|
optionList.forEach((g) => { |
||||
|
opts = [...opts, ...g.optionList]; |
||||
|
}); |
||||
|
let publisher = opts.find((p) => vals == p.value); |
||||
|
that.fmData[item["supKeys"][0]] = publisher.label; |
||||
|
that.fmData[item["supKeys"][1]] = publisher.type; |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布单位不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标签", |
||||
|
keyName: "tagNameList", |
||||
|
type: "select", |
||||
|
multiple: true, |
||||
|
filterable: true, |
||||
|
allowCreate: true, |
||||
|
optionUrl: "/gov/voice/tag/taglist", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.tagName, |
||||
|
value: item.tagName, |
||||
|
})); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "内容", |
||||
|
keyName: "content", |
||||
|
type: "rich-text", |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "内容不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
// 需要转换一下,后端给的参数不适用 |
||||
|
field: "附件", |
||||
|
keyName: "fileList2", |
||||
|
type: "upload", |
||||
|
limit: 3, |
||||
|
listType: "file", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["fileListArr2", "fileListItem2"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type.toLowerCase(); |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("pdf") == -1) { |
||||
|
that.$message.error("仅限pdf格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "置顶", |
||||
|
keyName: "isTop", |
||||
|
type: "switch", |
||||
|
activeValue: "1", |
||||
|
inactiveValue: "0", |
||||
|
}, |
||||
|
], |
||||
|
editFixedParams: { |
||||
|
type: "article", |
||||
|
}, |
||||
|
editElseRules: {}, |
||||
|
editConfig: { |
||||
|
confirmBtnName: "发布", |
||||
|
cookInfoFn(data) { |
||||
|
if (data.richTextFlag == "0") { |
||||
|
data.content = data.contentList |
||||
|
.map((item) => { |
||||
|
if (item.contentType == "text") { |
||||
|
return `<p>${item.content}</p>`; |
||||
|
} else if (item.contentType == "img") { |
||||
|
return `<img src="${item.content}" style="max-width:100%"></img>`; |
||||
|
} else if (item.contentType == "video") { |
||||
|
return `<video src="${item.content}" style="max-width:100%" controls></video>`; |
||||
|
} else if (item.contentType == "file") { |
||||
|
return `<a src="${item.content}" target="_blank">附件:${item.fileName}</a>`; |
||||
|
} |
||||
|
}) |
||||
|
.join(" "); |
||||
|
} else { |
||||
|
data.content = data.contentList[0].content; |
||||
|
} |
||||
|
if (data.imgUrl) { |
||||
|
data.imgArr = [ |
||||
|
{ |
||||
|
name: "封面", |
||||
|
url: data.imgUrl, |
||||
|
}, |
||||
|
]; |
||||
|
data.imgUrlArr = [data.imgUrl]; |
||||
|
} |
||||
|
data.fileList2 = (data.fileList || []).map((item) => ({ |
||||
|
url: item.content, |
||||
|
name: item.fileName, |
||||
|
size: 0, |
||||
|
type: item.content.split(".").pop(), |
||||
|
format: item.content.split(".").pop(), |
||||
|
})); |
||||
|
|
||||
|
return data; |
||||
|
}, |
||||
|
|
||||
|
beforeSubmit(formType, fmData, that) { |
||||
|
if (fmData.isTop == "1" && !fmData.imgUrl) { |
||||
|
that.$message.error("请上传封面图片"); |
||||
|
return false; |
||||
|
} |
||||
|
|
||||
|
fmData.fileList = (fmData.fileList2 || []).map((item) => ({ |
||||
|
content: item.url, |
||||
|
fileName: item.name, |
||||
|
contentType: "file", |
||||
|
})); |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
|
||||
|
formData: {}, |
||||
|
showAddImage: false, |
||||
|
uploadUlr: |
||||
|
window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile", |
||||
|
replayImgList: [], |
||||
|
hideUploadBtn: false, |
||||
|
selType: "top", |
||||
|
selArticleId: "", |
||||
|
selImgUrl: "", |
||||
|
}; |
||||
|
}, |
||||
|
components: { basePage, offline }, |
||||
|
computed: {}, |
||||
|
watch: {}, |
||||
|
|
||||
|
async mounted() {}, |
||||
|
|
||||
|
methods: { |
||||
|
async handleOfflineShow(item) { |
||||
|
console.log(item); |
||||
|
this.offlineShowed = true; |
||||
|
await nextTick(100); |
||||
|
this.$refs.offlineForm.initForm(item); |
||||
|
}, |
||||
|
|
||||
|
async handleAddImage() { |
||||
|
console.log("formData", this.formData); |
||||
|
this.topArticle(); |
||||
|
}, |
||||
|
async handleCancleTopArticle(item, type) { |
||||
|
this.selType = type; |
||||
|
this.selArticleId = item.articleId; |
||||
|
await this.topArticle(); |
||||
|
}, |
||||
|
|
||||
|
async handleTopArticle(item, type) { |
||||
|
this.selType = type; |
||||
|
this.selArticleId = item.articleId; |
||||
|
|
||||
|
let hasImage = await this.isHasImage(); |
||||
|
|
||||
|
if (hasImage === "refrsh") { |
||||
|
this.$message.error("请求失败,请重新尝试"); |
||||
|
} else if (hasImage === "no") { |
||||
|
// this.$message.info("请先上传封面图片"); |
||||
|
this.showAddImage = true; |
||||
|
} else { |
||||
|
await this.topArticle(); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async isHasImage() { |
||||
|
const url = "/gov/voice/article/detailV2"; |
||||
|
const { tableData } = this; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
articleId: this.selArticleId, |
||||
|
}); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
// this.formData = data |
||||
|
if (data.imgUrl) { |
||||
|
return "has"; |
||||
|
} else { |
||||
|
return "no"; |
||||
|
} |
||||
|
} else { |
||||
|
return "refrsh"; |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async topArticle() { |
||||
|
const url = "/gov/voice/article/topArticle"; |
||||
|
const { tableData } = this; |
||||
|
let params = { |
||||
|
articleId: this.selArticleId, |
||||
|
type: this.selType, |
||||
|
}; |
||||
|
if (this.selImgUrl) { |
||||
|
params.imgUrl = this.selImgUrl; |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message.success("操作成功!"); |
||||
|
this.showAddImage = false; |
||||
|
this.$refs.basePage.refresh(); |
||||
|
} else { |
||||
|
this.$message.success("操作失败!"); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
removePic(file, fileList) { |
||||
|
this.selImgUrl = ""; |
||||
|
this.replayImgList = []; |
||||
|
this.hideUploadBtn = fileList.length >= 1; |
||||
|
}, |
||||
|
// 最多上传3张图,超过时隐藏上传按钮 |
||||
|
handleEditChange(file, fileList) { |
||||
|
this.hideUploadBtn = fileList.length >= 1; |
||||
|
}, |
||||
|
exceedPic() { |
||||
|
this.$message.warning("只能上传1张封面图"); |
||||
|
}, |
||||
|
beforeAvatarUpload(file) { |
||||
|
const isJPG = file.type === "image/jpeg"; |
||||
|
const isLt2M = file.size / 1024 / 1024 < 10; |
||||
|
|
||||
|
if (!isLt2M) { |
||||
|
this.$message.error("上传图片大小不能超过 10MB!"); |
||||
|
} |
||||
|
return isLt2M; |
||||
|
}, |
||||
|
handleSuccess(response, file, fileList) { |
||||
|
this.replayImgList.push(file); |
||||
|
this.selImgUrl = response.data.url; |
||||
|
}, |
||||
|
|
||||
|
handleOfflineSuccess() { |
||||
|
this.$refs.basePage.refresh(); |
||||
|
this.offlineShowed = false; |
||||
|
}, |
||||
|
|
||||
|
async handleClickDraft(fmData) { |
||||
|
let url = this.addUrl; |
||||
|
let params = { |
||||
|
...fmData, |
||||
|
type: "draft", |
||||
|
}; |
||||
|
params = |
||||
|
this.$refs.basePage.$refs.editForm.cookBeforeSubmit(params); |
||||
|
if (!params.title && !params.content) { |
||||
|
return this.$message.error("标题或内容不能为空"); |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message({ |
||||
|
type: "success", |
||||
|
message: "保存成功", |
||||
|
}); |
||||
|
this.$refs.basePage.handleClose(); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
@import "@/assets/scss/modules/management/form-main.scss"; |
||||
|
|
||||
|
.avatar-uploader { |
||||
|
margin: 0 0 0 20px; |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
.hide { |
||||
|
.el-upload--picture-card { |
||||
|
display: none !important; |
||||
|
} |
||||
|
} |
||||
|
</style> |
@ -0,0 +1,2 @@ |
|||||
|
// 文章一级栏目id 先写死吧
|
||||
|
export const parentCategoryId = "1645734953282990084"; |
@ -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> |
@ -0,0 +1,479 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<base-page |
||||
|
ref="basePage" |
||||
|
:searchParams="searchParams" |
||||
|
:tableParams="tableParams" |
||||
|
:tableUrl="tableUrl" |
||||
|
:addUrl="addUrl" |
||||
|
:editUrl="editUrl" |
||||
|
:delUrl="delUrl" |
||||
|
:editAuth="editAuth" |
||||
|
:delAuth="delAuth" |
||||
|
:infoUrl="infoUrl" |
||||
|
:exportUrl="exportUrl" |
||||
|
:importUrl="importUrl" |
||||
|
:mubanUrl="mubanUrl" |
||||
|
:editParams="editParams" |
||||
|
:editFixedParams="editFixedParams" |
||||
|
:editElseRules="editElseRules" |
||||
|
:editConfig="editConfig" |
||||
|
:editParamsDiv="5" |
||||
|
:infoAuth="() => false" |
||||
|
:formBtnFixed="true" |
||||
|
idName="draftId" |
||||
|
> |
||||
|
<template v-slot:editOperateSup="{ id, formType, info }"> |
||||
|
<el-button |
||||
|
v-if="formType != 'watch' && info.richTextFlag == '1'" |
||||
|
type="warning" |
||||
|
size="small" |
||||
|
:disabled="draftBtnDisable" |
||||
|
@click="handleClickDraft(info)" |
||||
|
>存草稿</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</base-page> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import basePage from "@/views/modules/cpts/base/index"; |
||||
|
import { getItemByIdInCascader, collapse } from "@/utils/cascader"; |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import dateFormat from "dai-js/tools/dateFormat.js"; |
||||
|
import { parentCategoryId } from "./conf"; |
||||
|
|
||||
|
export default { |
||||
|
props: {}, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
draftBtnDisable: false, |
||||
|
|
||||
|
searchParams: [ |
||||
|
{ field: "文章标题", keyName: "title", type: "input" }, |
||||
|
{ |
||||
|
field: "创建时间", |
||||
|
keyName: "createdTime", |
||||
|
type: "date-range", |
||||
|
supKeys: ["startDate", "endDate"], |
||||
|
supValues: ["", ""], |
||||
|
}, |
||||
|
], |
||||
|
|
||||
|
tableParams: [ |
||||
|
{ field: "序号", keyName: "", type: "no" }, |
||||
|
{ field: "文章标题", keyName: "title", type: "text" }, |
||||
|
{ field: "创建时间", keyName: "createdTime", type: "text" }, |
||||
|
], |
||||
|
tableUrl: "/gov/voice/draft/draftListV2", |
||||
|
mubanUrl: "", |
||||
|
importUrl: "", |
||||
|
exportUrl: "", |
||||
|
|
||||
|
addUrl: "", |
||||
|
editUrl: "/gov/voice/article/addOrSaveDraft", |
||||
|
infoUrl: "/gov/voice/draft/detailV2", |
||||
|
delUrl: "/gov/voice/draft/deletedraft", |
||||
|
editAuth(item) { |
||||
|
return true; |
||||
|
}, |
||||
|
delAuth(item) { |
||||
|
return true; |
||||
|
}, |
||||
|
|
||||
|
editParams: [ |
||||
|
{ |
||||
|
field: "所属栏目", |
||||
|
keyName: "tagIds", |
||||
|
type: "select", |
||||
|
value: parentCategoryId, |
||||
|
multiple: true, |
||||
|
optionUrl: `/gov/voice/categoryDict/subCategories?parentCategoryId=${parentCategoryId}`, |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return [ |
||||
|
list.map((item) => ({ |
||||
|
label: item.categoryName, |
||||
|
value: item.id, |
||||
|
})), |
||||
|
]; |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "所属栏目不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标题", |
||||
|
keyName: "title", |
||||
|
type: "input", |
||||
|
maxlength: 50, |
||||
|
editDisabled: true, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "文章标题不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "封面图片", |
||||
|
keyName: "imgArr", |
||||
|
type: "upload", |
||||
|
limit: 1, |
||||
|
listType: "picture-card", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["imgUrlArr", "imgUrl"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type; |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("image") == -1) { |
||||
|
that.$message.error("仅限图片格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "gridIdList", |
||||
|
type: "cascader", |
||||
|
value: [], |
||||
|
supKeys: ["publishRangeDesc"], |
||||
|
supValues: [""], |
||||
|
optionUrl: "/gov/org/customeragency/agencygridtree", |
||||
|
optionUrlParams: { |
||||
|
agencyId: this.$store.state.user.agencyId, |
||||
|
}, |
||||
|
optionList: [], |
||||
|
optionProps: { |
||||
|
multiple: true, |
||||
|
value: "agencyId", |
||||
|
label: "agencyName", |
||||
|
children: "subAgencyList", |
||||
|
checkStrictly: false, |
||||
|
emitPath: false, |
||||
|
}, |
||||
|
optionCook(obj) { |
||||
|
return [obj]; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
console.log("handleChangeFn", vals); |
||||
|
const { optionList } = item; |
||||
|
const optionPlaneList = collapse( |
||||
|
optionList, |
||||
|
"subAgencyList" |
||||
|
); |
||||
|
if (vals.length > 0) { |
||||
|
let selectedList = vals.map( |
||||
|
(v) => |
||||
|
getItemByIdInCascader( |
||||
|
optionPlaneList, |
||||
|
[v], |
||||
|
"agencyId", |
||||
|
"subAgencyList" |
||||
|
)[0] |
||||
|
); |
||||
|
console.log("handleChangeFn", selectedList); |
||||
|
let selectedFilterList = selectedList.filter( |
||||
|
(a) => a.level == "grid" |
||||
|
); |
||||
|
that.fmData[item["keyName"]] = |
||||
|
selectedFilterList.map((a) => a.agencyId); |
||||
|
that.fmData[item["supKeys"][0]] = selectedFilterList |
||||
|
.map((a) => a.agencyName) |
||||
|
.join("、"); |
||||
|
} else { |
||||
|
} |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布范围不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布时间", |
||||
|
keyName: "publishDate", |
||||
|
type: "date", |
||||
|
value: dateFormat(new Date(), "yyyy-MM-dd"), |
||||
|
pickerOptions: { |
||||
|
disabledDate(time) { |
||||
|
return time.getTime() > Date.now(); |
||||
|
}, |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布时间不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布单位", |
||||
|
keyName: "publisher", |
||||
|
type: "select", |
||||
|
optionUrl: "/gov/voice/article/publishagencylist", |
||||
|
optionList: [], |
||||
|
optionType: "group", |
||||
|
supKeys: ["publisherName", "publisherType"], |
||||
|
supValues: ["", ""], |
||||
|
optionCook(data) { |
||||
|
let ret = []; |
||||
|
const { |
||||
|
agencyDeptList, |
||||
|
agencyGridList, |
||||
|
agencyId, |
||||
|
agencyName, |
||||
|
} = data; |
||||
|
if (agencyId) { |
||||
|
ret.push({ |
||||
|
label: "以组织名义", |
||||
|
optionList: [ |
||||
|
{ |
||||
|
label: agencyName, |
||||
|
value: agencyId, |
||||
|
type: "agency", |
||||
|
}, |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyDeptList) && |
||||
|
agencyDeptList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以部门名义", |
||||
|
optionList: [ |
||||
|
...agencyDeptList.map((d) => ({ |
||||
|
label: d.agencyDeptName, |
||||
|
value: d.departmentId, |
||||
|
type: "department", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyGridList) && |
||||
|
agencyGridList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以网格名义", |
||||
|
optionList: [ |
||||
|
...agencyGridList.map((d) => ({ |
||||
|
label: d.agencyGridName, |
||||
|
value: d.gridId, |
||||
|
type: "grid", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
return ret; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
const { optionList } = item; |
||||
|
let opts = []; |
||||
|
optionList.forEach((g) => { |
||||
|
opts = [...opts, ...g.optionList]; |
||||
|
}); |
||||
|
let publisher = opts.find((p) => vals == p.value); |
||||
|
that.fmData[item["supKeys"][0]] = publisher.label; |
||||
|
that.fmData[item["supKeys"][1]] = publisher.type; |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布单位不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标签", |
||||
|
keyName: "tagNameList", |
||||
|
type: "select", |
||||
|
multiple: true, |
||||
|
filterable: true, |
||||
|
allowCreate: true, |
||||
|
optionUrl: "/gov/voice/tag/taglist", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.tagName, |
||||
|
value: item.tagName, |
||||
|
})); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "内容", |
||||
|
keyName: "content", |
||||
|
type: "rich-text", |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "内容不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
// 需要转换一下,后端给的参数不适用 |
||||
|
field: "附件", |
||||
|
keyName: "fileList2", |
||||
|
type: "upload", |
||||
|
limit: 3, |
||||
|
listType: "file", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["fileListArr2", "fileListItem2"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type.toLowerCase(); |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("pdf") == -1) { |
||||
|
that.$message.error("仅限pdf格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "置顶", |
||||
|
keyName: "isTop", |
||||
|
type: "switch", |
||||
|
activeValue: "1", |
||||
|
inactiveValue: "0", |
||||
|
}, |
||||
|
], |
||||
|
editFixedParams: { |
||||
|
type: "article", |
||||
|
}, |
||||
|
editElseRules: {}, |
||||
|
editConfig: { |
||||
|
confirmBtnName: "发布", |
||||
|
cookInfoFn(data) { |
||||
|
if (data.richTextFlag == "0") { |
||||
|
data.content = data.contentList |
||||
|
.map((item) => { |
||||
|
if (item.contentType == "text") { |
||||
|
return `<p>${item.content}</p>`; |
||||
|
} else if (item.contentType == "img") { |
||||
|
return `<img src="${item.content}" style="max-width:100%"></img>`; |
||||
|
} else if (item.contentType == "video") { |
||||
|
return `<video src="${item.content}" style="max-width:100%" controls></video>`; |
||||
|
} else if (item.contentType == "file") { |
||||
|
return `<a src="${item.content}" target="_blank">附件:${item.fileName}</a>`; |
||||
|
} |
||||
|
}) |
||||
|
.join(" "); |
||||
|
} else { |
||||
|
data.content = |
||||
|
Array.isArray(data.contentList) && |
||||
|
data.contentList.length > 0 |
||||
|
? data.contentList[0].content |
||||
|
: ""; |
||||
|
} |
||||
|
if (data.imgUrl) { |
||||
|
data.imgArr = [ |
||||
|
{ |
||||
|
name: "封面", |
||||
|
url: data.imgUrl, |
||||
|
}, |
||||
|
]; |
||||
|
data.imgUrlArr = [data.imgUrl]; |
||||
|
} |
||||
|
data.fileList2 = (data.fileList || []).map((item) => ({ |
||||
|
url: item.content, |
||||
|
name: item.fileName, |
||||
|
size: 0, |
||||
|
type: item.content.split(".").pop(), |
||||
|
format: item.content.split(".").pop(), |
||||
|
})); |
||||
|
|
||||
|
return data; |
||||
|
}, |
||||
|
|
||||
|
beforeSubmit(formType, fmData, that) { |
||||
|
if (fmData.isTop == "1" && !fmData.imgUrl) { |
||||
|
that.$message.error("请上传封面图片"); |
||||
|
return false; |
||||
|
} |
||||
|
fmData.fileList = (fmData.fileList2 || []).map((item) => ({ |
||||
|
content: item.url, |
||||
|
fileName: item.name, |
||||
|
contentType: "file", |
||||
|
})); |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
}, |
||||
|
components: { basePage }, |
||||
|
computed: {}, |
||||
|
watch: {}, |
||||
|
|
||||
|
async mounted() {}, |
||||
|
|
||||
|
methods: { |
||||
|
async handleClickDraft(fmData) { |
||||
|
let url = "/gov/voice/article/addOrSaveDraft"; |
||||
|
let params = { |
||||
|
...fmData, |
||||
|
type: "draft", |
||||
|
}; |
||||
|
params = |
||||
|
this.$refs.basePage.$refs.editForm.cookBeforeSubmit(params); |
||||
|
if (!params.title && !params.content) { |
||||
|
return this.$message.error("标题或内容不能为空"); |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message({ |
||||
|
type: "success", |
||||
|
message: "保存成功", |
||||
|
}); |
||||
|
this.$refs.basePage.handleClose(); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped></style> |
@ -0,0 +1,831 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<base-page |
||||
|
ref="basePage" |
||||
|
:searchParams="searchParams" |
||||
|
:tableParams="tableParams" |
||||
|
:tableUrl="tableUrl" |
||||
|
:addUrl="addUrl" |
||||
|
:editUrl="editUrl" |
||||
|
:delUrl="delUrl" |
||||
|
:editAuth="editAuth" |
||||
|
:delAuth="delAuth" |
||||
|
:infoUrl="infoUrl" |
||||
|
:exportUrl="exportUrl" |
||||
|
:importUrl="importUrl" |
||||
|
:mubanUrl="mubanUrl" |
||||
|
:editParams="editParams" |
||||
|
:editFixedParams="editFixedParams" |
||||
|
:editElseRules="editElseRules" |
||||
|
:editConfig="editConfig" |
||||
|
:editParamsDiv="5" |
||||
|
:editBtnName="(item) => '修改'" |
||||
|
:formBtnFixed="true" |
||||
|
idName="articleId" |
||||
|
> |
||||
|
<template v-slot:editOperateSup="{ id, formType, info }"> |
||||
|
<el-button |
||||
|
v-if="formType == 'add'" |
||||
|
type="warning" |
||||
|
size="small" |
||||
|
:disabled="draftBtnDisable" |
||||
|
@click="handleClickDraft(info)" |
||||
|
>存草稿</el-button |
||||
|
> |
||||
|
</template> |
||||
|
|
||||
|
<template v-slot:listBtnSup="{ item }"> |
||||
|
<el-button |
||||
|
v-if=" |
||||
|
item.statusFlag == 'published' && |
||||
|
item.agencyId == $store.state.user.agencyId |
||||
|
" |
||||
|
@click="handleOfflineShow(item)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
style="color: #666" |
||||
|
>下线</el-button |
||||
|
> |
||||
|
</template> |
||||
|
|
||||
|
<template v-slot:listBtnbefore="{ item }"> |
||||
|
<el-button |
||||
|
v-if="item.isTop == '1'" |
||||
|
v-show="item.statusFlag == 'published'" |
||||
|
@click="handleCancleTopArticle(item, 'cancel_top')" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
style="color: #fe6252" |
||||
|
>取消置顶</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
v-show="item.statusFlag == 'published'" |
||||
|
v-else |
||||
|
@click="handleTopArticle(item, 'top')" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
style="color: #22c1c3" |
||||
|
>置顶</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</base-page> |
||||
|
|
||||
|
<el-dialog |
||||
|
:visible.sync="offlineShowed" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
title="下线" |
||||
|
width="850px" |
||||
|
top="5vh" |
||||
|
class="dialog-h" |
||||
|
@closed="offlineShowed = false" |
||||
|
> |
||||
|
<offline |
||||
|
ref="offlineForm" |
||||
|
@close="offlineShowed = false" |
||||
|
@afterOffline="handleOfflineSuccess" |
||||
|
></offline> |
||||
|
</el-dialog> |
||||
|
<el-dialog |
||||
|
:visible.sync="showAddImage" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
title="上传封面图片" |
||||
|
width="650px" |
||||
|
top="5vh" |
||||
|
class="dialog-h" |
||||
|
@closed="showAddImage = false" |
||||
|
> |
||||
|
<div class="dialog-h-content scroll-h"> |
||||
|
<!-- <span>请先上 传封面图片</span> --> |
||||
|
<el-form |
||||
|
ref="ref_form" |
||||
|
:inline="true" |
||||
|
:model="formData" |
||||
|
class="div_form" |
||||
|
> |
||||
|
<div class="form_flex"> |
||||
|
<div class="form_item"> |
||||
|
<el-form-item |
||||
|
label="" |
||||
|
prop="selImgUrl" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-upload |
||||
|
:headers="$getElUploadHeaders()" |
||||
|
:class="[ |
||||
|
'avatar-uploader', |
||||
|
{ hide: hideUploadBtn }, |
||||
|
]" |
||||
|
ref="uploadPic" |
||||
|
:action="uploadUlr" |
||||
|
list-type="picture-card" |
||||
|
:on-exceed="exceedPic" |
||||
|
:before-upload="beforeAvatarUpload" |
||||
|
:on-remove="removePic" |
||||
|
:file-list="replayImgList" |
||||
|
:on-change="handleEditChange" |
||||
|
:on-success="handleSuccess" |
||||
|
:limit="1" |
||||
|
> |
||||
|
<span class="font-14">选择图片</span> |
||||
|
</el-upload> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
<div class="div_btn"> |
||||
|
<el-button size="small" @click="showAddImage = false" |
||||
|
>取 消</el-button |
||||
|
> |
||||
|
<el-button size="small" type="primary" @click="handleAddImage" |
||||
|
>确 定</el-button |
||||
|
> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import basePage from "@/views/modules/cpts/base/index"; |
||||
|
import { getItemByIdInCascader, collapse } from "@/utils/cascader"; |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import dateFormat from "dai-js/tools/dateFormat.js"; |
||||
|
import nextTick from "dai-js/tools/nextTick"; |
||||
|
import offline from "./cpts/offline"; |
||||
|
import { parentCategoryId } from "./conf"; |
||||
|
|
||||
|
export default { |
||||
|
props: {}, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
offlineShowed: false, |
||||
|
|
||||
|
draftBtnDisable: false, |
||||
|
|
||||
|
searchParams: [ |
||||
|
{ |
||||
|
field: "所属栏目", |
||||
|
keyName: "category", |
||||
|
type: "select", |
||||
|
value: parentCategoryId, |
||||
|
multiple: false, |
||||
|
optionUrl: `/gov/voice/categoryDict/subCategories?parentCategoryId=${parentCategoryId}`, |
||||
|
optionUrlMethod: "get", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return [ |
||||
|
{ |
||||
|
label: "全部", |
||||
|
value: parentCategoryId, |
||||
|
}, |
||||
|
...list.map((item) => ({ |
||||
|
label: item.categoryName, |
||||
|
value: item.id, |
||||
|
})), |
||||
|
]; |
||||
|
}, |
||||
|
}, |
||||
|
{ field: "文章标题", keyName: "title", type: "input" }, |
||||
|
{ |
||||
|
field: "标签", |
||||
|
keyName: "tagIds", |
||||
|
type: "select", |
||||
|
multiple: true, |
||||
|
optionUrl: "/gov/voice/tag/taglist", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.tagName, |
||||
|
value: item.tagId, |
||||
|
})); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "状态", |
||||
|
keyName: "statusFlag", |
||||
|
value: "", |
||||
|
type: "select", |
||||
|
optionUrl: "", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [ |
||||
|
{ |
||||
|
label: "已发布", |
||||
|
value: "published", |
||||
|
}, |
||||
|
{ |
||||
|
label: "已下线", |
||||
|
value: "offline", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "publishRangeIds", |
||||
|
type: "cascader", |
||||
|
optionUrl: "/gov/org/customeragency/agencygridtree", |
||||
|
optionUrlParams: { |
||||
|
agencyId: this.$store.state.user.agencyId, |
||||
|
}, |
||||
|
optionList: [], |
||||
|
optionProps: { |
||||
|
multiple: false, |
||||
|
value: "agencyId", |
||||
|
label: "agencyName", |
||||
|
children: "subAgencyList", |
||||
|
checkStrictly: true, |
||||
|
}, |
||||
|
optionCook(obj) { |
||||
|
return [obj]; |
||||
|
}, |
||||
|
supKeys: ["publishRangeId", "publishRangeType"], |
||||
|
supValues: ["", ""], |
||||
|
handleChangeFn(vals, item) { |
||||
|
const { optionList } = item; |
||||
|
if (vals.length > 0) { |
||||
|
item["supValues"][0] = vals[vals.length - 1]; |
||||
|
item["supValues"][1] = getItemByIdInCascader( |
||||
|
optionList, |
||||
|
vals, |
||||
|
"agencyId", |
||||
|
"subAgencyList" |
||||
|
)[vals.length - 1]["level"]; |
||||
|
item["supValues"][1] = |
||||
|
item["supValues"][1] == "grid" |
||||
|
? "grid" |
||||
|
: "agency"; |
||||
|
} else { |
||||
|
item["supValues"][0] = ""; |
||||
|
item["supValues"][1] = ""; |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布时间", |
||||
|
keyName: "publishTime", |
||||
|
type: "date-range", |
||||
|
supKeys: ["startDate", "endDate"], |
||||
|
supValues: ["", ""], |
||||
|
}, |
||||
|
], |
||||
|
|
||||
|
tableParams: [ |
||||
|
{ field: "序号", keyName: "", type: "no" }, |
||||
|
{ field: "文章标题", keyName: "title", type: "text" }, |
||||
|
{ field: "所属栏目", keyName: "categoryName", type: "text" }, |
||||
|
{ |
||||
|
field: "标签", |
||||
|
keyName: "tagNameList", |
||||
|
type: "array", |
||||
|
arrayDiv: "、", |
||||
|
}, |
||||
|
{ field: "状态", keyName: "statusFlagName", type: "text" }, |
||||
|
{ field: "发布单位", keyName: "publisherName", type: "text" }, |
||||
|
{ field: "发布时间", keyName: "publishDate", type: "text" }, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "publishRangeDesc", |
||||
|
type: "text", |
||||
|
}, |
||||
|
{ field: "置顶", keyName: "isTopName", type: "text" }, |
||||
|
], |
||||
|
tableUrl: "/gov/voice/article/articleListV2", |
||||
|
mubanUrl: "", |
||||
|
importUrl: "", |
||||
|
exportUrl: "", |
||||
|
|
||||
|
addUrl: "/gov/voice/article/addOrSaveDraft", |
||||
|
editUrl: "/gov/voice/article/updateArticle", |
||||
|
infoUrl: "/gov/voice/article/detailV2", |
||||
|
delUrl: "/gov/voice/article/delete批量", |
||||
|
editAuth(item) { |
||||
|
return item.statusFlagName == "已发布"; |
||||
|
}, |
||||
|
delAuth(item) { |
||||
|
return item.statusFlagName == "已下线"; |
||||
|
}, |
||||
|
|
||||
|
editParams: [ |
||||
|
{ |
||||
|
field: "所属栏目", |
||||
|
keyName: "category", |
||||
|
type: "select", |
||||
|
value: "", |
||||
|
multiple: false, |
||||
|
optionUrl: `/gov/voice/categoryDict/subCategories?parentCategoryId=${parentCategoryId}`, |
||||
|
optionUrlMethod: "get", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.categoryName, |
||||
|
value: item.id, |
||||
|
})); |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "所属栏目不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标题", |
||||
|
keyName: "title", |
||||
|
type: "input", |
||||
|
maxlength: 50, |
||||
|
editDisabled: true, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "文章标题不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "封面图片", |
||||
|
keyName: "imgArr", |
||||
|
type: "upload", |
||||
|
limit: 1, |
||||
|
listType: "picture-card", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["imgUrlArr", "imgUrl"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type; |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("image") == -1) { |
||||
|
that.$message.error("仅限图片格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布范围", |
||||
|
keyName: "gridIdList", |
||||
|
type: "cascader", |
||||
|
value: () => [], |
||||
|
supKeys: ["publishRangeDesc"], |
||||
|
supValues: [""], |
||||
|
optionUrl: "/gov/org/customeragency/agencygridtree", |
||||
|
optionUrlParams: { |
||||
|
agencyId: this.$store.state.user.agencyId, |
||||
|
}, |
||||
|
optionList: [], |
||||
|
optionProps: { |
||||
|
multiple: true, |
||||
|
value: "agencyId", |
||||
|
label: "agencyName", |
||||
|
children: "subAgencyList", |
||||
|
checkStrictly: false, |
||||
|
emitPath: false, |
||||
|
}, |
||||
|
optionCook(obj) { |
||||
|
return [obj]; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
console.log("handleChangeFn", vals); |
||||
|
const { optionList } = item; |
||||
|
const optionPlaneList = collapse( |
||||
|
optionList, |
||||
|
"subAgencyList" |
||||
|
); |
||||
|
if (vals.length > 0) { |
||||
|
let selectedList = vals.map( |
||||
|
(v) => |
||||
|
getItemByIdInCascader( |
||||
|
optionPlaneList, |
||||
|
[v], |
||||
|
"agencyId", |
||||
|
"subAgencyList" |
||||
|
)[0] |
||||
|
); |
||||
|
console.log("handleChangeFn", selectedList); |
||||
|
let selectedFilterList = selectedList.filter( |
||||
|
(a) => a.level == "grid" |
||||
|
); |
||||
|
that.fmData[item["keyName"]] = |
||||
|
selectedFilterList.map((a) => a.agencyId); |
||||
|
that.fmData[item["supKeys"][0]] = selectedFilterList |
||||
|
.map((a) => a.agencyName) |
||||
|
.join("、"); |
||||
|
} else { |
||||
|
} |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布范围不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布时间", |
||||
|
keyName: "publishDate", |
||||
|
type: "date", |
||||
|
value: dateFormat(new Date(), "yyyy-MM-dd"), |
||||
|
pickerOptions: { |
||||
|
disabledDate(time) { |
||||
|
return time.getTime() > Date.now(); |
||||
|
}, |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布时间不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "发布单位", |
||||
|
keyName: "publisher", |
||||
|
type: "select", |
||||
|
optionUrl: "/gov/voice/article/publishagencylist", |
||||
|
optionList: [], |
||||
|
optionType: "group", |
||||
|
supKeys: ["publisherName", "publisherType"], |
||||
|
supValues: ["", ""], |
||||
|
optionCook(data) { |
||||
|
let ret = []; |
||||
|
const { |
||||
|
agencyDeptList, |
||||
|
agencyGridList, |
||||
|
agencyId, |
||||
|
agencyName, |
||||
|
} = data; |
||||
|
if (agencyId) { |
||||
|
ret.push({ |
||||
|
label: "以组织名义", |
||||
|
optionList: [ |
||||
|
{ |
||||
|
label: agencyName, |
||||
|
value: agencyId, |
||||
|
type: "agency", |
||||
|
}, |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyDeptList) && |
||||
|
agencyDeptList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以部门名义", |
||||
|
optionList: [ |
||||
|
...agencyDeptList.map((d) => ({ |
||||
|
label: d.agencyDeptName, |
||||
|
value: d.departmentId, |
||||
|
type: "department", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
if ( |
||||
|
Array.isArray(agencyGridList) && |
||||
|
agencyGridList.length > 0 |
||||
|
) { |
||||
|
ret.push({ |
||||
|
label: "以网格名义", |
||||
|
optionList: [ |
||||
|
...agencyGridList.map((d) => ({ |
||||
|
label: d.agencyGridName, |
||||
|
value: d.gridId, |
||||
|
type: "grid", |
||||
|
})), |
||||
|
], |
||||
|
}); |
||||
|
} |
||||
|
return ret; |
||||
|
}, |
||||
|
handleChangeFn(vals, item, that) { |
||||
|
const { optionList } = item; |
||||
|
let opts = []; |
||||
|
optionList.forEach((g) => { |
||||
|
opts = [...opts, ...g.optionList]; |
||||
|
}); |
||||
|
let publisher = opts.find((p) => vals == p.value); |
||||
|
that.fmData[item["supKeys"][0]] = publisher.label; |
||||
|
that.fmData[item["supKeys"][1]] = publisher.type; |
||||
|
}, |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "发布单位不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
field: "文章标签", |
||||
|
keyName: "tagNameList", |
||||
|
type: "select", |
||||
|
multiple: true, |
||||
|
filterable: true, |
||||
|
allowCreate: true, |
||||
|
optionUrl: "/gov/voice/tag/taglist", |
||||
|
optionUrlParams: {}, |
||||
|
optionList: [], |
||||
|
optionCook(list) { |
||||
|
return list.map((item) => ({ |
||||
|
label: item.tagName, |
||||
|
value: item.tagName, |
||||
|
})); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "内容", |
||||
|
keyName: "content", |
||||
|
type: "rich-text", |
||||
|
rules: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: "内容不能为空", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
// 需要转换一下,后端给的参数不适用 |
||||
|
field: "附件", |
||||
|
keyName: "fileList2", |
||||
|
type: "upload", |
||||
|
limit: 3, |
||||
|
listType: "file", |
||||
|
editDisabled: true, |
||||
|
rules: [], |
||||
|
value: () => [], |
||||
|
uploadUrl: |
||||
|
window.SITE_CONFIG["apiURL"] + |
||||
|
"/oss/file/article/upload", |
||||
|
supKeys: ["fileListArr2", "fileListItem2"], |
||||
|
supValues: [() => [], ""], |
||||
|
beforeImgUpload(file, item, that) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type.toLowerCase(); |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
that.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if (srcType.indexOf("pdf") == -1) { |
||||
|
that.$message.error("仅限pdf格式"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: "置顶", |
||||
|
keyName: "isTop", |
||||
|
type: "switch", |
||||
|
activeValue: "1", |
||||
|
inactiveValue: "0", |
||||
|
}, |
||||
|
], |
||||
|
editFixedParams: { |
||||
|
type: "article", |
||||
|
}, |
||||
|
editElseRules: {}, |
||||
|
editConfig: { |
||||
|
confirmBtnName: "发布", |
||||
|
cookInfoFn(data) { |
||||
|
if (data.richTextFlag == "0") { |
||||
|
data.content = data.contentList |
||||
|
.map((item) => { |
||||
|
if (item.contentType == "text") { |
||||
|
return `<p>${item.content}</p>`; |
||||
|
} else if (item.contentType == "img") { |
||||
|
return `<img src="${item.content}" style="max-width:100%"></img>`; |
||||
|
} else if (item.contentType == "video") { |
||||
|
return `<video src="${item.content}" style="max-width:100%" controls></video>`; |
||||
|
} else if (item.contentType == "file") { |
||||
|
return `<a src="${item.content}" target="_blank">附件:${item.fileName}</a>`; |
||||
|
} |
||||
|
}) |
||||
|
.join(" "); |
||||
|
} else { |
||||
|
data.content = data.contentList[0].content; |
||||
|
} |
||||
|
if (data.imgUrl) { |
||||
|
data.imgArr = [ |
||||
|
{ |
||||
|
name: "封面", |
||||
|
url: data.imgUrl, |
||||
|
}, |
||||
|
]; |
||||
|
data.imgUrlArr = [data.imgUrl]; |
||||
|
} |
||||
|
data.fileList2 = (data.fileList || []).map((item) => ({ |
||||
|
url: item.content, |
||||
|
name: item.fileName, |
||||
|
size: 0, |
||||
|
type: item.content.split(".").pop(), |
||||
|
format: item.content.split(".").pop(), |
||||
|
})); |
||||
|
|
||||
|
return data; |
||||
|
}, |
||||
|
|
||||
|
beforeSubmit(formType, fmData, that) { |
||||
|
if (fmData.isTop == "1" && !fmData.imgUrl) { |
||||
|
that.$message.error("请上传封面图片"); |
||||
|
return false; |
||||
|
} |
||||
|
|
||||
|
fmData.fileList = (fmData.fileList2 || []).map((item) => ({ |
||||
|
content: item.url, |
||||
|
fileName: item.name, |
||||
|
contentType: "file", |
||||
|
})); |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
|
||||
|
formData: {}, |
||||
|
showAddImage: false, |
||||
|
uploadUlr: |
||||
|
window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile", |
||||
|
replayImgList: [], |
||||
|
hideUploadBtn: false, |
||||
|
selType: "top", |
||||
|
selArticleId: "", |
||||
|
selImgUrl: "", |
||||
|
}; |
||||
|
}, |
||||
|
components: { basePage, offline }, |
||||
|
computed: {}, |
||||
|
watch: {}, |
||||
|
|
||||
|
async mounted() {}, |
||||
|
|
||||
|
methods: { |
||||
|
async handleOfflineShow(item) { |
||||
|
console.log(item); |
||||
|
this.offlineShowed = true; |
||||
|
await nextTick(100); |
||||
|
this.$refs.offlineForm.initForm(item); |
||||
|
}, |
||||
|
|
||||
|
async handleAddImage() { |
||||
|
console.log("formData", this.formData); |
||||
|
this.topArticle(); |
||||
|
}, |
||||
|
async handleCancleTopArticle(item, type) { |
||||
|
this.selType = type; |
||||
|
this.selArticleId = item.articleId; |
||||
|
await this.topArticle(); |
||||
|
}, |
||||
|
|
||||
|
async handleTopArticle(item, type) { |
||||
|
this.selType = type; |
||||
|
this.selArticleId = item.articleId; |
||||
|
|
||||
|
let hasImage = await this.isHasImage(); |
||||
|
|
||||
|
if (hasImage === "refrsh") { |
||||
|
this.$message.error("请求失败,请重新尝试"); |
||||
|
} else if (hasImage === "no") { |
||||
|
// this.$message.info("请先上传封面图片"); |
||||
|
this.showAddImage = true; |
||||
|
} else { |
||||
|
await this.topArticle(); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async isHasImage() { |
||||
|
const url = "/gov/voice/article/detailV2"; |
||||
|
const { tableData } = this; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
articleId: this.selArticleId, |
||||
|
}); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
// this.formData = data |
||||
|
if (data.imgUrl) { |
||||
|
return "has"; |
||||
|
} else { |
||||
|
return "no"; |
||||
|
} |
||||
|
} else { |
||||
|
return "refrsh"; |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async topArticle() { |
||||
|
const url = "/gov/voice/article/topArticle"; |
||||
|
const { tableData } = this; |
||||
|
let params = { |
||||
|
articleId: this.selArticleId, |
||||
|
type: this.selType, |
||||
|
}; |
||||
|
if (this.selImgUrl) { |
||||
|
params.imgUrl = this.selImgUrl; |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message.success("操作成功!"); |
||||
|
this.showAddImage = false; |
||||
|
this.$refs.basePage.refresh(); |
||||
|
} else { |
||||
|
this.$message.success("操作失败!"); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
removePic(file, fileList) { |
||||
|
this.selImgUrl = ""; |
||||
|
this.replayImgList = []; |
||||
|
this.hideUploadBtn = fileList.length >= 1; |
||||
|
}, |
||||
|
// 最多上传3张图,超过时隐藏上传按钮 |
||||
|
handleEditChange(file, fileList) { |
||||
|
this.hideUploadBtn = fileList.length >= 1; |
||||
|
}, |
||||
|
exceedPic() { |
||||
|
this.$message.warning("只能上传1张封面图"); |
||||
|
}, |
||||
|
beforeAvatarUpload(file) { |
||||
|
const isJPG = file.type === "image/jpeg"; |
||||
|
const isLt2M = file.size / 1024 / 1024 < 10; |
||||
|
|
||||
|
if (!isLt2M) { |
||||
|
this.$message.error("上传图片大小不能超过 10MB!"); |
||||
|
} |
||||
|
return isLt2M; |
||||
|
}, |
||||
|
handleSuccess(response, file, fileList) { |
||||
|
this.replayImgList.push(file); |
||||
|
this.selImgUrl = response.data.url; |
||||
|
}, |
||||
|
|
||||
|
handleOfflineSuccess() { |
||||
|
this.$refs.basePage.refresh(); |
||||
|
this.offlineShowed = false; |
||||
|
}, |
||||
|
|
||||
|
async handleClickDraft(fmData) { |
||||
|
let url = this.addUrl; |
||||
|
let params = { |
||||
|
...fmData, |
||||
|
type: "draft", |
||||
|
}; |
||||
|
params = |
||||
|
this.$refs.basePage.$refs.editForm.cookBeforeSubmit(params); |
||||
|
if (!params.title && !params.content) { |
||||
|
return this.$message.error("标题或内容不能为空"); |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message({ |
||||
|
type: "success", |
||||
|
message: "保存成功", |
||||
|
}); |
||||
|
this.$refs.basePage.handleClose(); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
@import "@/assets/scss/modules/management/form-main.scss"; |
||||
|
|
||||
|
.avatar-uploader { |
||||
|
margin: 0 0 0 20px; |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
.hide { |
||||
|
.el-upload--picture-card { |
||||
|
display: none !important; |
||||
|
} |
||||
|
} |
||||
|
</style> |
Loading…
Reference in new issue