renkang
2024-12-23 26b93e84d4153039ef3600355308d2a743dc3be7
admin/src/views/contract/components/contractEdit.vue
@@ -1,6 +1,4 @@
<template>
<!--  :text="activeTabs === 0 ? '下一步' : '提交'"-->
<!--  :backText="activeTabs === 0 ? '返回' : '上一步'"-->
  <GlobalWindow
    width="100%"
    :title="title"
@@ -42,7 +40,7 @@
                <el-date-picker type="date" v-model="form.endDate" @change="getHouseData" :clearable="false" value-format="yyyy-MM-dd" placeholder="请选择" />
              </el-form-item>
              <el-form-item label="归属项目" prop="projectId">
                <el-select v-model="form.projectId" placeholder="请选择">
                <el-select v-model="form.projectId" @change="getHouseTree" placeholder="请选择">
                  <el-option v-for="(item, index) in projectList" :key="index" :value="item.id" :label="item.name"></el-option>
                </el-select>
              </el-form-item>
@@ -65,8 +63,11 @@
                  <el-input v-model="form.renterName" readonly placeholder="请点击选择租客" />
                </div>
              </el-form-item>
              <el-form-item label="联系人" prop="memberName">
                <el-input v-model="form.memberName" readonly placeholder="请点击选择租客" />
              <el-form-item label="联系人" prop="memberId">
                <el-select v-model="form.memberId" placeholder="请选择">
                  <el-option v-for="(item, index) in contactsList" :key="index" :value="item.id" :label="item.name"></el-option>
                </el-select>
<!--                <el-input v-model="form.memberName" readonly placeholder="请点击选择租客" />-->
              </el-form-item>
            </div>
          </el-form>
@@ -81,6 +82,12 @@
            :default-expanded-keys="ids"
            :default-checked-keys="ids"
            :props="{ children: 'projectDataVOList', label: 'name' }">
            <span class="custom-tree-node" style="width: 100%; display: flex; align-items: center; justify-content: space-between;" slot-scope="{ node, data }">
              <span>{{ data.name }}</span>
              <span style="color: #2080f7;" v-if="data.lv === 3">
                {{ data.area }}㎡
              </span>
            </span>
          </el-tree>
        </div>
      </div>
@@ -117,10 +124,10 @@
              <div class="m_title">租赁信息</div>
              <div class="list">
                <el-form-item label="押金金额(元)" prop="zlDeposit">
                  <el-input v-model="form.zlDeposit" placeholder="请输入" v-trim />
                  <el-input v-model="form.zlDeposit" @input="clearzl" placeholder="请输入" v-trim />
                </el-form-item>
                <el-form-item label="付款方式" prop="zlPayType">
                  <el-select v-model="form.zlPayType" placeholder="请选择">
                  <el-select v-model="form.zlPayType" @change="changePayType" placeholder="请选择">
                    <el-option v-for="(item, index) in payMethods" :key="index" :value="item.value" :label="item.name"></el-option>
                  </el-select>
                </el-form-item>
@@ -134,20 +141,26 @@
                <el-button type="text" size="medium" @click="addZl">增加</el-button>
              </div>
              <div class="list">
                <div v-for="(item, index) in form.zlDetailList" :key="index">
                  <el-form-item label="起始日期" prop="time">
                    <el-date-picker type="daterange" v-model="item.time" @change="getDate1($event, index)" value-format="yyyy-MM-dd" placeholder="请选择" />
                <div style="width: 100%; display: flex; flex-wrap: wrap;" v-for="(zlDetailList, index) in form.zlDetailList" :key="index">
                  <el-form-item label="起始日期" :prop="'zlDetailList.' + index + '.time'" :rules="{
                    required: true, message: '请选择', trigger: 'blur'
                  }">
                    <el-date-picker type="daterange" v-model="zlDetailList.time" @change="getDate1($event, index)" value-format="yyyy-MM-dd" placeholder="请选择" />
                  </el-form-item>
                  <el-form-item label="合同单价" prop="price">
                    <el-input placeholder="请输入" v-model="item.price" class="input-with-select">
                      <el-select v-model="item.circleType" style="width: 150px;" slot="append" placeholder="请选择">
                  <el-form-item label="合同单价" :prop="'zlDetailList.' + index + '.price'" :rules="{
                    required: true, message: '请输入', trigger: 'blur'
                  }">
                    <el-input placeholder="请输入" v-model="zlDetailList.price" @input="clearzl" class="input-with-select">
                      <el-select v-model="zlDetailList.circleType" @change="clearzl" style="width: 150px;" slot="append" placeholder="请选择">
                        <el-option v-for="(item, index) in unitOps" :key="index" :value="item.value" :label="item.name"></el-option>
                      </el-select>
                    </el-input>
                  </el-form-item>
                  <el-form-item label="付款提前天数" prop="advanceDays">
                  <el-form-item label="付款提前天数" :prop="'zlDetailList.' + index + '.advanceDays'" :rules="{
                    required: true, message: '请输入', trigger: 'blur'
                  }">
                    <div style="display: flex; align-items: center; justify-content: space-between;">
                      <el-input v-model="item.advanceDays" placeholder="请输入" v-trim />
                      <el-input v-model="zlDetailList.advanceDays" @input="clearzl" placeholder="请输入" v-trim />
                      <el-link :underline="false" type="danger" @click="deleZl(index)" style="margin-left: 20px; flex-shrink: 0;">删除</el-link>
                    </div>
                  </el-form-item>
@@ -172,7 +185,7 @@
          </el-table-column>
          <el-table-column label="期数" align="center" show-overflow-tooltip>
            <template slot-scope="{row}">
              <el-tag type="success">{{row.sortnum}}</el-tag>
              <el-tag type="success" v-if="row.sortnum > 0">{{row.sortnum}}</el-tag>
            </template>
          </el-table-column>
          <el-table-column label="区间" align="center" show-overflow-tooltip>
@@ -200,10 +213,10 @@
              <div class="m_title">物业信息</div>
              <div class="list">
                <el-form-item label="物业押金" prop="wyDeposit">
                  <el-input v-model="form.wyDeposit" placeholder="请输入" v-trim />
                  <el-input v-model="form.wyDeposit" @input="clearwy" placeholder="请输入" v-trim />
                </el-form-item>
                <el-form-item label="付款方式" prop="wyPayType">
                  <el-select v-model="form.wyPayType" placeholder="请选择">
                  <el-select v-model="form.wyPayType" @change="changePayType1" placeholder="请选择">
                    <el-option v-for="(item, index) in payMethods" :key="index" :value="item.value" :label="item.name"></el-option>
                  </el-select>
                </el-form-item>
@@ -217,20 +230,26 @@
                <el-button type="text" size="medium" @click="addWy">增加</el-button>
              </div>
              <div class="list">
                <div v-for="(item, index) in form.wyDetailList" :key="index">
                  <el-form-item label="起始日期" prop="time">
                    <el-date-picker type="daterange" v-model="item.time" @change="getDate2($event, index)" value-format="yyyy-MM-dd" placeholder="请选择" />
                <div style="width: 100%; display: flex; flex-wrap: wrap;" v-for="(wyDetailList, index) in form.wyDetailList" :key="index">
                  <el-form-item label="起始日期" :prop="'wyDetailList.' + index + '.time'" :rules="{
                    required: true, message: '请输入', trigger: 'blur'
                  }">
                    <el-date-picker type="daterange" v-model="wyDetailList.time" @change="getDate2($event, index)" value-format="yyyy-MM-dd" placeholder="请选择" />
                  </el-form-item>
                  <el-form-item label="合同单价" prop="price">
                    <el-input placeholder="请输入" v-model="item.price">
                      <el-select v-model="item.circleType" style="width: 150px;" slot="append" placeholder="请选择">
                        <el-option v-for="(item, index) in unitOps" :key="index" :value="item.value" :label="item.name"></el-option>
                  <el-form-item label="合同单价" :prop="'wyDetailList.' + index + '.price'" :rules="{
                    required: true, message: '请输入', trigger: 'blur'
                  }">
                    <el-input placeholder="请输入" @input="clearwy" v-model="wyDetailList.price">
                      <el-select v-model="wyDetailList.circleType" @change="clearwy" style="width: 150px;" slot="append" placeholder="请选择">
                        <el-option v-for="(item, index) in unitOps1" :key="index" :value="item.value" :label="item.name"></el-option>
                      </el-select>
                    </el-input>
                  </el-form-item>
                  <el-form-item label="付款提前天数" prop="advanceDays">
                  <el-form-item label="付款提前天数" :prop="'wyDetailList.' + index + '.advanceDays'" :rules="{
                    required: true, message: '请输入', trigger: 'blur'
                  }">
                    <div style="display: flex; align-items: center; justify-content: space-between;">
                      <el-input v-model="item.advanceDays" placeholder="请输入" v-trim />
                      <el-input v-model="wyDetailList.advanceDays" @input="clearwy" placeholder="请输入" v-trim />
                      <el-link :underline="false" type="danger" @click="deleWy(index)" style="margin-left: 20px; flex-shrink: 0;">删除</el-link>
                    </div>
                  </el-form-item>
@@ -255,7 +274,7 @@
          </el-table-column>
          <el-table-column label="期数" align="center" show-overflow-tooltip>
            <template slot-scope="{row}">
              <el-tag type="success">{{row.sortnum}}</el-tag>
              <el-tag type="success" v-if="row.sortnum > 0">{{row.sortnum}}</el-tag>
            </template>
          </el-table-column>
          <el-table-column label="区间" align="center" show-overflow-tooltip>
@@ -276,7 +295,7 @@
        </div>
      </div>
    </div>
    <div class="window__footer" style="position: sticky; bottom: 0; left: 0; z-index: 9; background: #ffffff;">
    <div class="window__footer">
      <slot name="footer">
        <el-button @click="confirm" :loading="confirmWorking" type="primary">{{activeTabs === 0 ? '下一步' : '提交'}}</el-button>
        <slot name="btns" />
@@ -294,6 +313,7 @@
import MemberSearch from '@/components/common/MemberSearch'
import { rules } from './config'
import { create, getBillList } from '@/api/contract'
import { ywList } from '@/api/customer'
import { getUserList } from '@/api/system/user'
import { getProjectList, tree } from '@/api/project/ywProject'
import { companyList } from '@/api/company'
@@ -320,7 +340,7 @@
        startDate: '',
        endDate: '',
        projectId: '',
        roundedUp: '',
        roundedUp: 0,
        companyId: '',
        renterId: '',
        renterName: '',
@@ -335,6 +355,7 @@
        zlDate: [],
        zlDetailList: [
          {
            circleType: 0,
            startDate: '',
            endDate: '',
            time: [],
@@ -350,6 +371,7 @@
        wyDate: [],
        wyDetailList: [
          {
            circleType: 0,
            startDate: '',
            endDate: '',
            time: [],
@@ -367,6 +389,8 @@
      wyList: [],
      
      rules,
      contactsList: [],
      loadingInstance: null,
      uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/uploadBatch',
@@ -388,9 +412,18 @@
        { name: '一次性付款', value: 0 },
        { name: '3个月一付', value: 1 },
        { name: '6个月一付', value: 2 },
        { name: '1年一付', value: 2 },
        { name: '1年一付', value: 3 },
      ],
      unitOps: [
        { name: '元/m²·天', value: 0 },
        { name: '元/m²·月', value: 1 },
        { name: '元/天', value: 3 },
        { name: '元/月', value: 4 },
        { name: '元/年', value: 5 },
        { name: '元/m²·年', value: 2 },
        { name: '元/场', value: 6 },
      ],
      unitOps1: [
        { name: '元/m²·天', value: 0 },
        { name: '元/m²·月', value: 1 },
        { name: '元/天', value: 3 },
@@ -407,6 +440,9 @@
    open (title, target) {
      this.title = title
      this.ids = []
      this.houseList = []
      this.zlPrice = ''
      this.wyPrice = ''
      this.getUser()
      this.getProject()
      this.getCompany()
@@ -420,36 +456,113 @@
            this.form[key] = ''
          }
        }
        this.form.zlDetailList = [
          {
            startDate: '',
            endDate: '',
            time: [],
            price: '',
            advanceDays: ''
          }
        ]
        this.form.wyDetailList = [
          {
            startDate: '',
            endDate: '',
            time: [],
            price: '',
            advanceDays: ''
          }
        ]
        this.wyList = []
        this.zlList = []
        this.form.userId = this.userInfo.id
        this.form.signDate = this.getDayTime()
        this.form.startDate = this.getDayTime()
        this.form.endDate = this.getDayTime(1)
        this.getHouseTree()
        this.form.zlDetailList = [
          {
            circleType: 0,
            startDate: this.form.startDate,
            endDate: this.form.endDate,
            time: [this.form.startDate, this.form.endDate],
            price: '',
            advanceDays: ''
          }
        ]
        this.form.wyDetailList = [
          {
            circleType: 0,
            startDate: this.form.startDate,
            endDate: this.form.endDate,
            time: [this.form.startDate, this.form.endDate],
            price: '',
            advanceDays: ''
          }
        ]
        this.form.roundedUp = 0
        // this.getHouseTree()
      })
    },
    changePayType (e) {
      if (e === 0) {
        this.unitOps = [
          { name: '元/m²·天', value: 0 },
          { name: '元/m²·月', value: 1 },
          { name: '元/天', value: 3 },
          { name: '元/月', value: 4 },
          { name: '元/年', value: 5 },
          { name: '元/m²·年', value: 2 },
          { name: '元/场', value: 6 },
        ]
      } else {
        this.form.zlDetailList.forEach(item => {
          if (item.circleType === 6) {
            item.circleType = 0
          }
        })
        this.unitOps = [
          { name: '元/m²·天', value: 0 },
          { name: '元/m²·月', value: 1 },
          { name: '元/天', value: 3 },
          { name: '元/月', value: 4 },
          { name: '元/年', value: 5 },
          { name: '元/m²·年', value: 2 }
        ]
      }
      this.clearzl()
    },
    changePayType1 (e) {
      if (e === 0) {
        this.unitOps1 = [
          { name: '元/m²·天', value: 0 },
          { name: '元/m²·月', value: 1 },
          { name: '元/天', value: 3 },
          { name: '元/月', value: 4 },
          { name: '元/年', value: 5 },
          { name: '元/m²·年', value: 2 },
          { name: '元/场', value: 6 },
        ]
      } else {
        this.form.wyDetailList.forEach(item => {
          if (item.circleType === 6) {
            item.circleType = 0
          }
        })
        this.unitOps1 = [
          { name: '元/m²·天', value: 0 },
          { name: '元/m²·月', value: 1 },
          { name: '元/天', value: 3 },
          { name: '元/月', value: 4 },
          { name: '元/年', value: 5 },
          { name: '元/m²·年', value: 2 }
        ]
      }
      this.clearwy()
    },
    // 获取联系人
    getYwList () {
      ywList({
        customerId: this.form.renterId
      }).then(res => {
        this.contactsList = res
      })
    },
    getHouseData () {
      if (this.form.startDate && this.form.endDate) {
        this.getHouseTree()
        if (this.form.zlDetailList.length === 1) {
          this.form.zlDetailList[0].startDate = this.form.startDate
          this.form.zlDetailList[0].endDate = this.form.endDate
          this.form.zlDetailList[0].time = [this.form.startDate, this.form.endDate]
        }
        if (this.form.wyDetailList.length === 1) {
          this.form.wyDetailList[0].startDate = this.form.startDate
          this.form.wyDetailList[0].endDate = this.form.endDate
          this.form.wyDetailList[0].time = [this.form.startDate, this.form.endDate]
        }
      }
    },
    changeType (e) {
@@ -462,18 +575,28 @@
    getDayTime (num) {
      const today = new Date();
      const year = today.getFullYear();
      const month = today.getMonth() + 1; // 月份是从 0 开始的,因此需要加 1
      const month = today.getMonth() + 1;
      const day = today.getDate();
      if (!num) {
        return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
      } else {
        return `${year + 1}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
        return `${year + 1}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day - 1 : day - 1}`;
      }
    },
    clearzl () {
      this.zlList = []
      this.zlPrice = ''
    },
    clearwy () {
      this.wyList = []
      this.wyPrice = ''
    },
    confirm () {
      var that = this
      if (this.activeTabs === 0) {
        this.$refs.form.validate((valid) => {
          if (!valid) return
          if (this.form.roomIds.length === 0) return this.$message.warning('请选择房源!')
          this.activeTabs = 1
        })
      } else if (this.activeTabs === 1) {
@@ -486,6 +609,8 @@
              if (!valid2) {
                return
              }
              if (that.zlList.length === 0) return that.$message.warning('请先生成租赁账单!')
              if (that.wyList.length === 0) return that.$message.warning('请先生成物业账单!')
              this.submit()
            })
          })
@@ -494,6 +619,7 @@
            if (!valid1) {
              return
            }
            if (that.zlList.length === 0) return that.$message.warning('请先生成租赁账单!')
            this.submit()
          })
        } else if (this.form.type === 1) {
@@ -501,6 +627,7 @@
            if (!valid2) {
              return
            }
            if (that.wyList.length === 0) return that.$message.warning('请先生成物业账单!')
            this.submit()
          })
        }
@@ -522,10 +649,12 @@
    getDate1 (e, index) {
      this.form.zlDetailList[index].startDate = e[0]
      this.form.zlDetailList[index].endDate = e[1]
      this.clearzl()
    },
    getDate2 (e, index) {
      this.form.wyDetailList[index].startDate = e[0]
      this.form.wyDetailList[index].endDate = e[1]
      this.clearwy()
    },
    checkHouseRoom (a, b) {
      this.ids = b.checkedKeys
@@ -539,7 +668,8 @@
    getHouseTree () {
      tree({
        startDate: this.form.startDate,
        endDate: this.form.endDate
        endDate: this.form.endDate,
        projectId: this.form.projectId
      })
        .then(res => {
          res.forEach(item => {
@@ -576,6 +706,7 @@
    generateWY () {
      getBillList({ ...this.form, billType: 1 })
        .then(res => {
          this.wy = true
          let zlPrice = 0
          let arr = []
          res.forEach(item => {
@@ -590,18 +721,20 @@
    },
    addZl () {
      this.form.zlDetailList.push({
        startDate: '',
        endDate: '',
        time: [],
        circleType: 0,
        startDate: this.form.startDate,
        endDate: this.form.endDate,
        time: [this.form.startDate, this.form.endDate],
        price: '',
        advanceDays: ''
      })
    },
    addWy () {
      this.form.wyDetailList.push({
        startDate: '',
        endDate: '',
        time: [],
        circleType: 0,
        startDate: this.form.startDate,
        endDate: this.form.endDate,
        time: [this.form.startDate, this.form.endDate],
        price: '',
        advanceDays: ''
      })
@@ -609,24 +742,29 @@
    deleZl(index) {
      if (this.form.zlDetailList.length === 1) return Message.warning('至少保留一条!')
      this.form.zlDetailList.splice(index, 1)
      this.clearzl()
    },
    deleWy(index) {
      if (this.form.wyDetailList.length === 1) return Message.warning('至少保留一条!')
      this.form.wyDetailList.splice(index, 1)
      this.clearwy()
    },
    getZLDate (e) {
      this.form.zlFreeStartDate = e[0]
      this.form.zlFreeEndDate = e[1]
      this.clearzl()
    },
    getWYDate (e) {
      this.form.wyFreeStartDate = e[0]
      this.form.wyFreeEndDate = e[1]
      this.clearwy()
    },
    getTenant (row) {
      this.form.renterId = row.id
      this.form.renterName = row.name
      this.form.memberId = row.memberId
      this.form.memberName = row.memberName
      this.form.memberId = ''
      this.form.memberName = ''
      this.getYwList()
    },
    dele (imgaddr) {
      this.form.fileList.forEach((item, index) => {
@@ -703,8 +841,11 @@
    close () {
      if (this.activeTabs === 0) {
        this.$emit('close')
        this.visible = false
      } else {
        this.activeTabs = 0
        this.zlList = []
        this.wyList = []
      }
    }
  }
@@ -718,6 +859,20 @@
  position: sticky;
  top: 0;
  left: 0;
  z-index: 999;
}
.window__footer {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  z-index: 9;
  background: #ffffff;
  user-select: none;
  border-top: 1px solid #eee;
  height: 60px;
  line-height: 60px;
  text-align: center;
}
.tabs {
  border-bottom: 1px solid #DFE2E8;