From c9ad1f34a86e54b1c690c623ba661cd4131a3d71 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期四, 28 十一月 2024 18:43:32 +0800
Subject: [PATCH] Merge branch 'master' of http://139.186.142.91:10010/r/productDev/funingyunwei

---
 admin/src/views/contract/components/addCollectionBill.vue |  315 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 315 insertions(+), 0 deletions(-)

diff --git a/admin/src/views/contract/components/addCollectionBill.vue b/admin/src/views/contract/components/addCollectionBill.vue
new file mode 100644
index 0000000..1d4a3f5
--- /dev/null
+++ b/admin/src/views/contract/components/addCollectionBill.vue
@@ -0,0 +1,315 @@
+<template>
+    <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="form" label-position="top" ref="form" :rules="rules">
+                    <div class="head">
+                        <div class="m_title">鍩虹淇℃伅</div>
+                        <div class="tabs">
+                            <div class="tab" :class="{ active: form.feeType === 0 }" @click="timeTabClick(0)">鍛ㄦ湡璐圭敤</div>
+                            <div class="tab" :class="{ active: form.feeType === 1 }" @click="timeTabClick(1)">涓�娆℃�ц垂鐢�</div>
+                        </div>
+                    </div>
+                    <div class="list">
+                        <el-form-item label="鍏宠仈鍚堝悓" prop="contractCode">
+                            <el-input v-model="form.contractCode" disabled placeholder="璇疯緭鍏ュ簲鏀堕噾棰�" v-trim />
+                        </el-form-item>
+                        <el-form-item label="浠樻鏂�" prop="renterName">
+                            <el-input v-model="form.renterName" disabled placeholder="璇疯緭鍏ュ簲鏀堕噾棰�" v-trim />
+                        </el-form-item>
+                        <el-form-item label="璐圭敤绫诲瀷" prop="costType">
+                            <el-select v-model="form.costType" placeholder="璇烽�夋嫨">
+                                <el-option :value="0" label="绉熻祦璐�"></el-option>
+                                <el-option :value="1" 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="date" v-if="form.feeType !== 1">
+                            <el-date-picker
+                                type="daterange"
+                                range-separator="鑷�"
+                                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>
+                        <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-option
+                                    v-for="(item, index) in comparyList"
+                                    :key="index"
+                                    :value="item.id"
+                                    :label="item.name" />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item style="width: 100%;" label="璐﹀崟澶囨敞" prop="remark">
+                            <el-input type="textarea" :rows="5" v-model="form.remark" placeholder="璇疯緭鍏�" />
+                        </el-form-item>
+                    </div>
+                </el-form>
+            </div>
+        </div>
+    </GlobalWindow>
+</template>
+
+<script>
+  import GlobalWindow from '@/components/common/GlobalWindow'
+  import BaseOpera from '@/components/base/BaseOpera'
+  import { companyList } from '@/api/company'
+  import { mapState } from 'vuex'
+  export default {
+    name: 'addCollectionBill',
+    components: {
+      GlobalWindow
+    },
+    computed: {
+      ...mapState(['userInfo'])
+    },
+    extends: BaseOpera,
+    data () {
+      const validateArr = (rule, value, callback) => {
+        if (value.length === 0 || !value) {
+          callback(new Error('璇烽�夋嫨'));
+        } else {
+          callback();
+        }
+      };
+      return {
+        form: {
+          contractCode: '',
+          contractId: '',
+          costType: '',
+          renterName: '',
+          renterId: '',
+          remark: '',
+          startDate: '',
+          endDate: '',
+          price: 0,
+          receivableFeeCopy: '',
+          receivableFee: '',
+          feeType: 0,
+          planPayDate: '',
+          billType: 0,
+          billTypeCopy: 0,
+          date: []
+        },
+        rules: {
+          contractCode: [
+            { required: true, message: '璇疯緭鍏�', trigger: 'blur' }
+          ],
+          renterName: [
+            { required: true, message: '璇疯緭鍏�', trigger: 'blur' }
+          ],
+          costType: [
+            { required: true, message: '璇烽�夋嫨', trigger: 'blur' }
+          ],
+          date: [
+            { validator: validateArr, trigger: 'blur' }
+          ],
+          receivableFee: [
+            { required: true, message: '璇疯緭鍏�', trigger: 'blur' }
+          ],
+          planPayDate: [
+            { required: true, message: '璇烽�夋嫨', trigger: 'blur' }
+          ],
+          companyId: [
+            { required: true, message: '璇烽�夋嫨', trigger: 'blur' }
+          ]
+        },
+        comparyList: []
+      }
+    },
+    methods: {
+      open (title, target) {
+        this.title = title
+        this.getCompany()
+        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]
+          }
+        })
+      },
+      getCompany () {
+        companyList({ type: 2 })
+          .then(res => {
+            this.comparyList = res
+          })
+      },
+      timeTabClick (val) {
+        this.form.feeType = val
+        if (val === 1) {
+          this.form.startDate = ''
+          this.form.endDate = ''
+          this.date = []
+        }
+      },
+      changeDate (e) {
+        if (!e || e.length === 0) {
+          this.form.startDate = ''
+          this.form.endDate = ''
+        } else {
+          this.form.startDate = e[0]
+          this.form.endDate = e[1]
+        }
+      },
+      confirm () {
+        this.$refs.form.validate((valid) => {
+          if (!valid) return
+          let obj = JSON.parse(JSON.stringify(this.form))
+          obj.receivableFeeCopy = Number(obj.receivableFee)
+          if (obj.feeType === 0) {
+            obj.startDate = obj.startDate + ' 00:00:00'
+            obj.endDate = obj.endDate + ' 00:00:00'
+          } else {
+            obj.startDate = ''
+            obj.endDate = ''
+          }
+          obj.price = Number(obj.receivableFee)
+          obj.rowType = 1
+          obj.actReceivableFee = 0
+          this.$emit('getVal', obj)
+          this.visible = false
+        })
+      },
+      close () {
+        this.$emit('close')
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+    @import '@/assets/style/variables.scss';
+    
+    
+    .cost_tabs {
+        justify-content: flex-start;
+        border: none;
+        
+        .tab {
+            height: 36px;
+            line-height: 36px;
+            font-size: 14px;
+        }
+    }
+    
+    .main {
+        display: flex;
+        margin-bottom: 20px;
+        
+        .main_content {
+            flex: 1;
+            margin-right: 20px;
+            
+            .head {
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+                
+                .tabs {
+                    display: flex;
+                    margin-bottom: 20px;
+                    align-items: center;
+                    justify-content: center;
+                    
+                    .tab {
+                        height: 14px;
+                        line-height: 14px;
+                        cursor: pointer;
+                        border: 1px solid #ebebeb;
+                        padding: 12px 24px;
+                    }
+                    
+                    .active {
+                        font-weight: 500;
+                        color: $primary-color;
+                        border: 1px solid $primary-color;
+                    }
+                }
+            }
+            
+            .list {
+                display: flex;
+                flex-wrap: wrap;
+                
+                .el-form-item {
+                    width: 33.33%;
+                    box-sizing: border-box;
+                    padding: 0 12px;
+                }
+            }
+        }
+        
+        .main_house {
+            width: 320px;
+            padding: 24px 12px;
+            border: 1px solid #c3c6cd;
+            border-radius: 2px;
+            
+            .title {
+                font-size: 16px;
+                font-weight: 500;
+                margin-bottom: 30px;
+            }
+        }
+        
+    }
+    
+    .total {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        height: 32px;
+        background-color: #e7e9f5;
+        
+        span {
+            width: 160px;
+            text-align: center;
+        }
+    }
+    
+    .file_wrap {
+        padding: 20px 16px;
+        border: 1px solid #c3c6cd;
+        border-radius: 2px;
+        
+        .head {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+        }
+    }
+    
+    .m_title {
+        font-weight: 500;
+        font-size: 14px;
+        margin-bottom: 15px;
+        margin-top: 10px;
+    }
+</style>

--
Gitblit v1.9.3