<template>
|
<div class="help_doc_list_main">
|
<SearchCondition
|
:info="info"
|
ref="condRef"
|
:conForm="conForm"
|
:isShowDetail="isShowDetail"
|
:screenWidth="screenWidth"
|
@handleOnSeach="handleOnSeach"
|
@handleOnRest="handleOnRest"
|
@handleClick="isShowDetail = !isShowDetail"
|
/>
|
<div />
|
<el-row class="add-button">
|
<el-col :span="24">
|
<el-button
|
type="primary"
|
size="small"
|
icon="el-icon-circle-plus-outline"
|
@click="handleAddPage"
|
class="add-btn"
|
>新增</el-button
|
>
|
</el-col>
|
</el-row>
|
<ProTable
|
:pageInfo="pageInfo"
|
@doAction="doAction"
|
@handleCurrentChange="handleCurrentChange"
|
@handleSizeChange="handleSizeChange"
|
:isAutoIndex="true"
|
:list="records"
|
:header="tableHeader"
|
:loading="loading"
|
/>
|
<el-dialog
|
:title="dialogTitle"
|
:visible.sync="dialogVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
:show-close="false"
|
custom-class="help_doc_dialog"
|
width="1000"
|
center
|
>
|
<CreateForms
|
ref="doclist"
|
v-if="dialogVisible"
|
:isReset="true"
|
:isView="isView"
|
:isShowBorder="isShowBorder"
|
:screenWidth="1000"
|
:formItems="formItems"
|
:defValues="defValues"
|
:formRules="formRules"
|
@beforeFormAvatarUpload="beforeAvatarUpload"
|
@handleFormUpload="handleUpload"
|
@handleFormDelete="handleDelete"
|
/>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="handleDialogCancel">{{
|
isView ? "关 闭" : "取 消"
|
}}</el-button>
|
<el-button type="primary" v-if="!isView" @click="saveBoardInfo"
|
>确 定</el-button
|
>
|
</span>
|
</el-dialog>
|
<el-dialog
|
title="删除确认"
|
:visible.sync="delDialogVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
:show-close="false"
|
width="450"
|
center
|
custom-class="help_doc_tip_dialog del_dialog"
|
>
|
<div style="text-align: center">
|
请确认是否删除文档名称为：{{ boardname }}
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="delDialogVisible = false">取 消</el-button>
|
<el-button type="primary" @click="deleteHelpdoc">确 定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
HELPCOCMANAGECOND,
|
HELPCOCMANAGECONDDEF
|
} from "./config/condtion.config";
|
import { HELPCOCMANAGECONDCOLUMN } from "./config/column.config";
|
import { HELPCOCMANAGECONDFORMS } from "./config/formItem.config";
|
import { HELPCOCMANAGECONDRULES } from "./config/rules.config";
|
import { HELPCOCMANAGECONDDEFVALUES } from "./config/defValues.config";
|
import ProTable from "../components/ProTable";
|
import CreateForms from "../components/CreateForms";
|
import SearchCondition from "../components/SearchCondition";
|
import {
|
getBoardList,
|
getDictionaryList,
|
uploadAttachment,
|
getAttachMentList,
|
deleteAttachment,
|
downloadHelpDocZip,
|
getShowOrgList,
|
deleteBoardInfo,
|
getShowRoleList
|
} from "../../http/api";
|
export default {
|
data() {
|
return {
|
info: [...HELPCOCMANAGECOND],
|
restFormItems: [...HELPCOCMANAGECOND],
|
formItems: [...HELPCOCMANAGECONDFORMS],
|
formRules: { ...HELPCOCMANAGECONDRULES },
|
defValues: { ...HELPCOCMANAGECONDDEFVALUES },
|
tableHeader: [...HELPCOCMANAGECONDCOLUMN],
|
conForm: { ...HELPCOCMANAGECONDDEF },
|
pageInfo: {
|
currentPage: 1,
|
pageSize: 10,
|
total: 0
|
},
|
records: [],
|
flileList: [],
|
contenttypeOptions: [],
|
ispublishOptions: [],
|
publishscopeOptions: [],
|
newTypeno: "",
|
screenWidth: document.body.offsetWidth,
|
condtionValue: {}, // 表单value集合
|
isShowBorder: true,
|
boardno: "",
|
docno: "",
|
dialogTitle: "新增文档",
|
boardname: "",
|
showOrgList: [],
|
showRoleList: [],
|
dialogVisible: false,
|
isShowDetail: false, // 是否显示所有表单项
|
isView: false,
|
loading: false,
|
btnLoading: false,
|
delDialogVisible: false,
|
passValidate: false,
|
openAddPage: false //
|
};
|
},
|
components: {
|
SearchCondition,
|
ProTable,
|
CreateForms
|
},
|
created() {
|
// 类型：ContentType
|
// 是否发布：YesNo
|
const opyionItems = [
|
{ name: "contenttype", code: "ContentType02" },
|
{ name: "publishscope", code: "PublisScope" },
|
{ name: "ispublish", code: "YesNo" }
|
];
|
opyionItems.forEach(item => {
|
this.getDictionaryList(item.name, item.code);
|
});
|
this.getShowRoleList();
|
this.getShowOrgList();
|
},
|
mounted() {
|
window.addEventListener("resize", this.getScreenWidth);
|
this.getBoardList();
|
},
|
destroyed() {
|
window.removeEventListener("resize", this.getScreenWidth);
|
},
|
methods: {
|
// 获取机构下拉选择项
|
async getShowOrgList() {
|
const listRes = await getShowOrgList({});
|
if (listRes && listRes.code === "00") {
|
this.showOrgList = listRes.result.map(({ orgid, orgname }) => {
|
return {
|
label: orgname,
|
value: orgid
|
};
|
});
|
}
|
},
|
// 获取发布范围下拉选择项
|
async getShowRoleList() {
|
const listRes = await getShowRoleList({});
|
if (listRes && listRes.code === "00") {
|
this.showRoleList = listRes.result.map(({ roleid, rolename }) => {
|
return {
|
label: rolename,
|
value: roleid
|
};
|
});
|
}
|
},
|
/**
|
* 获取下拉选择项
|
*/
|
async getDictionaryList(name, codeNo) {
|
const params = { codeNo };
|
const re = await getDictionaryList(params);
|
if (re.code && re.code === "00") {
|
const options = re.result.map(({ itemno, itemname }) => {
|
return { label: itemname, value: itemno };
|
});
|
if (name === "contenttype") {
|
this.contenttypeOptions = options;
|
} else if (name === "publishscope") {
|
this.publishscopeOptions = options;
|
} else {
|
this.ispublishOptions = options;
|
}
|
this.setOrGetFormInfo(name, { options }, "settingDef");
|
}
|
},
|
getScreenWidth() {
|
this.$set(this, "screenWidth", document.body.offsetWidth);
|
},
|
async saveBoardInfo() {
|
const doclistRef = this.$refs.doclist;
|
await this.beforeAvatarUpload();
|
if (!this.passValidate) {
|
return false;
|
}
|
if (this.flileList && this.flileList.length < 1) {
|
this.$message.warning("请上传文档附件");
|
return false;
|
}
|
const {
|
begintime,
|
boarddesc,
|
contenttype,
|
endtime,
|
boardname,
|
ispublish,
|
publishscope,
|
showtoorg,
|
showtoroles
|
} = doclistRef.$refs["createForm"].model;
|
const { boardno } = this;
|
const formData = new FormData();
|
formData.append("boardname", boardname);
|
formData.append("begintime", begintime);
|
formData.append("endtime", endtime);
|
formData.append("boarddesc", boarddesc);
|
formData.append("contenttype", contenttype);
|
formData.append("ispublish", ispublish);
|
formData.append("showtoorg", showtoorg);
|
formData.append("publishscope", publishscope);
|
formData.append("showtoroles", showtoroles);
|
formData.append("boardno", boardno);
|
uploadAttachment(formData).then(res => {
|
if (res.code === "00") {
|
this.$message.success("保存成功！");
|
this.formItems = [...HELPCOCMANAGECONDFORMS];
|
this.defValues = { ...HELPCOCMANAGECONDDEFVALUES };
|
this.formRules = { ...HELPCOCMANAGECONDRULES };
|
this.boardno = "";
|
this.dialogVisible = false;
|
this.getBoardList();
|
}
|
});
|
},
|
// 获取列表
|
async getBoardList() {
|
const { currentPage, pageSize } = this.pageInfo;
|
const {
|
boarddesc,
|
boardno,
|
contenttype,
|
effectBeginDate,
|
effectEndDate,
|
filename,
|
publishscope,
|
invalidBeginDate,
|
invalidEndDate,
|
ispublish
|
} = this.condtionValue;
|
const loading = this.$loading({
|
lock: true,
|
text: "",
|
background: "hsla(0,0%,100%,.9)"
|
});
|
setTimeout(() => {
|
loading.close();
|
}, 1500);
|
const params = {
|
boarddesc,
|
boardno,
|
contenttype,
|
currentPage,
|
effectBeginDate,
|
effectEndDate,
|
filename,
|
publishscope,
|
invalidBeginDate,
|
invalidEndDate,
|
ispublish,
|
sorttype: "02",
|
pageSize
|
};
|
const listRes = await getBoardList(params);
|
loading.close();
|
if (listRes.code && listRes.code === "00") {
|
const newList =
|
listRes.result &&
|
listRes.result.records.map(item => {
|
const newItem = { ...item };
|
newItem.operationOption = [
|
{ label: "下载附件", type: "DOWNLOAD", value: true },
|
{ label: "详情", type: "DETAIL", value: true },
|
{ label: "修改", type: "EDIT", value: true },
|
{ label: "删除", type: "DELETE", value: true }
|
];
|
return newItem;
|
});
|
this.$set(this, "records", newList);
|
this.$set(
|
this.pageInfo,
|
"total",
|
listRes.result && listRes.result.total
|
);
|
}
|
},
|
async getAttachMentList(params) {
|
const listRes = await getAttachMentList(params);
|
if (!listRes || listRes.code !== "00") {
|
return false;
|
}
|
this.flileList = listRes.result;
|
return listRes.result;
|
},
|
// 更新表单数据或查找某项数据
|
setOrGetFormInfo(nameKey, newInfo, def) {
|
const { info, restFormItems } = this;
|
const index = info.findIndex(({ name }) => name === nameKey);
|
let result = {};
|
if (!isNaN(index)) {
|
this.$set(this.info, index, { ...info[index], ...newInfo });
|
if (def) {
|
this.$set(this.restFormItems, index, {
|
...restFormItems[index],
|
...newInfo
|
});
|
}
|
result = this.info[index];
|
}
|
if (typeof newInfo === "undefined") {
|
return result;
|
}
|
},
|
|
// 搜索列表
|
handleOnSeach() {
|
const conRef = this.$refs.condRef;
|
this.$set(this, "condtionValue", conRef.$refs["conform"].model);
|
this.$set(this, "pageInfo", { currentPage: 1, pageSize: 10, total: 0 });
|
this.getBoardList();
|
},
|
|
// 获取筛选条件value
|
setValueInfo(condtions) {
|
this.$set(this, "condtionValue", condtions);
|
},
|
|
// 重置
|
handleOnRest() {
|
this.$set(this, "condtionValue", {});
|
// this.$set(this, 'pageInfo', { currentPage: 1, pageSize: 10, total: 0 })
|
// this.getProductList()
|
},
|
// 表单事件回调
|
async doAction(name, item, { type }) {
|
if (type === "EDIT") {
|
this.isView = false;
|
this.isShowBorder = true;
|
this.attachmentno = item.attachmentno || "";
|
this.docno = item.docno;
|
this.boardno = item.boardno;
|
const rowData = await this.getAttachMentList({
|
docno: item.docno
|
});
|
this.formItems = [...this.formItems].map(form => {
|
const newForm = { ...form };
|
if (newForm.type === "file") {
|
newForm.fileInfo = {
|
...newForm.fileInfo,
|
images: rowData.map(file => {
|
return {
|
url: file.url,
|
filename: file.filename,
|
attachmentno: file.attachmentno
|
};
|
})
|
};
|
}
|
if (newForm.name === "contenttype") {
|
newForm.options = this.contenttypeOptions;
|
}
|
if (newForm.name === "ispublish") {
|
newForm.options = this.ispublishOptions;
|
}
|
if (newForm.name === "showtoorg") {
|
newForm.options = this.showOrgList;
|
}
|
if (newForm.name === "publishscope") {
|
newForm.options = this.publishscopeOptions;
|
}
|
if (newForm.name === "showtoroles") {
|
newForm.options = this.showRoleList;
|
}
|
return newForm;
|
});
|
this.defValues = {
|
...rowData,
|
...item,
|
showtoorg: item.showtoorg && item.showtoorg.split(",")
|
};
|
this.dialogTitle = "文档修改";
|
this.dialogVisible = true;
|
return false;
|
}
|
if (type === "DETAIL") {
|
this.isView = true;
|
this.isShowBorder = false;
|
this.attachmentno = item.attachmentno || "";
|
this.docno = item.docno;
|
this.boardno = item.boardno;
|
const rowData = await this.getAttachMentList({
|
docno: item.docno
|
});
|
this.formItems = [...HELPCOCMANAGECONDFORMS].map(form => {
|
const newForm = { ...form };
|
newForm.readonly = true;
|
newForm.placeholder = "";
|
if (newForm.type === "file") {
|
newForm.fileInfo = {
|
...newForm.fileInfo,
|
images: rowData.map(file => {
|
return {
|
url: file.url,
|
filename: file.filename,
|
attachmentno: file.attachmentno
|
};
|
})
|
};
|
}
|
if (newForm.type === "select" || newForm.type === "multipleSelect") {
|
if (newForm.name === "contenttype") {
|
newForm.options = this.contenttypeOptions;
|
}
|
if (newForm.name === "ispublish") {
|
newForm.options = this.ispublishOptions;
|
}
|
if (newForm.name === "showtoorg") {
|
newForm.options = this.showOrgList;
|
}
|
if (newForm.name === "publishscope") {
|
newForm.options = this.publishscopeOptions;
|
}
|
if (newForm.name === "showtoroles") {
|
newForm.options = this.showRoleList;
|
}
|
}
|
return newForm;
|
});
|
this.defValues = {
|
...rowData,
|
...item,
|
showtoorg: item.showtoorg && item.showtoorg.split(",")
|
};
|
this.dialogTitle = "文档信息";
|
this.dialogVisible = true;
|
return false;
|
}
|
if (type === "DOWNLOAD") {
|
const loading = this.$loading({
|
lock: true,
|
text: "下载中，请稍后！",
|
background: "rgba(0, 0, 0, 0.7)"
|
});
|
setTimeout(() => {
|
loading.close();
|
}, 3000);
|
downloadHelpDocZip({
|
fileName: item.filename,
|
docno: item.docno
|
});
|
}
|
if (type === "DELETE") {
|
this.boardname = item.boardname;
|
this.boardno = item.boardno;
|
this.docno = item.docno;
|
this.delDialogVisible = true;
|
}
|
},
|
// 上传前事件
|
beforeAvatarUpload() {
|
const doclistRef = this.$refs.doclist;
|
doclistRef.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
this.passValidate = true;
|
return true;
|
} else {
|
this.passValidate = false;
|
this.$message.error("请完善必填项！");
|
return false;
|
}
|
});
|
},
|
// 上传文件
|
handleUpload(fileData) {
|
if (!fileData || !this.passValidate) {
|
return false;
|
}
|
const doclistRef = this.$refs.doclist;
|
const {
|
begintime,
|
boarddesc,
|
contenttype,
|
endtime,
|
boardname,
|
ispublish,
|
showtoorg,
|
showtoroles
|
} = doclistRef.$refs["createForm"].model;
|
const formData = new FormData();
|
formData.append("file", fileData);
|
formData.append("boardname", boardname);
|
formData.append("begintime", begintime);
|
formData.append("endtime", endtime);
|
formData.append("boarddesc", boarddesc);
|
formData.append("boardno", this.boardno);
|
formData.append("contenttype", contenttype);
|
formData.append("ispublish", ispublish);
|
formData.append("showtoorg", showtoorg);
|
formData.append("showtoroles", showtoroles);
|
uploadAttachment(formData).then(async res => {
|
if (res.code === "00") {
|
this.$message.success("上传成功！");
|
doclistRef.$refs["createForm"].model.file = res.result.boardno;
|
this.boardno = res.result.boardno;
|
this.docno = res.result.docno;
|
const rowData = await this.getAttachMentList({
|
docno: res.result.docno
|
});
|
this.formItems = [...HELPCOCMANAGECONDFORMS].map(form => {
|
const newForm = { ...form };
|
if (newForm.type === "file") {
|
newForm.fileInfo = {
|
...newForm.fileInfo,
|
images: rowData.map(file => {
|
return {
|
url: file.url,
|
filename: file.filename,
|
attachmentno: file.attachmentno
|
};
|
})
|
};
|
}
|
return newForm;
|
});
|
}
|
});
|
},
|
handleDialogCancel() {
|
if (this.dialogTitle === "新增文档" && this.boardno) {
|
this.deleteHelpdoc("cancel");
|
}
|
this.formItems = [...HELPCOCMANAGECONDFORMS];
|
this.defValues = { ...HELPCOCMANAGECONDDEFVALUES };
|
this.formRules = { ...HELPCOCMANAGECONDRULES };
|
this.boardno = "";
|
this.dialogVisible = false;
|
},
|
// 删除文件
|
handleDelete(attachmentno) {
|
this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
}).then(() => {
|
let params = {
|
attachmentno
|
};
|
deleteAttachment(params)
|
.then(async res => {
|
if (res.code === "00") {
|
this.$message.success("删除成功！");
|
const rowData = await this.getAttachMentList({
|
docno: this.docno
|
});
|
this.formItems = [...this.formItems].map(form => {
|
const newForm = { ...form };
|
if (newForm.type === "file") {
|
newForm.fileInfo = {
|
...newForm.fileInfo,
|
images: rowData.map(file => {
|
return {
|
url: file.url,
|
filename: file.filename,
|
attachmentno: file.attachmentno
|
};
|
})
|
};
|
}
|
return newForm;
|
});
|
}
|
})
|
.catch(() => {});
|
});
|
},
|
// 新增
|
handleAddPage() {
|
this.isView = false;
|
this.isShowBorder = true;
|
this.formItems = [...HELPCOCMANAGECONDFORMS].map(form => {
|
const newForm = { ...form };
|
if (newForm.type === "select" || newForm.type === "multipleSelect") {
|
if (newForm.name === "contenttype") {
|
newForm.options = this.contenttypeOptions;
|
}
|
if (newForm.name === "ispublish") {
|
newForm.options = this.ispublishOptions;
|
}
|
if (newForm.name === "showtoorg") {
|
newForm.options = this.showOrgList;
|
}
|
if (newForm.name === "publishscope") {
|
newForm.options = this.publishscopeOptions;
|
}
|
if (newForm.name === "showtoroles") {
|
newForm.options = this.showRoleList;
|
}
|
}
|
return newForm;
|
});
|
this.boardno = "";
|
this.docno = "";
|
this.flileList = [];
|
this.dialogTitle = "新增文档";
|
this.dialogVisible = true;
|
},
|
// 保存文档
|
saveHelpDoc() {
|
this.handleDialogCancel();
|
},
|
// 删除文档
|
async deleteHelpdoc(type) {
|
const { boardno } = this;
|
const deleReS = await deleteBoardInfo({ boardno });
|
if (deleReS && deleReS.code === "00") {
|
!type && this.$message.success("删除成功");
|
this.delDialogVisible = false;
|
this.getBoardList();
|
}
|
},
|
// 修改翻页条数
|
handleSizeChange(val) {
|
this.pageInfo.pageSize = val;
|
this.getBoardList();
|
},
|
|
// 修改翻页数
|
handleCurrentChange(val) {
|
this.pageInfo.currentPage = val;
|
this.getBoardList();
|
}
|
}
|
};
|
</script>
|
|
<style lang="less">
|
.help_doc_list_main {
|
padding: 16px 0px 0 20px;
|
& .help_doc_dialog {
|
width: 1000px;
|
// & .is-always-shadow {
|
// // box-shadow: none;
|
// }
|
& .images {
|
text-align: left;
|
& .imagesList {
|
display: flex;
|
& .upload_parent {
|
margin-top: -5px !important;
|
margin-left: 10px !important;
|
}
|
& .img-item {
|
position: relative;
|
}
|
& .el-icon-error {
|
position: absolute;
|
left: 32px;
|
top: -2px;
|
cursor: pointer;
|
}
|
& .el-upload--picture-card {
|
height: 61px;
|
width: 52px;
|
position: relative;
|
& .el-icon-plus {
|
position: absolute;
|
left: 12px;
|
top: 15px;
|
}
|
}
|
}
|
& img {
|
width: 50px;
|
margin-right: 15px;
|
}
|
& .oper_img_list_ico {
|
width: 24px;
|
height: 24px;
|
margin-right: 0px;
|
position: absolute;
|
bottom: 0px !important;
|
}
|
}
|
& .el-dialog__footer {
|
& .dialog-footer {
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
}
|
& .el-button--primary {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
background: #0081f0;
|
border-color: #0081f0;
|
border-radius: 4px;
|
margin-left: 40px;
|
}
|
}
|
}
|
}
|
& .help_doc_tip_dialog {
|
width: 1000px;
|
& .el-dialog__footer {
|
& .dialog-footer {
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
}
|
& .el-button--primary {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
background: #0081f0;
|
border-color: #0081f0;
|
border-radius: 4px;
|
margin-left: 40px;
|
}
|
}
|
}
|
}
|
& .copy_dialog {
|
width: 950px;
|
}
|
& .del_dialog {
|
width: 450px;
|
& .el-dialog__body {
|
text-align: justify;
|
}
|
}
|
& .add-button {
|
padding: 2px 0 30px 0;
|
}
|
}
|
</style>
|
