xiaoy
/
contract-business-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2023-9-18

Browse Source
master
xy 3 years ago
parent 9995d26cdd
commit 3f8641e1cf
1 changed files with 354 additions and 346 deletions
Show Stats Download Patch File Download Diff File

700
src/views/finance/components/file.vue
Unescape View File

@ -1,348 +1,356 @@
<template> <template>
<div> <div>
<Modal v-model="isShow" title="附件" footer-hide :width="64"> <Modal v-model="isShow" title="附件" footer-hide :width="64">
<Button v-if="role === 1 || role === 0" type="primary" shape="circle" icon="ios-add" @click="add">新增</Button> <Button v-if="role === 1 || role === 0" type="primary" shape="circle" icon="ios-add" @click="add">新增</Button>
<Table style="margin-top: 10px" :height="320" :data="detail.attachment" :columns="columns"> <Table style="margin-top: 10px" :height="320" :data="detail.attachment" :columns="columns">
</Table> </Table>
</Modal> </Modal>
</div> </div>
</template> </template>
<script> <script>
import { import {
getToken getToken
} from "@/utils/auth"; } from "@/utils/auth";
import { import {
show, show,
save, save,
store store
} from "@/api/propertyPlan"; } from "@/api/propertyPlan";
export default { export default {
props: { props: {
role: Number role: Number
}, },
data() { data() {
return { return {
fileList: [], fileList: [],
action: process.env.VUE_APP_UPLOAD, action: process.env.VUE_APP_UPLOAD,
key: 1, key: 1,
isShowModal: false, isShowModal: false,
isShow: false, isShow: false,
id: "", id: "",
type: "", type: "",
detail: {}, detail: {},
columns: [{ columns: [{
key: "file", key: "file",
title: "文件（点击下载）", title: "文件（点击下载）",
width: 200, width: 200,
render: (h, { render: (h, {
row row
}) => { }) => {
return h( return h(
"a", { "a", {
attrs: { attrs: {
download: row.file.original_name, download: row.file.original_name,
href: row.file.url href: row.file.url
}, },
}, },
row.file.original_name row.file.original_name
); );
}, },
}, },
{ {
key: "content", key: "content",
title: "内容", title: "内容",
minWidth: 220, minWidth: 220,
align: "left", align: "left",
}, },
{ {
key: "date", key: "date",
title: "日期", title: "日期",
width: 160, width: 160,
}, },
{ {
key: "operate", key: "operate",
title: "操作", title: "操作",
width: 100, width: 100,
align: "left", align: "left",
render: (h, { render: (h, {
row row
}) => { }) => {
if (this.role == 0 || this.role == 1) if (this.role == 0 || this.role == 1)
return h("Poptip", { return h("Poptip", {
props: { props: {
transfer: true, transfer: true,
confirm: true, confirm: true,
title: "确认要删除吗", title: "确认要删除吗",
}, },
scopedSlots: { scopedSlots: {
default: () => { default: () => {
return h( return h(
"Button", { "Button", {
props: { props: {
ghost: true, ghost: true,
size: "small", size: "small",
type: "error", type: "error",
}, },
}, },
"删除" "删除"
); );
}, },
}, },
on: { on: {
["on-ok"]: (_) => { ["on-ok"]: (_) => {
let attachments = this.detail.attachment let attachments = this.detail.attachment
.filter((i) => i.id !== row.id) .filter((i) => i.id !== row.id)
.map((i) => { .map((i) => {
return { return {
file: i.file.id, file: i.file.id,
date: i.date, date: i.date,
content: i.content, content: i.content,
}; };
}); });
save({ save({
...this.detail, ...this.detail,
attachment_list: attachments, attachment_list: attachments,
content_list: this.detail.content.map((i) => { content_list: this.detail.content.map((i) => {
return { return {
title: i.title, title: i.title,
content: i.content, content: i.content,
date: i.date, date: i.date,
}; };
}), }),
}).then((_) => { }).then((_) => {
this.$message({ this.$message({
type: "success", type: "success",
message: "删除成功", message: "删除成功",
}); });
this.getDetail(); this.getDetail();
}); });
}, },
}, },
}); });
}, },
}, },
], ],
}; };
}, },
methods: { methods: {
show() { show() {
this.isShow = true; this.isShow = true;
}, },
hidden() { hidden() {
this.isShow = false; this.isShow = false;
}, },
init() { init() {
for (let key in this.form) { for (let key in this.form) {
if (this.form[key] instanceof Array) { if (this.form[key] instanceof Array) {
this.form[key] = []; this.form[key] = [];
} else { } else {
this.form[key] = ""; this.form[key] = "";
} }
} }
this.$refs["dialog"].clearValidate(); this.$refs["dialog"].clearValidate();
}, },
setId(id) { setId(id) {
if (typeof id == "number") { if (typeof id == "number") {
this.id = id; this.id = id;
} else { } else {
console.error("error typeof id: " + typeof id); console.error("error typeof id: " + typeof id);
} }
}, },
getId() { getId() {
return this.id; return this.id;
}, },
setType(type = "add") { setType(type = "add") {
let types = ["add", "editor"]; let types = ["add", "editor"];
if (types.includes(type)) { if (types.includes(type)) {
this.type = type; this.type = type;
} else { } else {
console.warn("Unknown type: " + type); console.warn("Unknown type: " + type);
} }
}, },
setForm(key = [], value = []) { setForm(key = [], value = []) {
if (key instanceof Array) { if (key instanceof Array) {
key.forEach((key, index) => { key.forEach((key, index) => {
this.form[key] = value[index] ?? ""; this.form[key] = value[index] ?? "";
}); });
} }
if (typeof key === "string") { if (typeof key === "string") {
this.form[key] = value; this.form[key] = value;
} }
if (!key) { if (!key) {
this.init(); this.init();
} }
}, },
async getDetail() { async getDetail() {
const res = await show({ const res = await show({
id: this.getId() id: this.getId()
}); });
this.detail = res; this.detail = res;
console.log(res); console.log(res);
}, },
async add() { async add() {
let form = { let form = {
date: this.$moment(new Date()).format("YYYY-MM-DD"), date: this.$moment(new Date()).format("YYYY-MM-DD"),
file: "", file: "",
content: "", content: "",
}; };
this.fileList = []; this.fileList = [];
const h = this.$createElement; const h = this.$createElement;
this.$msgbox({ this.$msgbox({
title: "新增附件", title: "新增附件",
message: h( message: h(
"el-form", { "el-form", {
key: ++this.key, key: ++this.key,
props: { props: {
model: form, model: form,
"label-width": "80px" "label-width": "80px"
} }
}, },
[ [
h("el-form-item", { h("el-form-item", {
props: { props: {
label: "文件", label: "文件",
required: true required: true
}, },
scopedSlots: { scopedSlots: {
default: () => default: () =>
h( h(
"el-upload", { "el-upload", {
props: { props: {
action: this.action, action: this.action,
"file-list": this.fileList, "file-list": this.fileList,
limit: 1, limit: 1,
headers: { headers: {
Authorization: "Bearer " + getToken(), Authorization: "Bearer " + getToken(),
}, },
accept: ".rar,.zip,.doc,.docx,.pdf,.jpg,.png,.gif,.xls,.xlsx", accept: ".rar,.zip,.doc,.docx,.pdf,.jpg,.png,.gif,.xls,.xlsx",
"on-success": (response, file, fileList) => { "on-success": (response, file, fileList) => {
this.fileList = fileList; if (response.errcode) {
form.file = response?.id; this.fileList = [];
}, this.$message({
"before-upload": (file) => { type: "warning",
if (file.size / 1000 > 50 * 1024) { message: "上传文件失败！",
this.$message({ });
type: "warning", } else {
message: "上传文件大小超过5M！", this.fileList = fileList;
}); form.file = response?.id;
return false; }
} },
}, "before-upload": (file) => {
"on-remove": (file, fileList) => { if (file.size / 1000 > 50 * 1024) {
this.fileList = fileList; this.$message({
}, type: "warning",
}, message: "上传文件大小超过5M！",
}, });
[ return false;
h( }
"el-button", { },
props: { "on-remove": (file, fileList) => {
type: "primary", this.fileList = fileList;
size: "small", },
}, },
slot: "trigger", },
}, [
"选取文件" h(
), "el-button", {
h( props: {
"div", { type: "primary",
class: "el-upload__tip", size: "small",
slot: "tip", },
}, slot: "trigger",
"支持文件格式：.docx，.xlsx，.pdf，.png，.jpg\n单个文件不能超过50M" },
), "选取文件"
] ),
), h(
}, "div", {
}), class: "el-upload__tip",
h("el-form-item", { slot: "tip",
props: { },
label: "内容" "支持文件格式：.docx，.xlsx，.pdf，.png，.jpg\n单个文件不能超过50M"
}, ),
scopedSlots: { ]
default: () => ),
h("textarea", { },
key: this.key, }),
class: "el-textarea__inner", h("el-form-item", {
props: { props: {
value: form.content label: "内容"
}, },
on: { scopedSlots: {
["input"]: (e) => { default: () =>
form.content = e.target.value; h("textarea", {
}, key: this.key,
}, class: "el-textarea__inner",
}), props: {
}, value: form.content
}), },
] on: {
), ["input"]: (e) => {
showCancelButton: true, form.content = e.target.value;
confirmButtonText: "确定", },
cancelButtonText: "取消", },
beforeClose: (action, instance, done) => { }),
if (action === "confirm") { },
if (!form.file) { }),
this.$message({ ]
type: "warning", ),
message: "请上传附件", showCancelButton: true,
}); confirmButtonText: "确定",
return; cancelButtonText: "取消",
} beforeClose: (action, instance, done) => {
instance.confirmButtonLoading = true; if (action === "confirm") {
instance.confirmButtonText = "保存中..."; if (!form.file) {
this.detail.attachment_list = [ this.$message({
...this.detail.attachment?.map((i) => { type: "warning",
return { message: "请上传附件",
file: i.file.id, });
content: i.content, return;
date: i.date }
}; instance.confirmButtonLoading = true;
}), instance.confirmButtonText = "保存中...";
form, this.detail.attachment_list = [
]; ...this.detail.attachment?.map((i) => {
save(this.detail) return {
.then((_) => { file: i.file?.id,
this.$message({ content: i.content,
type: "success", date: i.date
message: "保存成功", };
}); }),
instance.confirmButtonLoading = false; form,
done(); ];
this.getDetail(); save(this.detail)
this.fileList = []; .then((_) => {
}) this.$message({
.catch((_) => { type: "success",
instance.confirmButtonLoading = false; message: "保存成功",
}); });
} else { instance.confirmButtonLoading = false;
done(); done();
} this.getDetail();
}, this.fileList = [];
}); })
}, .catch((_) => {
}, instance.confirmButtonLoading = false;
watch: { });
isShow(val) { } else {
if (val) { done();
this.getDetail(); }
} else { },
this.id = ""; });
} },
}, },
}, watch: {
created() {}, isShow(val) {
}; if (val) {
</script> this.getDetail();
} else {
<style scoped lang="scss"> this.id = "";
::v-deep .el-input__inner { }
text-align: left; },
} },
created() {},
};
</script>
<style scoped lang="scss">
::v-deep .el-input__inner {
text-align: left;
}
</style> </style>

Write Preview
Loading…
Cancel
Save