刘翔宇-旅管家 2 years ago
parent 938fc5d2f2
commit 9995d26cdd

@ -2,8 +2,8 @@
ENV = 'development'
# base api
#VUE_APP_DOMIAN=http://192.168.60.99:9003/
VUE_APP_DOMIAN=http://hdcontract.ali251.langye.net/
VUE_APP_DOMIAN=http://192.168.60.99:9003/
#VUE_APP_DOMIAN=http://hdcontract.ali251.langye.net/
VUE_APP_BASE_API = ''
VUE_APP_UPLOAD=http://hdcontract.ali251.langye.net/api/admin/upload-file

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

Loading…
Cancel
Save