开发更新

jiangping

2025-06-06 a2299a6d4a6f99e9c11132138f5d3e9ec68f03ea

 admin/src/views/finance/components/bullEdit.vue

@@ -3,7 +3,7 @@
    @confirm="confirm">
    <div class="main">
      <div class="main_content">
        <el-form :model="param" label-position="top" ref="form" :rules="rules">
        <el-form :model="form" label-position="top" ref="form" :rules="rules">
          <div class="head">
            <div class="m_title">基础信息</div>
            <div class="tabs">
@@ -13,18 +13,20 @@
          </div>
          <div class="list">
            <el-form-item label="关联合同" prop="contractId">
              <el-select v-model="form.contractId" placeholder="请选择" clearable>
                <el-option v-for="(item, index) in contract" :key="index" :value="item.value" :label="item.name"></el-option>
              <el-select v-model="form.contractId" @change="changeContract" placeholder="请选择">
                <el-option v-for="(item, index) in contract" :key="index" :value="item.id" :label="item.code"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="付款方" prop="customerName">
              <el-select v-model="form.customerName" filterable placeholder="请选择">
            <el-form-item label="付款方" prop="renterName">
                <el-input v-model="form.renterName" disabled placeholder="付款方" v-trim />
            </el-form-item>
            <el-form-item label="房源" prop="ywContractRoomList">
              <el-select v-model="form.ywContractRoomList" @click="clickHouse" multiple placeholder="请选择">
                <el-option
                  v-for="(item, index) in payerList"
                  v-for="(item, index) in houseList"
                  :key="index"
                  :label="item.label"
                  :value="item.value">
                </el-option>
                  :value="item.roomId"
                  :label="item.projectName + item.buildingName + item.floorName + item.roomName" />
              </el-select>
            </el-form-item>
            <el-form-item label="费用类型" prop="costType">
@@ -32,31 +34,31 @@
                <el-option :value="0" label="租赁费"></el-option>
                <el-option :value="1" label="物业费"></el-option>
                <el-option :value="2" label="租赁押金"></el-option>
                <el-option :value="3" label="物业证金"></el-option>
                <el-option :value="3" label="物业押金"></el-option>
                <el-option :value="4" label="水电费"></el-option>
                <el-option :value="5" label="杂项费"></el-option>
                <el-option :value="6" label="其他"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="计费周期" prop="startDate" v-if="form.feeType !== 1">
            <el-form-item label="计费周期" prop="date" v-if="form.feeType !== 1">
              <el-date-picker
                type="daterange"
                range-separator="至"
                v-model="date"
                v-model="form.date"
                @change="changeDate"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                placeholder="请选择" />
            </el-form-item>
            <el-form-item label="应收金额" prop="receivableFee">
              <el-input v-model="form.receivableFee" placeholder="请输入应收金额" v-trim />
            <el-form-item label="应收金额" prop="totleFee">
              <el-input v-model="form.totleFee" placeholder="请输入应收金额" v-trim />
            </el-form-item>
            <el-form-item label="应收日期" prop="planPayDate">
              <el-date-picker type="date" v-model="form.planPayDate" value-format="yyyy-MM-dd" placeholder="请选择" />
            </el-form-item>
            <el-form-item label="所属公司" prop="companyId">
              <el-select v-model="form.companyId" placeholder="请选择" clearable>
              <el-select v-model="form.companyId" placeholder="请选择">
                <el-option
                  v-for="(item, index) in comparyList"
                  :key="index"
@@ -65,21 +67,10 @@
              </el-select>
            </el-form-item>
            <el-form-item style="width: 100%;" label="账单备注" prop="remark">
              <el-input type="textarea" :rows="5" v-model="param.remark" placeholder="请输入" />
              <el-input type="textarea" :rows="5" v-model="form.remark" placeholder="请输入" />
            </el-form-item>
          </div>
        </el-form>
      </div>
      <div class="main_house">
        <div class="title">请选择房源</div>
        <el-tree
          :data="houseList"
          show-checkbox
          node-key="id"
          :default-expanded-keys="[2, 3]"
          :default-checked-keys="[5]"
          :props="defaultProps">
        </el-tree>
      </div>
    </div>
    <div class="file_wrap">
@@ -90,187 +81,166 @@
          <el-button icon="el-icon-plus" plain>添加附件</el-button>
        </el-upload>
      </div>
      <el-table :data="param.list" stripe>
        <el-table-column prop="" label="附件名称" align="center" min-width="100" show-overflow-tooltip />
        <el-table-column prop="" label="操作人" align="center" min-width="100" show-overflow-tooltip />
        <el-table-column prop="" label="操作时间" align="center" min-width="100" show-overflow-tooltip />
        <el-table-column prop="" label="操作" align="center" min-width="100">
          <template v-slot="{ scope }">
            <span class="cu red">删除</span>
      <el-table :data="form.multifileList" stripe>
        <el-table-column prop="originname" label="附件名称" align="center" min-width="100" show-overflow-tooltip />
        <el-table-column prop="userName" label="操作人" align="center" min-width="100" show-overflow-tooltip />
        <el-table-column prop="createTime" label="操作时间" align="center" min-width="100" show-overflow-tooltip />
        <el-table-column label="操作" align="center" min-width="100">
          <template slot-scope="{row}">
            <span class="cu red" @click="dele(row.imgaddr)">删除</span>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!--  -->
    <MemberSearch ref="MemberSearchRef" />
  </GlobalWindow>
</template>

<script>
import GlobalWindow from '@/components/common/GlobalWindow'
import BaseOpera from '@/components/base/BaseOpera'
import MemberSearch from '@/components/common/MemberSearch'
import { rules } from './config'
import { create } from '@/api/bill'
import { list as listAll } from '@/api/contract'
import { companyList } from '@/api/company'
import { Message, Loading } from 'element-ui'
import { getContractRoom } from '@/api/house'
import { mapState } from 'vuex'
export default {
  components: {
    GlobalWindow,
    MemberSearch
    GlobalWindow
  },
  computed: {
    ...mapState(['userInfo'])
  },
  extends: BaseOpera,
  data() {
  data () {
    return {
      form: {
        contractId: '',
        customerName: '',
        renterName: '',
        renterId: '',
        costType: '',
        type: '',
        companyId: '',
        remark: '',
        startDate: '',
        endDate: '',
        receivableFee: '',
        totleFee: '',
        feeType: 0,
        planPayDate: ''
        planPayDate: '',
        multifileList: [],
        ywContractRoomList: [],
        date: [],
        RoomName: ''
      },
      date: [],
      
      param: {},
      rules,
      timeTab: '0',

      loadingInstance: null,
      uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/uploadBatch',
      fileList: [],
      uploadData: {
        folder: 'HIDDEN_DANGER_FILE'
        folder: 'YW_CONTRACT_BILL'
      },
      contract: [],
      payerList: [],
      
      projectList: [],
      comparyList: [], // 公司
      renterList: [], // 租客
      contacts: [], // 联系人
      value: [],
      options: [
        {
          value: 1,
          label: '东南',
          children: [{
            value: 2,
            label: '上海',
            children: [
              { value: 3, label: '普陀' },
              { value: 4, label: '黄埔' },
              { value: 5, label: '徐汇' }
            ]
          }, {
            value: 7,
            label: '江苏',
            children: [
              { value: 8, label: '南京' },
              { value: 9, label: '苏州' },
              { value: 10, label: '无锡' }
            ]
          }, {
            value: 12,
            label: '浙江',
            children: [
              { value: 13, label: '杭州' },
              { value: 14, label: '宁波' },
              { value: 15, label: '嘉兴' }
            ]
          }]
        },
        {
          value: 17,
          label: '西北',
          children: [{
            value: 18,
            label: '陕西',
            children: [
              { value: 19, label: '西安' },
              { value: 20, label: '延安' }
            ]
          }, {
            value: 21,
            label: '新疆维吾尔族自治区',
            children: [
              { value: 22, label: '乌鲁木齐' },
              { value: 23, label: '克拉玛依' }
            ]
          }]
        }
      ],
      cactiveTabs: 0,
      paramCost: {},
      payMethods: [
        { name: '一次性付款', value: 0 },
        { name: '3个月一付', value: 1 },
        { name: '6个月一付', value: 2 },
        { name: '1年一付', value: 2 },
      ],
      unitOps: [
        { name: '元/m²·天', value: 0 },
        { name: '元/m²·月', value: 1 },
        { name: '元/天', value: 2 },
        { name: '元/月', value: 3 },
        { name: '元/年', value: 4 },
        { name: '元/m²·年', value: 5 },
        { name: '元/场', value: 6 },
      ],
      houseList: [{
        id: 1,
        label: '一级 1',
        children: [{
          id: 4,
          label: '二级 1-1',
          children: [{
            id: 9,
            label: '三级 1-1-1'
          }, {
            id: 10,
            label: '三级 1-1-2'
          }]
        }]
      }, {
        id: 2,
        label: '一级 2',
        children: [{
          id: 5,
          label: '二级 2-1'
        }, {
          id: 6,
          label: '二级 2-2'
        }]
      }, {
        id: 3,
        label: '一级 3',
        children: [{
          id: 7,
          label: '二级 3-1'
        }, {
          id: 8,
          label: '二级 3-2'
        }]
      }],
      defaultProps: {
        children: 'children',
        label: 'label'
      }
      comparyList: [],
      houseList: []
    }
  },
  methods: {
    timeTabClick(val) {
    open (title, target) {
      this.title = title
      this.form.feeType = 0
      this.form.multifileList = []
      this.getListAll()
      this.getCompanyList()
      this.visible = true
      // 新建
      if (target == null) {
        this.$nextTick(() => {
          this.$refs.form.resetFields()
          this.form[this.configData['field.id']] = null
        })
        return
      }
      // 编辑
      this.$nextTick(() => {
        for (const key in this.form) {
          this.form[key] = target[key]
        }
      })
    },
    clickHouse () {
      if (!this.form.contractId) {
        return this.$message.warning('请先选择合同')
      }
    },
    changeContract (e) {
      this.form.renterName = this.contract.filter(item => {
        if (item.id === e) {
          this.form.companyId = item.companyId
          return item
        }
      })[0].renterName
      this.getHouseDate()
    },
    getHouseDate () {
      getContractRoom({ contractId: this.form.contractId, type: 0 })
        .then(res => {
          this.houseList = res
        })
    },
    confirm () {
      this.$refs.form.validate((valid) => {
        if (!valid) return
        this.isWorking = true
        let obj = JSON.parse(JSON.stringify(this.form))
        obj.ywContractRoomList = obj.ywContractRoomList.map(id => {
          return { roomId: id }
        })
        obj.billType = 0
        create(obj)
          .then(() => {
            this.visible = false
            this.$tip.apiSuccess('新建成功')
            this.$emit('success')
          })
          .finally(() => {
            this.isWorking = false
          })
      })
    },
    dele (imgaddr) {
      this.form.multifileList.forEach((item, index) => {
        if (imgaddr === item.imgaddr) {
          this.form.multifileList.splice(index, 1)
        }
      })
    },
    openHouse () {
      this.$refs.selectHouse.open('选择房源', { contractId: this.form.contractId, type: 0 })
    },
    getCompanyList () {
      companyList({ type: 2, status: 0 })
        .then(res => {
          this.comparyList = res
        })
    },
    getListAll () {
      listAll({})
        .then(res => {
          console.log(res)
          this.contract = res
        })
    },
    timeTabClick (val) {
      this.form.feeType = val
      if (val === 1) {
        this.form.startDate = ''
        this.form.endDate = ''
        this.form.date = []
      }
    },
    changeDate(e) {
    changeDate (e) {
      if (!e || e.length === 0) {
        this.form.startDate = ''
        this.form.endDate = ''
@@ -279,10 +249,7 @@
        this.form.endDate = e[1]
      }
    },
    handleRent() {
      this.$refs.MemberSearchRef.openModal()
    },
    beforeUpload(file) {
    beforeUpload (file) {
      this.loadingInstance = Loading.service({
        lock: true,
        text: 'Loading',
@@ -290,40 +257,33 @@
        background: 'rgba(0, 0, 0, 0.7)'
      })
    },
    uploadError() {
    uploadError () {
      this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
        if (this.loadingInstance) {
          this.loadingInstance.close()
        }
      })
    },
    uploadAvatarSuccess(file) {
      this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
    getDay () {
      const now = new Date();
      const year = now.getFullYear();
      const month = now.getMonth() + 1; // 加1使其从1开始
      const day = now.getDate();
      const hours = now.getHours();
      const minutes = now.getMinutes();
      const seconds = now.getSeconds();
      return `${year}-${month.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')} ${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
    },
    uploadAvatarSuccess (file) {
      this.$nextTick(() => {
        if (this.loadingInstance) {
          this.loadingInstance.close()
        }
      })
      console.log('file', file)
      const item = file.data[0]
      if (['.mp4', '.avi', '.flv', '.wmv'].some(char => item.imgaddr.includes(char))) {
        this.fileList.push({
          type: 1,
          fileurl: item.imgaddr,
          fileurlFull: item.url
        })
      } else {
        this.fileList.push({
          type: 0,
          fileurl: item.imgaddr,
          fileurlFull: item.url
        })
      }
      console.log('file', this.fileList)
      // this.$set(this.param, 'faceImg', file.imgurl)
      // this.$set(this.param, 'faceImgUrl', file.imgurlfull)
      this.form.multifileList.push({ ...item, fileurl: item.imgaddr, name: item.originname, userName: this.userInfo.realname, createTime: this.getDay() })
    },
    close() {
      this.isShowModal = false
    close () {
      this.$emit('close')
    }
  }
@@ -361,7 +321,7 @@
      .tabs {
        display: flex;
        margin-bottom: 20px;
        display: flex;
        align-items: center;
        justify-content: center;

        .tab {