开发更新

jiangping

2025-06-06 a2299a6d4a6f99e9c11132138f5d3e9ec68f03ea

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

@@ -1,37 +1,33 @@
<template>
    <GlobalWindow width="100%" :title="title" :visible.sync="isShowModal" :confirm-working="isWorking" @close="close"
    <GlobalWindow width="100%" :title="title" :visible.sync="visible" :confirm-working="isWorking" @close="close"
      @confirm="confirm">
        <div class="main">
            <div class="main_content">
                <el-form :model="param" label-position="top" ref="paramRef" :rules="rules">
                <el-form :model="form" label-position="top" ref="form" :rules="rules">
                    <div class="head">
                        <div class="m_title">流水信息</div>
                    </div>
                    <div class="list">
                        <el-form-item label="关联合同" prop="type">
                            <el-select v-model="param.type" placeholder="请选择" clearable>
                                <el-option v-for="item in types" :value="item.value" :label="item.name"></el-option>
                            </el-select>
                        <el-form-item label="关联合同" required>
                            <el-input v-model="form.contractCode" disabled placeholder="请输入" v-trim />
                        </el-form-item>
                        <el-form-item label="费用类型" prop="code">
                            <el-input v-model="param.code" placeholder="请输入合同编号" v-trim />
                        <el-form-item label="费用类型" required>
                            <el-input v-model="form.costTypeName" disabled placeholder="请输入" v-trim />
                        </el-form-item>
                        <el-form-item label="费单周期" prop="aaa">
                            <el-select v-model="param.code" placeholder="请选择" clearable>
                                <el-option v-for="item in agentList" :value="item.id" :label="item.name"></el-option>
                            </el-select>
                        <el-form-item label="计费周期" required>
                            <el-input v-model="form.date" disabled placeholder="请输入" v-trim />
                        </el-form-item>
                        <el-form-item label="应收金额" prop="">
                            <el-input v-model="param.code" placeholder="请输入实收金额" v-trim />
                        <el-form-item :label="`应${form.needReceivableFeeCopy > 0 ? '收' : '付'}金额`" required>
                            <el-input v-model="form.receivableFee" disabled placeholder="请输入" v-trim />
                        </el-form-item>
                        <el-form-item label="实收金额" prop="">
                            <el-input v-model="param.code" placeholder="请输入实收金额" v-trim />
                        <el-form-item :label="`实${form.needReceivableFeeCopy > 0 ? '收' : '付'}金额`" prop="actReceivableFee">
                            <el-input v-model="form.actReceivableFee" placeholder="请输入" v-trim />
                        </el-form-item>
                        <el-form-item label="入账日期" prop="">
                            <el-date-picker type="date" v-model="param.getDate" value-format="yyyy-MM-dd" placeholder="请选择" />
                        <el-form-item :label="`${form.needReceivableFeeCopy > 0 ? '入' : '出'}账日期`" prop="actPayDate">
                            <el-date-picker type="date" v-model="form.actPayDate" value-format="yyyy-MM-dd" placeholder="请选择" />
                        </el-form-item>
                        <el-form-item label="收款方式" prop="">
                            <el-select v-model="param.content" placeholder="请选择">
                        <el-form-item :label="`${form.needReceivableFeeCopy > 0 ? '收' : '付'}款方式`" prop="payType">
                            <el-select v-model="form.payType" placeholder="请选择">
                                <el-option label="现金" :value="1"></el-option>
                                <el-option label="网银转账" :value="2"></el-option>
                                <el-option label="POS机" :value="3"></el-option>
@@ -41,18 +37,16 @@
                                <el-option label="其它方式" :value="7"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="所属公司" prop="">
                            <el-select v-model="param.code" placeholder="请选择" clearable>
                                <el-option v-for="item in agentList" :value="item.id" :label="item.name"></el-option>
                        <el-form-item label="所属公司" prop="companyName">
                            <el-input disabled v-model="form.companyName" placeholder="请输入" />
                        </el-form-item>
                        <el-form-item label="收支账户" prop="accountId">
                            <el-select v-model="form.accountId" placeholder="请选择" clearable>
                                <el-option v-for="item in agentList" :value="item.id" :label="item.title"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="收支账户" prop="">
                            <el-select v-model="param.code" placeholder="请选择" clearable>
                                <el-option v-for="item in agentList" :value="item.id" :label="item.name"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="备注" prop="" style="width: 100%;">
                            <el-input type="textarea" :rows="6" v-model="param.content" placeholder="请输入" />
                        <el-form-item label="备注" prop="remark" style="width: 100%;">
                            <el-input type="textarea" :rows="6" v-model="form.remark" placeholder="请输入" />
                        </el-form-item>
                    </div>
                </el-form>
@@ -62,17 +56,17 @@
            <div class="head">
                <div>账单附件</div>
                <el-upload class="upload-demo" :show-file-list="false" :data="uploadData" :action="uploadImgUrl"
                           :on-success="uploadAvatarSuccess" :before-upload="beforeUpload" :on-error="uploadError">
                   :on-success="uploadAvatarSuccess" :before-upload="beforeUpload" :on-error="uploadError">
                    <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="name" 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>
@@ -83,123 +77,87 @@
<script>
  import GlobalWindow from '@/components/common/GlobalWindow'
  import BaseOpera from '@/components/base/BaseOpera'
  import { rules } from './config'
  import { ywAccountList } from '@/api/bill'
  import { create } from '@/api/ywContractRevenue'
  import { Message, Loading } from 'element-ui'
  import { mapState } from 'vuex'
  export default {
    name: "flowingWater",
    components: {
      GlobalWindow
    },
    computed: {
      ...mapState(['userInfo'])
    },
    extends: BaseOpera,
    data() {
      return {
        isShowModal: false,
        title: '',
        activeTabs: '0',
        param: {},
        rules,
        timeTab: '0',

        form: {
          billId: '',
          billType: '',
          costType: '',
          contractCode: '',
          contractId: '',
          startDate: '',
          endDate: '',
          receivableFee: '',
          date: '',
          companyId: '',
          actReceivableFee: '',
          actPayDate: '',
          payType: '',
          companyName: '',
          remark: '',
          accountId: '',
          multifileList: [],
          costTypeName: '',
          needReceivableFeeCopy: ''
        },
        rules: {
          receivableFee: [
            { required: true, message: '请输入', trigger: 'blur' }
          ],
          actPayDate: [
            { required: true, message: '请选择', trigger: 'blur' }
          ],
          payType: [
            { required: true, message: '请选择', trigger: 'blur' }
          ],
          accountId: [
            { required: true, message: '请选择', trigger: 'blur' }
          ]
        },
        loadingInstance: null,
        uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/uploadBatch',
        fileList: [],
        uploadData: {
          folder: 'HIDDEN_DANGER_FILE'
          folder: 'YW_CONTRACT_BILL'
        },

        types: [
          { name: '物业+租赁合同', value: 0 },
          { name: '租赁合同', value: 1 },
          { name: '物业合同', value: 2 },
        ],
        agentList: [], //经办人
        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 },
        ],
        agentList: []
      }
    },
    created() {
      const { param } = this
      this.title = param.id ? '编辑收款账单' : '创建收款账单'
    },
    methods: {
      tabsClick(val) {
        this.activeTabs = val
      getDayTime () {
        const today = new Date();
        const year = today.getFullYear();
        const month = today.getMonth() + 1;
        const day = today.getDate();
        return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
      },
      timeTabClick(val) {
        this.timeTab = val
      },
      getDetail() {

      confirm () {
        this.$refs.form.validate((valid) => {
          if (!valid) return
          this.isWorking = true
          create(this.form)
            .then(() => {
              this.visible = false
              this.$tip.apiSuccess('创建成功')
              this.$emit('success')
              this.$emit('refresh')
            })
            .finally(() => {
              this.isWorking = false
            })
        })
      },
      handleRent() {
        this.$refs.MemberSearchRef.openModal()
@@ -207,13 +165,24 @@
      houseChange(e) {
        console.log(e)
        console.log(this.value)

      },
      getDates (companyId) {
        ywAccountList({
          companyId,
          isdeleted: 0,
          status: 0
        }).then(res => {
          this.agentList = res
        })
      },
      dele (imgaddr) {
        this.form.multifileList.forEach((item, index) => {
          if (imgaddr === item.imgaddr) {
            this.form.multifileList.splice(index, 1)
          }
        })
      },
      beforeUpload(file) {
        // if (['video/mp4', 'video/ogg', 'video/flv', 'video/avi', 'video/wmv', 'video/rmvb', 'image/jpeg', 'image/jpg', 'image/png', 'image/gif'].indexOf(file.type) == -1) {
        //   this.$message.error('请上传正确的视频/图片格式')
        //   return false
        // }
        this.loadingInstance = Loading.service({
          lock: true,
          text: 'Loading',
@@ -228,38 +197,39 @@
          }
        })
      },
      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(() => { // 以服务的方式调用的 Loading 需要异步关闭
          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
        this.$emit('close')
      },
      open(title, target) {
        this.title = title
        this.isShowModal = true
        this.visible = true
        this.$nextTick(() => {
          this.$refs.form.resetFields();
          for (const key in this.form) {
            this.form[key] = target[key]
          }
          this.form.actPayDate = this.getDayTime()
        })
        this.getDates(target.companyId)
      }
    }
  }