15 changed files with 654 additions and 32 deletions
|
After Width: | Height: | Size: 92 KiB |
@ -0,0 +1,453 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<base-page ref="basePage" :tableData="tableData" :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> |
||||
|
</div> |
||||
|
|
||||
|
</template> |
||||
|
<script> |
||||
|
import basePage from "@/views/modules/cpts/base/index"; |
||||
|
import { getItemByIdInCascader, collapse } from "@/utils/cascader"; |
||||
|
|
||||
|
import dateFormat from "dai-js/tools/dateFormat.js"; |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
offlineShowed: false, |
||||
|
|
||||
|
draftBtnDisable: false, |
||||
|
searchParams: [ |
||||
|
{ 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: "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" }, |
||||
|
{ field: "点赞数", keyName: "likeCount", type: "text" }, |
||||
|
{ field: "转发量", keyName: "forwardCount", 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: "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: "isTop", |
||||
|
type: "switch", |
||||
|
activeValue: "1", |
||||
|
inactiveValue: "0", |
||||
|
}, |
||||
|
{ |
||||
|
field: "消息推送", |
||||
|
keyName: "isPush", |
||||
|
type: "checkbox", |
||||
|
optionList:"是否通过公众号推送给社区居民" |
||||
|
}, |
||||
|
], |
||||
|
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]; |
||||
|
} |
||||
|
|
||||
|
return data; |
||||
|
}, |
||||
|
|
||||
|
beforeSubmit(formType, fmData, that) { |
||||
|
if (fmData.isTop == "1" && !fmData.imgUrl) { |
||||
|
that.$message.error("请上传封面图片"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
}, |
||||
|
|
||||
|
formData: {}, |
||||
|
showAddImage: false, |
||||
|
uploadUlr: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile", |
||||
|
replayImgList: [], |
||||
|
hideUploadBtn: false, |
||||
|
selType: "top", |
||||
|
selArticleId: "", |
||||
|
selImgUrl: "", |
||||
|
}; |
||||
|
}, |
||||
|
components: { basePage } |
||||
|
|
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss"></style> |
||||
Loading…
Reference in new issue