parent
63947b70ce
commit
abc491af29
@ -0,0 +1,280 @@
|
||||
<script>
|
||||
import { save, show, index, destroy } from "@/api/system/baseForm";
|
||||
import { CreateDialog } from "@/utils/createDialog"
|
||||
import { deepCopy } from "@/utils";
|
||||
import { resolveFormInfo } from '@/utils/createTable'
|
||||
export default {
|
||||
props: {
|
||||
tableName: String,
|
||||
},
|
||||
render(h) {
|
||||
let dialog = new CreateDialog(this,[
|
||||
|
||||
],{
|
||||
width: "650px"
|
||||
})
|
||||
return dialog.render()
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
columns: 1,
|
||||
row: {},
|
||||
formInfo: [],
|
||||
id: "",
|
||||
type: "add",
|
||||
dialogVisible: false,
|
||||
form: {},
|
||||
originalForm: {},
|
||||
rules: {},
|
||||
file: {},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
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();
|
||||
}
|
||||
},
|
||||
|
||||
setRow (row) {
|
||||
this.row = row
|
||||
console.log(row)
|
||||
|
||||
this.setForm(['dikuaimingcheng','leixing','chuzufang',],[row.name,row.hasOwnProperty('id_house_properties_land_id_relation') ? 1 : 2,row.quanliren])
|
||||
},
|
||||
init() {
|
||||
for (let key in this.form) {
|
||||
if (this.form[key] instanceof Array) {
|
||||
this.form[key] = [];
|
||||
} else {
|
||||
this.form[key] = "";
|
||||
}
|
||||
}
|
||||
this.$refs["elForm"].clearValidate();
|
||||
},
|
||||
show() {
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
hidden() {
|
||||
this.dialogVisible = false;
|
||||
},
|
||||
setType(type = "add") {
|
||||
let types = ["add", "editor", "show"];
|
||||
if (types.includes(type)) {
|
||||
this.type = type;
|
||||
} else {
|
||||
console.warn("Unknown type: " + type);
|
||||
}
|
||||
},
|
||||
setId(id) {
|
||||
if (typeof id == "number") {
|
||||
this.id = id;
|
||||
} else {
|
||||
console.error("error typeof id: " + typeof id);
|
||||
}
|
||||
},
|
||||
|
||||
async getDetail() {
|
||||
const res = await show({ id: this.id, table_name: 'leases' });
|
||||
this.$integrateData(this.form, res);
|
||||
|
||||
this.formInfo.forEach((i) => {
|
||||
if (i && (i.edit_input === "file" || i.edit_input === "files")) {
|
||||
res[i._relations.link_with_name]
|
||||
? (this.file[i.field] =
|
||||
res[i._relations.link_with_name] instanceof Array
|
||||
? res[i._relations.link_with_name].map((i) => {
|
||||
return {
|
||||
name: i?.name,
|
||||
url: i?.url,
|
||||
response: i,
|
||||
};
|
||||
})
|
||||
: [
|
||||
{
|
||||
name: res[i._relations.link_with_name]?.name,
|
||||
url: res[i._relations.link_with_name]?.url,
|
||||
response: res[i._relations.link_with_name],
|
||||
},
|
||||
])
|
||||
: (this.file[i.field] = []);
|
||||
}
|
||||
|
||||
this.form = Object.assign({}, this.form);
|
||||
this.originalForm = deepCopy(res);
|
||||
});
|
||||
},
|
||||
|
||||
submit() {
|
||||
if (/\/house/g.test(this.$route.path)) {
|
||||
this.form['house_id'] = this.row.id
|
||||
}
|
||||
if (/\/land/g.test(this.$route.path)) {
|
||||
this.form['land_id'] = this.row.id
|
||||
}
|
||||
if (this.type === "add") {
|
||||
if (this.form.hasOwnProperty("id")) {
|
||||
delete this.form.id;
|
||||
}
|
||||
}
|
||||
if (this.type === "editor") {
|
||||
Object.defineProperty(this.form, "id", {
|
||||
value: this.id,
|
||||
enumerable: true,
|
||||
configurable: true,
|
||||
writable: true,
|
||||
});
|
||||
}
|
||||
let promiseAll = []
|
||||
this.formInfo.forEach((info) => {
|
||||
if (
|
||||
info._relations?.link_relation === "newHasMany" ||
|
||||
info._relations?.link_relation === "hasMany"
|
||||
) {
|
||||
if (this.originalForm[info._relations.link_with_name]) {
|
||||
this.originalForm[info._relations.link_with_name].map((i) => {
|
||||
promiseAll.push(
|
||||
destroy({
|
||||
id: i.id,
|
||||
table_name: info._relations.link_table_name,
|
||||
})
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (
|
||||
info._relations?.link_relation === "newHasMany" ||
|
||||
info._relations?.link_relation === "hasMany"
|
||||
) {
|
||||
if (info.edit_input === "files") {
|
||||
this.form[info._relations.link_with_name] = this.file[
|
||||
info.field
|
||||
]?.map((i) => {
|
||||
let copyRelation = i?.response ? deepCopy(i?.response) : "";
|
||||
//TODO: 待修改
|
||||
if (/:\/\/:\/\//g.test(copyRelation?.url)) {
|
||||
copyRelation.url.replace(/:\/\/:\/\//g,'://')
|
||||
}
|
||||
delete copyRelation.id;
|
||||
return {
|
||||
file_id: i?.response?.id,
|
||||
...copyRelation,
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
delete this.form['tupian']
|
||||
save(Object.assign(this.form, { table_name: 'leases' })).then(res => {
|
||||
this.$Message.success({
|
||||
content: `${this.type === "add" ? "新增" : "编辑"}成功`,
|
||||
});
|
||||
this.$emit("refresh");
|
||||
this.hidden();
|
||||
})
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
title () {
|
||||
if (this.type === 'add') return '新增'
|
||||
if (this.type === 'editor') return '编辑'
|
||||
if (this.type === 'show') return '查看'
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
formInfo: {
|
||||
handler: function (newVal) {
|
||||
this.form = {};
|
||||
this.rules = {};
|
||||
this.file = {};
|
||||
newVal.forEach((i) => {
|
||||
if (i.field) {
|
||||
this.form[i.field] = "";
|
||||
if (
|
||||
i.validation instanceof Array &&
|
||||
i.validation.length > 0 &&
|
||||
!!i.validation.find((i) => i === "required")
|
||||
) {
|
||||
this.rules[i.field] = [
|
||||
{ required: true, message: `请填写${i.name}` },
|
||||
];
|
||||
}
|
||||
if (i.edit_input === "files") {
|
||||
this.form[i.field] = [];
|
||||
}
|
||||
if (i.edit_input === "files" || i.edit_input === "file") {
|
||||
this.file[i.field] = [];
|
||||
}
|
||||
if (i.edit_input === "checkbox") {
|
||||
this.form[i.field] = [];
|
||||
}
|
||||
if (i._relations) {
|
||||
this.form[i._relations?.link_with_name] = [];
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.columns = newVal.length > 11 ? '2' : '1'
|
||||
},
|
||||
//immediate: true,
|
||||
},
|
||||
dialogVisible(val) {
|
||||
if (val) {
|
||||
document.documentElement.style.setProperty(
|
||||
"--column-num",
|
||||
this.columns
|
||||
);
|
||||
if (this.type === "editor" || this.type === "show") {
|
||||
this.$nextTick(() => this.getDetail());
|
||||
}
|
||||
} else {
|
||||
this.id = "";
|
||||
this.type = "";
|
||||
this.init();
|
||||
this.$refs["elForm"].clearValidate();
|
||||
delete this.form.id;
|
||||
for (let key in this.file) {
|
||||
this.file[key] = [];
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
created() {
|
||||
resolveFormInfo(15).then(res => this.formInfo = res)
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--column-num: 2;
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.uploaded-a {
|
||||
color: red;
|
||||
text-decoration: none;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.uploaded-a:hover {
|
||||
color: red;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.form-body {
|
||||
display: grid;
|
||||
grid-gap: 10px;
|
||||
grid-template-columns: repeat(var(--column-num), 1fr);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div>
|
||||
<Modal title="租凭台账" footer-hide :width="64" v-model="isShow">
|
||||
<Button
|
||||
type="primary"
|
||||
style="margin-bottom: 10px"
|
||||
@click="
|
||||
$refs['addLease'].setRow(row),
|
||||
$refs['addLease'].setType('add'),
|
||||
$refs['addLease'].show()
|
||||
"
|
||||
>新增记录</Button
|
||||
>
|
||||
<xy-table
|
||||
:btn-width="120"
|
||||
style="width: 100%"
|
||||
:auths="['delete', 'edit']"
|
||||
:height="360"
|
||||
:is-page="false"
|
||||
ref="xyTable"
|
||||
:list="list"
|
||||
:table-item="table"
|
||||
@delete="destroy"
|
||||
@editor="
|
||||
(row1) => {
|
||||
$refs['addLease'].setId(row1.id),
|
||||
$refs['addLease'].setType('editor');
|
||||
$refs['addLease'].setRow(row);
|
||||
$refs['addLease'].show();
|
||||
}
|
||||
"
|
||||
></xy-table>
|
||||
</Modal>
|
||||
|
||||
<addLease ref="addLease" @refresh="getList"></addLease>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { index, destroy } from "@/api/system/baseForm";
|
||||
|
||||
import addLease from "@/views/assets/component/addLease.vue";
|
||||
export default {
|
||||
components: {
|
||||
addLease,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
id: "",
|
||||
isShow: false,
|
||||
row: {},
|
||||
|
||||
list: [],
|
||||
table: [
|
||||
{
|
||||
prop: 'leixing',
|
||||
label: '类型',
|
||||
width: 80,
|
||||
formatter:(data, row, value) => {
|
||||
let map = new Map([
|
||||
[1,'土地'],
|
||||
[2,'房产']
|
||||
])
|
||||
return map.get(value)
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '承租方',
|
||||
prop: 'chengzufang',
|
||||
},
|
||||
{
|
||||
label: '租凭面积',
|
||||
prop: 'zupingmianji'
|
||||
},
|
||||
{
|
||||
label: '租赁期限起止',
|
||||
width: 200,
|
||||
customFn:row => {
|
||||
return (
|
||||
<div>
|
||||
<span>{ this.$moment(new Date(row.zulinkaishiqixian)).format('YYYY.MM.DD') }</span>
|
||||
<span> - </span>
|
||||
<span>{ this.$moment(new Date(row.zulinjieshuqixian)).format('YYYY.MM.DD') }</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '用途',
|
||||
prop: 'yongtu',
|
||||
width: 160
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
setRow(row) {
|
||||
this.row = row;
|
||||
},
|
||||
show() {
|
||||
this.isShow = true;
|
||||
},
|
||||
hide() {
|
||||
this.isShow = false;
|
||||
},
|
||||
setId(id) {
|
||||
if (typeof id === "number") {
|
||||
this.id = id;
|
||||
this.select.filter[0].value = id;
|
||||
}
|
||||
},
|
||||
async destroy (row) {
|
||||
await destroy({
|
||||
id: row.id,
|
||||
table_name: 'leases'
|
||||
})
|
||||
await this.getList()
|
||||
},
|
||||
|
||||
async getList () {
|
||||
const res = await index({
|
||||
table_name: 'leases',
|
||||
page: 1,
|
||||
page_size: 9999,
|
||||
filter: [
|
||||
{
|
||||
key: /\/land/g.test(this.$route.path) ? 'land_id' : 'house_id',
|
||||
op: 'eq',
|
||||
value: this.row.id
|
||||
}
|
||||
]
|
||||
})
|
||||
this.list = res.data;
|
||||
},
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
isShow(newVal) {
|
||||
if (newVal) {
|
||||
this.getList();
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
Loading…
Reference in new issue