You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
453 lines
14 KiB
453 lines
14 KiB
1 year ago
|
<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>
|