|
@@ -12,7 +12,7 @@
|
|
|
<div class="contract-box">
|
|
|
<div class="hui-chart-title">所属公司信息</div>
|
|
|
<div class="contract-from">
|
|
|
- <el-form-item label="所属公司">
|
|
|
+ <el-form-item label="所属公司" prop="organizationId" :rules="[{required: true, message: '所属公司'}]">
|
|
|
<el-input v-model="organization.name" disabled></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="所属部门">
|
|
@@ -21,14 +21,15 @@
|
|
|
</el-cascader>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="招商跟进人">
|
|
|
- <el-select v-model="form.investmentPromotion" placeholder="请选择招商跟进人">
|
|
|
+ <el-select v-model="form.investmentPromotion" placeholder="请选择招商跟进人"
|
|
|
+ @change="changeInvestmentPromotion">
|
|
|
<el-option :label="item.name" :value="item.id" v-for="(item,index) in partUserList"
|
|
|
:key="index">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="运营跟进人">
|
|
|
- <el-select v-model="form.operator" placeholder="请选择运营跟进人">
|
|
|
+ <el-form-item label="运营跟进人" prop="operator" :rules="[{required: true, message: '请选择运营跟进人'}]">
|
|
|
+ <el-select v-model="form.operator" placeholder="请选择运营跟进人" @change="changeOperator">
|
|
|
<el-option :label="item.name" :value="item.id" v-for="(item,index) in partUserList"
|
|
|
:key="index">
|
|
|
</el-option>
|
|
@@ -40,26 +41,28 @@
|
|
|
<div class="hui-chart-title">租客信息</div>
|
|
|
<div class="contract-from">
|
|
|
<el-form-item label="租客类型">
|
|
|
- <el-select v-model="form.renterType" placeholder="请选择租客类型">
|
|
|
+ <el-select v-model="form.tenantType" placeholder="请选择租客类型">
|
|
|
<el-option label="企业" :value="1"></el-option>
|
|
|
<el-option label="客户" :value="2"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="企业" v-if="form.renterType === 1">
|
|
|
+ <el-form-item label="企业" v-if="form.tenantType === 1" prop="merchantId"
|
|
|
+ :rules="[{required: true, message: '请选择企业'}]">
|
|
|
<el-select v-model="form.merchantId" placeholder="请选择企业" @change="changeMerchant">
|
|
|
<el-option :label="item.name" :value="item.id" v-for="(item,index) in merchantList"
|
|
|
:key="index">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="客户" v-else-if="form.renterType === 2">
|
|
|
- <el-select v-model="form.clientId" placeholder="请选择客户">
|
|
|
+ <el-form-item label="客户" v-else-if="form.tenantType === 2" prop="clientId"
|
|
|
+ :rules="[{required: true, message: '请选择客户'}]">
|
|
|
+ <el-select v-model="form.clientId" placeholder="请选择客户" @change="changeClinet">
|
|
|
<el-option :label="item.name" :value="item.id" v-for="(item,index) in clientList"
|
|
|
:key="index">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="法人" v-if="form.renterType === 1">
|
|
|
+ <el-form-item label="法人" v-if="form.tenantType === 1">
|
|
|
<el-input v-model="form.corporation" disabled></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="行业">
|
|
@@ -110,8 +113,7 @@
|
|
|
<div class="contract-box">
|
|
|
<div class="hui-chart-title">合同标签</div>
|
|
|
<div class="contract-from" style="padding-bottom: 20px;">
|
|
|
- <tag ref="tag" type="insert" :tagType="4"
|
|
|
- :tagActive="form.tagIds ? form.tagIds.split(',') : []">
|
|
|
+ <tag ref="tag" type="insert" :tagType="4" :tagActive="tagIds">
|
|
|
</tag>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -128,7 +130,8 @@
|
|
|
<svg-icon name="zhuangshi" width="16" height="20"></svg-icon>
|
|
|
<span class="hui-left-tree-sub">房源列表</span>
|
|
|
</div>
|
|
|
- <project-item-tree-select></project-item-tree-select>
|
|
|
+ <project-item-tree-select ref="houseItem" :ids="form.projectItemTargetRoomIds">
|
|
|
+ </project-item-tree-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-form>
|
|
@@ -142,7 +145,8 @@
|
|
|
</div>
|
|
|
<div class="contract-from">
|
|
|
<clause :ref="'clause' + item.id " :type="item.type"
|
|
|
- v-for="(item,index) in clauseData.filter(node => node.type === clause.id)" :key="item.id">
|
|
|
+ v-for="(item,index) in clauseData.filter(node => node.type === clause.id)" :key="item.id"
|
|
|
+ :formData="item.form">
|
|
|
<i class="el-icon-close" v-if="item.isDelete" @click="deleteClause(item.id)"></i>
|
|
|
</clause>
|
|
|
</div>
|
|
@@ -150,10 +154,10 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="hui-flex-box" v-show="stepId === 3">
|
|
|
- <select-template></select-template>
|
|
|
+ <select-template ref="selectTemplate" :documentFileList="documentFileList"></select-template>
|
|
|
</div>
|
|
|
<div class="contract-btn">
|
|
|
- <el-button size="medium" @click="lastSubmit">上一步</el-button>
|
|
|
+ <el-button size="medium" @click="lastSubmit" v-if="stepId > 1">上一步</el-button>
|
|
|
<el-button type="primary" size="medium" @click="submit">{{stepId === 3 ? '保存' : '下一步'}}</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -170,11 +174,21 @@
|
|
|
import {
|
|
|
getCustomerListByPage
|
|
|
} from '@/httpApi/crm'
|
|
|
+ import {
|
|
|
+ insertContract,
|
|
|
+ getContractDetailById,
|
|
|
+ updateContract,
|
|
|
+ updateContractAll
|
|
|
+ } from '@/httpApi/contract'
|
|
|
import tag from '@/components/common/tag'
|
|
|
import customData from '@/components/common/customData'
|
|
|
import clause from '@/components/work/contract/common/clause'
|
|
|
import selectTemplate from '@/components/work/contract/common/selectTemplate'
|
|
|
+ import {
|
|
|
+ findParentIds
|
|
|
+ } from '@/uitls'
|
|
|
export default {
|
|
|
+ props: ['detailId'],
|
|
|
data() {
|
|
|
return {
|
|
|
stepList: [{
|
|
@@ -202,13 +216,18 @@
|
|
|
customList: [],
|
|
|
form: {
|
|
|
organizationId: '',
|
|
|
+ organizationName: '',
|
|
|
roleId: '',
|
|
|
roleName: '',
|
|
|
investmentPromotion: '',
|
|
|
+ investmentPromotionName: '',
|
|
|
operator: '',
|
|
|
- renterType: 1,
|
|
|
+ operatorName: '',
|
|
|
+ tenantType: 1,
|
|
|
merchantId: '',
|
|
|
+ merchantName: '',
|
|
|
clientId: '',
|
|
|
+ clientName: '',
|
|
|
tenant: '', //租客
|
|
|
industry: '',
|
|
|
corporation: '',
|
|
@@ -219,9 +238,10 @@
|
|
|
endDate: '',
|
|
|
lateFeesStartingDays: '',
|
|
|
lateFeesProportion: '',
|
|
|
- tagIds: '',
|
|
|
- type: ''
|
|
|
+ lateFeesCeiling: '',
|
|
|
+ projectItemTargetRoomIds: ''
|
|
|
},
|
|
|
+ tagIds: [],
|
|
|
clauseList: [{
|
|
|
id: 1,
|
|
|
name: '租期条款'
|
|
@@ -244,22 +264,68 @@
|
|
|
type: 2,
|
|
|
isDelete: false
|
|
|
}],
|
|
|
- clauseIndex: 3
|
|
|
+ clauseIndex: 3,
|
|
|
+ clauseDataBox: [],
|
|
|
+ houseIds: [],
|
|
|
+ documentFileList: {
|
|
|
+ document: [],
|
|
|
+ attachment: []
|
|
|
+ },
|
|
|
+ formData: {}
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.organization = this.$store.getters.organization;
|
|
|
this.form['organizationId'] = this.organization.id;
|
|
|
- this.partList();
|
|
|
+ this.form['organizationName'] = this.organization.name;
|
|
|
this.merchant();
|
|
|
this.client();
|
|
|
+ if (this.detailId) {
|
|
|
+ getContractDetailById(this.detailId).then(res => {
|
|
|
+ if (res.state) {
|
|
|
+ let data = res.data;
|
|
|
+ this.formData = data;
|
|
|
+ for (let key in this.form) {
|
|
|
+ this.form[key] = data[key];
|
|
|
+ }
|
|
|
+ this.tagIds = data.tagList.map(node => node.id);
|
|
|
+ if (data.data) this.customList = JSON.parse(data.data);
|
|
|
+ this.clauseData = data.clauseList.map((node, index) => {
|
|
|
+ let obj = {
|
|
|
+ id: index + 1,
|
|
|
+ type: node.type,
|
|
|
+ form: node
|
|
|
+ }
|
|
|
+ if (index < 2) {
|
|
|
+ node['isDelete'] = false;
|
|
|
+ } else {
|
|
|
+ node['isDelete'] = true;
|
|
|
+ }
|
|
|
+ return obj;
|
|
|
+ })
|
|
|
+ this.partList();
|
|
|
+ this.documentFileList = {
|
|
|
+ document: data.document ? JSON.parse(data.document) : [],
|
|
|
+ attachment: data.attachment ? JSON.parse(data.attachment) : []
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.partList();
|
|
|
+ }
|
|
|
},
|
|
|
methods: {
|
|
|
partList() {
|
|
|
getPartList(this.organization.id, this.$store.getters.project.id).then(res => {
|
|
|
if (res.state) {
|
|
|
this.partData = res.data;
|
|
|
- this.returnPartList(this.partData);
|
|
|
+
|
|
|
+ if (this.form.roleId) {
|
|
|
+ this.returnPartList(this.partData, this.form.roleId);
|
|
|
+ this.partValue = findParentIds(this.partData, this.form.roleId);
|
|
|
+ } else {
|
|
|
+ this.returnPartList(this.partData);
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
},
|
|
@@ -276,6 +342,19 @@
|
|
|
changeMerchant() {
|
|
|
let data = this.merchantList.find(node => node.id == this.form.merchantId);
|
|
|
this.form.corporation = data.legalPerson;
|
|
|
+ this.form.merchantName = data.name;
|
|
|
+ },
|
|
|
+ changeClinet() {
|
|
|
+ let data = this.clientList.find(node => node.id == this.form.merchantId);
|
|
|
+ this.form.clientName = data.name;
|
|
|
+ },
|
|
|
+ changeInvestmentPromotion() {
|
|
|
+ let data = this.partUserList.find(node => node.id == this.form.investmentPromotion);
|
|
|
+ this.form.investmentPromotionName = data.name;
|
|
|
+ },
|
|
|
+ changeOperator() {
|
|
|
+ let data = this.partUserList.find(node => node.id == this.form.operator);
|
|
|
+ this.form.operatorName = data.name;
|
|
|
},
|
|
|
client() {
|
|
|
getCustomerListByPage({
|
|
@@ -289,28 +368,76 @@
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- returnPartList(data) {
|
|
|
+ returnPartList(data, id) {
|
|
|
for (var i = 0; i < data.length; i++) {
|
|
|
+ if (id === data[i].id) this.partUserList = data[i].users || [];
|
|
|
if (data[i].children.length > 0) {
|
|
|
- this.returnPartList(data[i].children)
|
|
|
+ this.returnPartList(data[i].children, id)
|
|
|
} else {
|
|
|
data[i].children = null;
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- changePart(val) {
|
|
|
+ changePart() {
|
|
|
this.form.investmentPromotion = '';
|
|
|
this.form.operator = '';
|
|
|
- this.partUserList = this.$refs.partCascader.getCheckedNodes(true)[0].data.users || [];
|
|
|
+ let data = this.$refs.partCascader.getCheckedNodes(true)[0].data;
|
|
|
+ this.partUserList = data.users || [];
|
|
|
+ this.form.roleId = data.id;
|
|
|
+ this.form.roleName = data.name;
|
|
|
},
|
|
|
lastSubmit() {
|
|
|
- if (this.stepId > 0) return this.stepId--;
|
|
|
+ if (this.stepId === 1) return this.$emit('callback');
|
|
|
+ this.stepId--;
|
|
|
},
|
|
|
submit() {
|
|
|
- if (this.stepId < 3) return this.stepId++;
|
|
|
- // let post = {}
|
|
|
- // postData['data'] = JSON.stringify(this.$refs.customData.listData);
|
|
|
- // postData['tagIds'] = this.$refs.tag.tagIds();
|
|
|
+ if (this.stepId === 1) {
|
|
|
+ this.$refs.form.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.houseIds = this.$refs.houseItem.returnHouseId();
|
|
|
+ if (this.houseIds.length === 0) return this.$message.warning('请至少选择一个房源');
|
|
|
+ this.stepId++;
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else if (this.stepId === 2) {
|
|
|
+ let promise = [];
|
|
|
+ for (let i = 0; i < this.clauseData.length; i++) {
|
|
|
+ promise.push(new Promise((resolve, reject) => {
|
|
|
+ this.$refs['clause' + this.clauseData[i].id][0].validateForm(resolve)
|
|
|
+ }))
|
|
|
+ }
|
|
|
+ Promise.all(promise).then(res => {
|
|
|
+ this.clauseDataBox = res;
|
|
|
+ this.stepId++;
|
|
|
+ })
|
|
|
+ } else if (this.stepId === 3) {
|
|
|
+ let selectTemplate = this.$refs.selectTemplate.returnData();
|
|
|
+ let postData = JSON.parse(JSON.stringify(this.form));
|
|
|
+ postData['data'] = JSON.stringify(this.$refs.customData.listData);
|
|
|
+ if (this.$refs.tag.tagIds()) postData['tagIds'] = this.$refs.tag.tagIds();
|
|
|
+ postData['clauseList'] = this.clauseDataBox;
|
|
|
+ postData['attachment'] = selectTemplate.attachment;
|
|
|
+ postData['document'] = selectTemplate.document;
|
|
|
+ postData['projectItemTargetRoomIds'] = this.houseIds.join(',');
|
|
|
+ if (this.detailId) {
|
|
|
+ postData['id'] = this.formData.id;
|
|
|
+ updateContractAll(postData).then(res => {
|
|
|
+ if (res.state) {
|
|
|
+ this.$message.success('操作成功');
|
|
|
+ this.$emit('callback', 'init');
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ insertContract(postData).then(res => {
|
|
|
+ if (res.state) {
|
|
|
+ this.$message.success('操作成功');
|
|
|
+ this.$emit('callback', 'init');
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
insertClause(type) {
|
|
|
this.clauseData.push({
|