合并

.env.development

@@ -5,4 +5,5 @@ ENV = 'development'
 #VUE_APP_BASE_API = 'http://192.168.10.107:7080'
 VUE_APP_BASE_API = 'http://192.168.10.109:11523'
 #VUE_APP_BASE_API = 'http://www.aishuhong.com:11549/prod-api/·'
+
 #VUE_APP_BASE_API = 'http://192.168.31.100:7081'

finance @ 6e137f66

-Subproject commit 6e137f66e7646a55ebb0681483b9c502249d0d84

src/api/contract.js

+import request from '@/utils/request'
+
+/************* 合同类型管理 ************/
+
+// 合同类型
+export function selectContractTypeList(data) {
+  return request({
+    url: '/contractType/queryBypage',
+    method: 'post',
+    data
+  })
+}
+// 所有合同类型
+export function selectAllContractTypeList(data) {
+  return request({
+    url: '/contractType/selectAll',
+    method: 'post',
+    data
+  })
+}
+
+// 增加合同类型
+export function addContractType(data) {
+  return request({
+    url: '/contractType/insertBatch',
+    method: 'post',
+    data
+  })
+}
+
+// 更新合同类型
+export function updateContractType(data) {
+  return request({
+    url: '/contractType/update',
+    method: 'post',
+    data
+  })
+}
+
+/************* 合同管理 ************/
+
+// 获取合同列表
+export function selectContractList(data) {
+  return request({
+    url: '/contract/queryBypage',
+    method: 'post',
+    data
+  })
+}
+
+// 获取全部合同列表
+export function selectAllContractList(data) {
+  return request({
+    url: '/contract/selectAll',
+    method: 'post',
+    data
+  })
+}
+// 增加合同
+export function addContract(data) {
+  return request({
+    url: '/contract/insert',
+    method: 'post',
+    data
+  })
+}
+
+// 获取某一个合同
+export function getContractById(data) {
+  return request({
+    url: '/contract/selectByContractId',
+    method: 'post',
+    data
+  })
+}
+
+// 更新某一个合同
+export function updateContract(data) {
+  return request({
+    url: '/contract/update',
+    method: 'post',
+    data
+  })
+}
+
+// 删除某一个合同
+export function deleteContract(data) {
+  return request({
+    url: '/contractFile/delete',
+    method: 'post',
+    data
+  })
+}
+
+//获取合同中的合同文件
+export function selectContractFiles(data) {
+  return request({
+    url: '/contractFile/selectByContractId',
+    method: 'post',
+    data
+  })
+}
\ No newline at end of file

src/api/pettyMoney.js

+import request from '@/utils/request'
+//插入一条记录
+export const insertPettyMoneyRecord = (data) => {
+    return request({
+        url: '/pettyCash/insert',
+        method: 'post',
+        data
+    })
+}
+
+//再未被审批之前可以修改
+export const updatePettyMoneyRecord = (data) => {
+    return request({
+        url: '/pettyCash/update',
+        method: 'post',
+        data
+    })
+}
+
+//财务人员审批列表
+export const selectCompanyPettyRecord = (data) => {
+    return request({
+        url: '/pettyCash/selectPagecompany',
+        method: 'post',
+        data
+    })
+}
+
+//个人申请记录
+export const selectSelfPettyRecord = (data) => {
+    return request({
+        url: '/pettyCash/selectPageuser',
+        method: 'post',
+        data
+    })
+}
+
+//某条申请详细记录
+export const selctByPettyId = (data) => {
+    return request({
+        url: '/pettyCash/selctByPettyId',
+        method: 'post',
+        data
+    })
+}
+
+//未偿还的记录
+export const selectUnrepay = (data) => { //未还款
+    return request({
+        url: '/pettyCash/selectUnapproved',
+        method: 'post',
+        data
+    })
+}
+
+//同意审批
+export const agreePetty = (data) => {
+    return request({
+        url: '/pettyCash/agree',
+        method: 'post',
+        data
+    })
+}
+
+// 拒绝审批
+export const rejectPetty = (data) => {
+    return request({
+        url: '/pettyCash/reject',
+        method: 'post',
+        data
+    })
+}
+
+/******还款********/
+
+
+
+// 同意还款
+export const agreeRepay = (data) => {
+    return request({
+        url: '/pettyRepayment/agree',
+        method: 'post',
+        data
+    })
+}
+
+// 申请还款
+export const repayMoney = (data) => {
+    return request({
+        url: '/pettyRepayment/insert',
+        method: 'post',
+        data
+    })
+}
+
+// 查询还款记录
+export const repayRecordsByPettyId = (data) => {
+    return request({
+        url: '/pettyRepayment/selectAllBypettyId',
+        method: 'post',
+        data
+    })
+}
+// 驳回还款
+export const rejectRepay = (data) => {
+    return request({
+        url: '/pettyRepayment/reject',
+        method: 'post',
+        data
+    })
+}
+
+// 修改还款信息
+export const updateRepay = (data) => {
+    return request({
+        url: '/pettyRepayment/update',
+        method: 'post',
+        data
+    })
+}
\ No newline at end of file

src/router/index.js

@@ -83,6 +83,13 @@ export const componentMap = {
   'apply_businessTravel_finance_list':()=>import('@/views/businessTravel/apply/finance/financeList').then(m=>m.default),
   'apply_businessTravel_headman_list':()=>import('@/views/businessTravel/apply/headman/headmanList').then(m=>m.default),
 
+  'contract_list':()=>import('@/views/contract/contractList').then(m=>m.default),
+  'contract_type':()=>import('@/views/contract/contractType').then(m=>m.default),
+  'add_contract':()=>import('@/views/contract/components/addContract').then(m=>m.default),
+
+  'examine_approve':()=>import('@/views/pettyMoney/examineApprove').then(m=>m.default),
+  'add_petty_money_record':()=>import('@/views/pettyMoney/addPettyMoneyRecord').then(m=>m.default),
+  'petty_money_record':()=>import('@/views/pettyMoney/pettyMoneyRecord').then(m=>m.default),
 
 }
 

src/styles/element-ui.scss

@@ -11,6 +11,21 @@
   }
 }
 
+.el-contract-upload{
+  //.el-upload-list--picture-card .el-upload-list__item
+  .el-upload--picture-card{
+    width: 60px;
+    height: 60px;
+    line-height: 70px;
+  }
+  .el-contract-upload, .el-upload-list--picture-card{
+    .el-upload-list__item{
+      width: auto;
+      height: 60px;
+    }
+  } 
+}
+
 .el-upload__input {
   display: none;
 }
@@ -82,3 +97,25 @@
 .el-range-separator {
   box-sizing: content-box;
 }
+
+.contract-description-form {
+    .required {
+        &::after{
+            content: '*';
+            color: red;
+        }
+    }
+}
+.petty-data-simple{
+  .el-badge__content.is-fixed{
+    position: relative;
+    float: left;
+    top: 10px;
+    left: -5px;
+    font-size: 11px;
+    font-weight: 400;
+    transform: none;
+    height: auto;
+    // background: #4fc08d;
+  }
+}

src/utils/download.js

+/**
+ * @param {string} url
+ * @param {string} fileName
+ */
+import axios from 'axios'
+export const downloadPDFFile = function (url, fileName) {
+    axios({
+      method: 'get',
+      url,
+      responseType: 'blob'
+    }).then((res) => {
+      // console.log('headers', res.headers)
+      // handle(res.data, fileName)
+      if (!res.data) {
+        return
+      }
+      let url = window.URL.createObjectURL(new Blob([res.data], { type: 'application/pdf' }))
+      const a = document.createElement('a')
+      a.style.display = 'none'
+      a.download = fileName
+      a.href = url
+      a.click()
+      if (document.body.contains(a)) {
+        document.body.removeChild(a)
+      }
+    })
+  }
\ No newline at end of file

src/views/contract/components/addContract.vue

+<template>
+    <!-- <el-drawer :visible.sync="drawerVisible" size="75%" :with-header="false" @closed="closeDrawer"> -->
+    <div>
+        <div class="header">
+            {{ isEdit ? '编辑合同' : '新增合同' }}
+            <!-- <i class="el-icon-close" @click="closeDrawer"></i> -->
+        </div>
+        <div class="container">
+            <el-form>
+                <el-descriptions :column="3" border class="contract-description-form">
+                    <el-descriptions-item label="母合同名称" :span="3" v-if="parseInt(formData.contractNature) === 2">
+                        <el-select v-model="formData.contractParent" :style="{ width: '100%' }" placeholder="请选择母合同名称">
+                            <el-option v-for="(item, index) in contractParentList" :key="item.contractId"
+                                :value="item.contractId" :label="item.name"></el-option>
+                        </el-select>
+                    </el-descriptions-item>
+
+                    <el-descriptions-item label="合同名称" :span="2" labelClassName="required"
+                        content-class-name="my-content">
+                        <el-input placeholder="请输入合同名称" v-model="formData.contractName"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同性质" labelClassName="required">
+                        {{ contractNatures[formData.contractNature] }}
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同乙方" labelClassName="required">
+                        <el-input placeholder="请输入合同名称合同乙方" v-model="formData.contractPaetyb"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同编号" labelClassName="required">
+                        <el-input placeholder="请输入合同编号" v-model="formData.contractNumber"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同类型" labelClassName="required">
+                        <el-select v-model="formData.typeId" :style="{ width: '100%' }" placeholder="请选择合同类型">
+                            <el-option v-for="(item, index) in contractTypeList" :key="item.id" :value="item.id"
+                                :label="item.name"></el-option>
+                        </el-select>
+                    </el-descriptions-item>
+
+                    <el-descriptions-item label="客户名称(甲方)" labelClassName="required">
+                        <el-input placeholder="请输入客户名称(甲方)" v-model="formData.contractFirstParty"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="甲方签订人" labelClassName="required">
+                        <el-input placeholder="请输入甲方签订人" v-model="formData.firstParty"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="客户联系电话" labelClassName="required">
+                        <el-input placeholder="请输入客户联系电话" v-model="formData.firstPartyPhone"></el-input>
+                    </el-descriptions-item>
+
+                    <el-descriptions-item label="客户联系地址" labelClassName="required">
+                        <el-input placeholder="请输入客户联系地址" v-model="formData.firstPartyAddress"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同开始日期" labelClassName="required">
+                        <el-date-picker align="right" type="datetime" :style="{ width: '100%' }" placeholder="请输入合同签订时间"
+                            format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
+                            v-model="formData.contractStartTime">
+                        </el-date-picker>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同结束日期" labelClassName="required">
+                        <el-date-picker align="right" type="datetime" :style="{ width: '100%' }" placeholder="请输入合同签订时间"
+                            v-model="formData.contractEndTime" format="yyyy-MM-dd HH:mm:ss"
+                            value-format="yyyy-MM-dd HH:mm:ss">
+                        </el-date-picker>
+                    </el-descriptions-item>
+
+                    <el-descriptions-item label="合同金额" labelClassName="required">
+                        <el-input placeholder="请输入合同金额" type="number" v-model="formData.contractMoney" step=“0.01”>
+                        </el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="是否含税" labelClassName="required">
+                        <el-radio-group v-model="formData.tax">
+                            <el-radio label="0">含税</el-radio>
+                            <el-radio label="1">不含税</el-radio>
+                        </el-radio-group>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="税点" labelClassName="required">
+                        <el-input placeholder="请输入税点" type="number" v-model="formData.taxPoint" min=“0.00” step=“0.01”>
+                        </el-input>
+                    </el-descriptions-item>
+
+                    <el-descriptions-item label="合同附件">
+                        <el-upload ref="uploadContractFile" list-type="picture-card" :action="action"
+                            :file-list="fileList" :data="fileParams" :auto-upload="false" :on-change="uploadOnchange"
+                            multiple accept='.pdf' class='el-contract-upload'>
+
+                            <i slot="default" class="el-icon-plus"></i>
+
+                            <div slot="file" slot-scope="{file}" class="file-list">
+
+                                <div class="avator"><i class="el-icon-document"></i></div>
+                                <div class="file-content" :title="file.name">{{ file.name }}</div>
+                                <div class="file-operate">
+                                    <span class="" @click="handleDownload(file)">
+                                        <i class="el-icon-download"></i>
+                                    </span>
+                                    &nbsp;
+                                    <span class="" @click="handleRemove(file)">
+                                        <i class="el-icon-delete"></i>
+                                    </span>
+                                </div>
+                            </div>
+                            <!-- <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+                        <div class="el-upload__tip" slot="tip">只能上传pdf文件，且不超过500kb</div> -->
+                        </el-upload>
+                    </el-descriptions-item>
+
+                </el-descriptions>
+                <div class="cell-border" :style="{ borderBottom: 0 }">
+                    签订信息
+                </div>
+                <el-descriptions :column="3" border class="contract-description-form">
+                    <el-descriptions-item label="乙方签订人" labelClassName="required">
+                        <el-input placeholder="请输入乙方签订人" v-model="formData.partybName"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同签订时间" labelClassName="required">
+                        <el-date-picker v-model="formData.signingTime" align="right" type="datetime"
+                            placeholder="请输入合同签订时间" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss">
+                        </el-date-picker>
+                    </el-descriptions-item>
+
+                    <el-descriptions-item label="合同制定人" labelClassName="required">
+                        <el-input placeholder="请输入合同制定人" v-model="formData.preparedBy"></el-input>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="合同保管人" labelClassName="required">
+                        <el-input placeholder="请输入合同保管人" v-model="formData.safekeeping"></el-input>
+                    </el-descriptions-item>
+                </el-descriptions>
+                <div class="cell-border">
+                    备注
+                </div>
+                <div class="cell-border">
+                    <el-input type="textarea" v-model="formData.contarctRemarks"></el-input>
+                </div>
+                <br />
+                <el-form-item>
+                    <el-button type="primary" @click="addContract">{{ !isEdit ? '立即创建' : '修改' }}</el-button>
+                    <!-- <el-button @click="closeDrawer">取消</el-button> -->
+                </el-form-item>
+            </el-form>
+        </div>
+        <!-- </el-drawer> -->
+    </div>
+</template>
+<script>
+import { selectAllContractTypeList, selectAllContractList, addContract, getContractById, updateContract, selectContractFiles, deleteContract } from '@/api/contract'
+import { deepClone } from '@/utils'
+import { contractNatures } from '../contractStaticData'
+import { mapGetters } from 'vuex'
+import { downloadPDFFile } from '@/utils/download'
+export default {
+    // props: ['drawerVisible'],
+    data() {
+        return {
+            // checkedContractNature: this.$route.query.contractNature,
+            formData: {
+                firstParty: '',
+                contractName: '',
+                contractNature: this.$route.query.checkedContractNature,
+                contarctRemarks: ' ',
+                contractStartTime: '',
+                contractFirstParty: '',
+                contractMoney: "0",
+                contractNumber: '',
+                contractPaetyb: '',
+                contractEndTime: '',
+                signingTime: '',
+                partybName: '',
+                taxPoint: '',
+                tax: '0',
+                typeId: '',
+                safekeeping: '',
+                firstPartyAddress: '',
+                preparedBy: '',
+                firstPartyPhone: '',
+                contractParent: ''
+            },
+            fileList: [],
+            fileParams: {},
+            contractTypeList: [],
+            contractParentList: [],
+            contractNatures: deepClone(contractNatures),
+            isEdit: false,
+            action: '',
+            uploadChange: false
+        }
+    },
+    computed: {
+        ...mapGetters([
+            'companyId'
+        ])
+    },
+    watch: {
+        '$route.query.checkedContractNature': function () {
+            this.$route.query.checkedContractNature && (this.formData.contractNature = this.$route.query.checkedContractNature);
+        }
+    },
+    created() {
+        this.action = process.env.VUE_APP_BASE_API + '/file/updataContractDocuments'
+    },
+    mounted() {
+        const { contractId } = this.$route.query
+        this.getContractTypeList()  //获取合同类型
+
+        // 编辑
+        if (this.$route.path.indexOf('/editContract') >= 0 && contractId) {
+            this.isEdit = true;
+            this.getContractDetail(contractId)
+            this.getContractFiles(contractId)  //获取合同文件
+         // 添加
+        } else if (this.$route.path.indexOf('/addContract') >= 0 && this.$route.query.checkedContractNature !== undefined) {
+            this.isEdit = false;
+            if (this.$route.query.checkedContractNature.toString() === '2') {
+                this.getParentContractList() //获取母合同列表
+            }
+        } else {
+            this.$router.back()
+        }
+    },
+    methods: {
+        // closeDrawer() {
+        //     this.$emit('closeDrawer')
+        // },
+        getParentContractList() {
+            const params = {
+                companyId: this.companyId || this.$store.getters.companyId
+            }
+            selectAllContractList(params).then(res => {
+                if (res.success) {
+                    // console.log(res.data)
+                    this.contractParentList = res.data
+                } else {
+                    this.$message.warning("获取合同类型失败")
+                }
+            })
+        },
+        addContract() {
+            let validRes = this.validFormData()
+            if (validRes.length) {
+                this.$message.warning("带 * 号必填，请正确填写信息")
+                return
+            }
+            const params = {
+                companyId: this.companyId || this.$store.getters.companyId,
+                ...this.formData
+            }
+            // const toNumberKeys = ['contractNature','contractParent','contractMoney']
+            // toNumberKeys.forEach(key => {
+            //     params[key] = Number(params[key])
+            // })
+            !this.formData.contarctRemarks && (params.contarctRemarks = ' ')
+            if (!this.isEdit) {
+                addContract(params).then(res => {
+                    if (res.success) {
+                        this.$message.success("成功添加合同")
+                        this.addContractFile(res.data)
+                        setTimeout(() => {
+                            this.$router.push({path: '/contractList'})
+                        }, 1000);
+                    } else {
+                        this.$message.warning("添加合同失败")
+                    }
+                })
+            } else {
+                this.addContractFile(this.formData.contractId)
+                updateContract(params).then(res => {
+                    if (res.success) {
+                        this.$message.success("成功修改合同")
+                        setTimeout(() => {
+                            this.$router.push({path: '/contractList'})
+                        }, 1000);
+                    } else {
+                        this.$message.warning("添加修改失败")
+                    }
+                })
+            }
+
+        },
+        uploadOnchange(file, fileList) {
+            this.uploadChange = true
+        },
+        addContractFile(contractId) {
+            this.fileParams.Id = String(contractId)
+            this.uploadChange && this.$refs.uploadContractFile.submit()
+        },
+        getContractTypeList() {
+            const params = {
+                state: 0,
+                companyId: this.companyId || this.$store.getters.companyId
+            }
+            selectAllContractTypeList(params).then(res => {
+                if (res.success) {
+                    // console.log(res.data)
+                    this.contractTypeList = res.data
+                } else {
+                    this.$message.warning("获取合同类型失败")
+                }
+            })
+        },
+        getContractDetail(contractId) {
+            if (contractId) {
+                const params = {
+                    contractId
+                }
+                getContractById(params).then(res => {
+                    if (res.success) {
+                        // console.log(res.data)
+                        if (res.data.contractNature.toString() === '2') {
+                            this.getParentContractList()
+                        }
+                        this.formData = res.data
+                    } else {
+                        this.$message.warning("获取合同失败")
+                    }
+                })
+                // get()
+            }
+        },
+        getContractFiles(contractId) {
+            const params = {
+                contractId
+            }
+            selectContractFiles(params).then(res => {
+                if (res.success) {
+                    this.fileList = res.data.map(item => {
+                        item.name = item.filePath.slice(item.filePath.lastIndexOf('/') + 1, item.filePath.length)
+                        return item
+                    })
+                } else {
+                    this.fileList = []
+                }
+            })
+        },
+        handleDownload(file) {
+            let {name, filePath} = file
+            let url = process.env.VUE_APP_BASE_API + filePath;
+            downloadPDFFile(url, name)
+        },
+        handleRemove(file) {
+            deleteContract(file).then(res => {
+                if(res.success){
+                    this.$message.success("成功删除合同文件")
+                    this.getContractFiles(file.contractId)
+                }else{
+                    this.$message.warning("删除合同文件失败")
+                }
+            })
+        },
+        validFormData() {
+            let requiredParams = deepClone(this.formData);
+            delete requiredParams.contractParentName
+            let result = []
+            delete requiredParams.contarctRemarks
+            if (!this.$route.query.checkedContractNature || this.$route.query.checkedContractNature.toString() !== '2'){
+                delete requiredParams.contractParent //非母合同
+            }
+            for (const key in requiredParams) {
+                if(!requiredParams[key] && requiredParams[key] !== 0){
+                    result.push(key)
+                }
+            }
+            return result
+        }
+    }
+}
+</script>
+<style rel="stylesheet/scss" scoped lang="scss">
+.header {
+    padding: 25px 15px;
+
+    i {
+        float: right;
+        color: gray;
+        cursor: pointer;
+    }
+}
+
+.container {
+    padding: 0 15px;
+
+    .cell-border {
+        border: 1px solid #e6ebf5;
+        border-top: 0;
+        // border-bottom: 0;
+        padding: 12px 10px;
+        font-weight: 600;
+        font-size: 14px;
+    }
+
+}
+
+.file-list {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    width: 250px;
+    padding: 0 5px;
+
+    .avator {
+        width: 10%;
+        font-size: 32px;
+        color: #d75b5b;
+    }
+
+    .file-content {
+        width: 80%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        padding-left: 10px;
+    }
+
+    .file-operate {
+        width: 15%;
+        font-size: 16px;
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+
+        span {
+            cursor: pointer;
+        }
+
+    }
+
+}
+</style>
\ No newline at end of file

src/views/contract/contractList.vue

+<template>
+    <div class="main">
+        <div class="header">
+            <el-form :inline="true" :model="contractQuery">
+                <!-- 合同名称，合同编号，合同类型，合同性质 -->
+                <el-form-item>
+                    <el-input v-model="contractQuery.contractName" placeholder="请选择合同名称" />
+                </el-form-item>
+                <el-form-item>
+                    <el-input v-model="contractQuery.contractNumber" placeholder="请选择合同编号" />
+                </el-form-item>
+                <el-form-item>
+                    <el-select v-model="contractQuery.typeId" placeholder="请选择合同类型">
+                        <el-option v-for="(item, index) in contractTypeList" :key="item.id" :value="item.id"
+                            :label="item.name"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-select v-model="contractQuery.contractNature" placeholder="合同状态">
+                        <el-option v-for="(item, index) in contractNatures" :key="index" :label="item" :value="index">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" icon="el-icon-search" @click="getContractList(true)">查询</el-button>
+                    <el-button type="primary" icon="el-icon-refresh-right" @click="contractQuery = {}">重置</el-button>
+                    <el-button type="success" icon="el-icon-circle-plus-outline" @click="dialogTableVisible = true">添加合同
+                    </el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="container">
+            <el-table :data="contractList" style="width: 100%;text-align: center;" border>
+                <el-table-column label="编号" width="50px">
+                    <template slot-scope="scope">
+                        {{ (contractPageQuery.pageNum - 1) * contractPageQuery.pageSize + scope.$index + 1 }}
+                    </template>
+                </el-table-column>
+                <!-- <el-table-column prop="companyName" label="状态"/> -->
+                <el-table-column prop="contractNumber" label="合同编号" width="120px" />
+                <el-table-column prop="contractName" label="合同名称" width="200px" />
+                <el-table-column label="合同类型">
+                    <template slot-scope="scope">
+                        <!-- {{Object.values(contractTypeList.find(item => item.id === scope.row.typeId)).toString()}} -->
+                        <!-- {{Object.values(contractTypeList.find(item => item.id === scope.row.typeId))}} -->
+                        {{ contractTypeList.find(item => item.id === scope.row.typeId) && contractTypeList.find(item =>
+                                item.id === scope.row.typeId).name
+                        }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="contractNature" label="合同性质">
+                    <template slot-scope="scope">
+                        {{ contractNatures[scope.row.contractNature] }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="contractMoney" label="合同金额/元" />
+                <el-table-column prop="partybName" label="签定人" width="100px" />
+                <el-table-column prop="safekeeping" label="保管人" width="100px" />
+                <el-table-column prop="contractStartTime" label="签订时间" />
+                <el-table-column prop="companyCreateTime" label="操作">
+                    <template slot-scope="scope">
+                        <el-button type="text" icon="el-icon-edit"
+                            @click="$router.push({ path: '/editContract', query: { contractId: String(scope.row.contractId) } })">
+                            编辑
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+
+        <div class="footer">
+            <el-pagination @current-change="getContractList" :current-page.sync="contractPageQuery.pageNum"
+                :page-size="contractPageQuery.pageSize" layout="total, prev, pager, next" :total="total">
+            </el-pagination>
+        </div>
+
+        <el-dialog title="添加合同" :visible.sync="dialogTableVisible">
+            <el-radio-group v-model="checkedContractNature">
+                <el-radio v-for="(item, index) in contractNatures" :key="index" :label="index">{{ item }}</el-radio>
+            </el-radio-group>
+            <span slot="footer" class="dialog-footer">
+                <el-button type="primary"
+                    @click="$router.push({ path: '/addContract', query: { checkedContractNature: String(checkedContractNature) } })">
+                    下一步</el-button>
+                <el-button @click="dialogTableVisible = false">取消</el-button>
+            </span>
+        </el-dialog>
+        <!-- <add-conctract :drawerVisible="drawerVisible" @addConctract="addConctract" @closeDrawer="drawerVisible=false"></add-conctract> -->
+    </div>
+</template>
+<script>
+// import AddConctract from './components/addContract.vue'
+import { selectContractList, selectAllContractTypeList } from "@/api/contract"
+import { deepClone } from "@/utils"
+import { mapGetters } from 'vuex'
+import { contractNatures as contractNatureList } from './contractStaticData'
+export default {
+    // components: {
+    //     AddConctract
+    // },
+    computed: {
+        ...mapGetters([
+            'companyId'
+        ]),
+    },
+    data() {
+        return {
+            contractList: [],
+            contractTypeList: [],
+            typeList: [],
+            type: '',
+            total: 0,
+            contractQuery: {
+                typeId: '',
+                contractNature: '',
+                contractName: '',
+                contractNumber: ''
+            },
+            contractPageQuery: {
+                pageSize: 10,
+                pageNum: 1,
+            },
+            contractNatures: deepClone(contractNatureList),
+            dialogTableVisible: false,
+            checkedContractNature: 0
+            // drawerVisible: false,
+        }
+    },
+    mounted() {
+        this.getContractTypeList()
+        this.getContractList()
+    },
+    methods: {
+        getContractTypeList() {
+            const params = {
+                state: 0,
+                companyId: this.companyId || this.$store.getters.companyId
+            }
+            selectAllContractTypeList(params).then(res => {
+                if (res.success) {
+                    // console.log(res.data)
+                    this.contractTypeList = res.data
+                } else {
+                    this.$message.warning("获取合同类型失败")
+                }
+            })
+        },
+        getContractList(isCondition = false) {
+            const params = {
+                ...this.contractPageQuery,
+                companyId: this.companyId || this.$store.getters.companyId
+            }
+            isCondition && Object.assign(params, this.contractQuery)
+            selectContractList(params).then(res => {
+                if (res.success) {
+                    this.total = res.data.total
+                    this.contractList = res.data.list
+                } else {
+                    this.$message.error("获取数据失败")
+                }
+            })
+        },
+        addConctract(params) {
+            console.log(params)
+        }
+    }
+}
+</script>
+<style scoped lang="scss">
+.main {
+    padding: 15px;
+    .footer {
+        text-align: right;
+    }
+}
+
+</style>

src/views/contract/contractStaticData.js

+export const contractNatures = ['普通合同','框架合同','补充协议','其它合同']
\ No newline at end of file

src/views/contract/contractType.vue

+<template>
+    <div class="main">
+        <div class="header">
+            <el-button type="success" icon="el-icon-circle-plus-outline" @click="dialogFormVisible = true;">
+                添加类型
+            </el-button>
+        </div>
+        <div class="container">
+            <el-table :data="contractTypeList" style="width: 100%;text-align: center;" border>
+                <el-table-column label="序号" width="50px">
+                    <template slot-scope="scope">
+                        {{ (contractTypeQuey.pageNum - 1) * contractTypeQuey.pageSize + scope.$index + 1 }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="name" label="类别名称" />
+                <el-table-column prop="state" label="启用状态" width="100px">
+                    <template slot-scope="scope">
+                        <el-switch v-model="scope.row.state"
+                            @change="update({ ...scope.row, state: Math.abs(scope.row.state - 1) })"
+                            active-color="#13ce66" inactive-color="#ff4949">
+                        </el-switch>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" width="100px">
+                    <template slot-scope="scope">
+                        <el-button type="text" icon="el-icon-edit" @click="edit(scope.row)">编辑
+                        </el-button>
+                    </template>
+                </el-table-column>
+
+            </el-table>
+        </div>
+
+        <div class="footer">
+            <el-pagination @current-change="getContractTypeList" :current-page.sync="contractTypeQuey.pageNum"
+                :page-size="contractTypeQuey.pageSize" layout="total, prev, pager, next" :total="total">
+            </el-pagination>
+        </div>
+
+        <el-dialog :title="(isEdit ? '修改' : '添加') + '合同类型'" :visible.sync="dialogFormVisible" @closed="resetData">
+            <el-form ref="form" :model="dynamicValidateForm" label-width="130px">
+                <el-form-item label="合同类型名称" prop="name" :rules="[{ required: true, message: '请输入合同类型名称' }]">
+                    <el-input v-model="dynamicValidateForm.name" autocomplete="off"></el-input>
+                </el-form-item>
+
+                <el-form-item v-show="!isEdit" v-for="(name, index) in dynamicValidateForm.names"
+                    :label="'合同类型名称' + (parseInt(index) + 1)" :prop="'names.' + index + '.value'" :key="index" :rules="[{
+                        required: true, message: '合同类型名称不能为空', trigger: 'blur'
+                    }]">
+                    <el-input v-model="name.value">
+                        <el-button slot="append" icon="el-icon-delete"
+                            @click.prevent="dynamicValidateForm.names.splice(index, 1)">删除
+                        </el-button>
+                    </el-input>
+                </el-form-item>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button v-if="!isEdit" @click="dynamicValidateForm.names.push({ value: '' });">增加类型</el-button>
+                <el-button @click="resetData">取 消</el-button>
+                <el-button v-if="isEdit" type="primary" @click="update(dynamicValidateForm)">确 定</el-button>
+                <el-button v-else type="primary" @click="addContractType">确 定</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+<script>
+import {
+    selectContractTypeList,
+    addContractType as insert,
+    updateContractType
+} from '@/api/contract'
+import { mapGetters } from 'vuex'
+
+export default {
+    computed: {
+        ...mapGetters([
+            'companyId'
+        ])
+    },
+    data() {
+        return {
+            contractTypeQuey: {
+                pageSize: 10,
+                pageNum: 1,
+            },
+            total: 0,
+            contractTypeList: [],
+            typeList: [],
+            dialogFormVisible: false,
+            dynamicValidateForm: { names: [] },
+            isEdit: false
+        }
+    },
+    mounted() {
+        this.getContractTypeList()
+    },
+    methods: {
+        resetData() {
+            this.isEdit = false;
+            this.dialogFormVisible = false
+            this.dynamicValidateForm = { names: [], name: '' }
+            this.$refs.form.resetFields();
+        },
+        edit(data) {
+            this.isEdit = true;
+            this.dialogFormVisible = true;
+            this.dynamicValidateForm = { ...data }
+        },
+        getContractTypeList(data) {
+            const params = {
+                companyId: this.companyId || this.$store.getters.companyId,
+                // "name": "string", //select
+                // "searchCount": true, //select
+                // "state": 0, //select
+                ...this.contractTypeQuey,
+                ...data
+            }
+            selectContractTypeList(params).then((res) => {
+                if (res.success) {
+                    this.contractTypeList = res.data.list.map(item => { return { ...item, state: parseInt(item.state) === 0 } })
+                    this.total = res.data.total
+                } else {
+                    this.contractTypeList = []
+                    this.total = 0
+                }
+
+            })
+        },
+        update(data) {
+            function updateCore() {
+                const params = {
+                    companyId: this.companyId || this.$store.getters.companyId,
+                    ...data
+                }
+                !Number.isInteger(data.state) && (params.state = Number(!data.state))
+                updateContractType(params).then(res => {
+                    if (res.success) {
+                        this.$message.success("修改成功")
+                        this.dialogFormVisible && (this.dialogFormVisible = false)
+                        this.getContractTypeList()
+                    }
+                })
+            }
+            if (this.$refs.form) {
+                this.$refs.form.validate((valida) => {
+                    if (valida) {
+                        updateCore.call(this)
+                    }
+                })
+            } else {
+                updateCore.call(this)
+            }
+
+        },
+        addContractType() {
+            this.$refs.form.validate((valida) => {
+                if (valida) {
+                    const data = {
+                        state: 0,//默认开启,
+                        companyId: this.companyId || this.$store.getters.companyId,
+                    }
+                    let params = [{
+                        ...data,
+                        name: this.dynamicValidateForm.name
+                    }]
+                    if (this.dynamicValidateForm.names.length) {
+                        params = params.concat(this.dynamicValidateForm.names.map(name => { return { ...data, name: name.value } }))
+                    }
+                    insert(params).then((res) => {
+                        if (res.success) {
+                            this.$message.success("添加成功")
+                            this.resetData()
+                            this.getContractTypeList()
+                        } else {
+                            this.$message.error(res.msg)
+                        }
+                    })
+                }
+            })
+        }
+    }
+}
+</script>
+<style scoped lang="scss">
+.main {
+    padding: 15px;
+
+    .header {
+        margin-bottom: 10px;
+    }
+
+    .footer {
+        text-align: right;
+    }
+}
+</style>

src/views/permission/menu.vue

 <template>
   <div class="app-container">
-    <p>管理动态路由</p>
-    <el-button type="primary" @click="addFirst">添加第一级路由</el-button>
-    <el-tree :data="data" node-key="id" default-expand-all :props="defaultProps" :expand-on-click-node="false">
+    <el-button type="success" icon="el-icon-circle-plus-outline" @click="addFirst" size="small">添加路由</el-button>
+    <el-tree :data="data" node-key="id" default-expand-all :expand-on-click-node="false">
       <span class="custom-tree-node" slot-scope="{ node, data }">
-        <span>{{ node.label }}</span>
+        <span>{{ data.title }}</span>
         <span>
           <svg-icon v-if="!convertToBool(data.hidden)" icon-class="eye-open" />
           <svg-icon v-else icon-class="eye" />
@@ -99,10 +98,6 @@ export default {
       dialogVisible: false,
       dialogType: 'new',
       dialogTitle: '新增一级菜单',
-      defaultProps: {
-        children: 'children',
-        label: 'title'
-      },
       rules: {
         path: [{
           required: true, validator: pathValid, trigger: "blur"
@@ -121,7 +116,7 @@ export default {
 
   methods: {
     append(data) {
-      console.log(this.dialogTyp)
+      // console.log(this.dialogTyp)
       this.dialogType = 'new'
       this.dialogTitle = '新增<' + data.title + '>的子菜单'
       this.dialogVisible = true

src/views/permission/role.vue

@@ -6,7 +6,7 @@
       <el-table-column align="center" label="序号" width="80">
         <template slot-scope="scope">
           {{
-            (roleQuery.pageNum - 1) * roleQuery.pageSize + scope.$index + 1
+              (roleQuery.pageNum - 1) * roleQuery.pageSize + scope.$index + 1
           }}
         </template>
       </el-table-column>
@@ -22,51 +22,37 @@
       </el-table-column>
       <el-table-column align="center" label="操作">
         <template slot-scope="scope">
-          <el-button type="primary" size="small" @click="handleEdit(scope)" >编辑角色信息和分配角色路由</el-button>
-          <el-button type="danger" size="small" @click="handleDelete(scope)" >删除角色</el-button>
+          <el-button type="primary" size="small" @click="handleEdit(scope)">编辑角色信息和分配角色路由</el-button>
+          <el-button type="danger" size="small" @click="handleDelete(scope)">删除角色</el-button>
         </template>
       </el-table-column>
     </el-table>
 
     <div class="footer">
-      <el-pagination
-        :current-page.sync="roleQuery.pageNum"
-        :page-size="roleQuery.pageSize"
-        layout="total, prev, pager, next"
-        :total="total"
-        @current-change="handleCurrentChange"
-      />
+      <el-pagination :current-page.sync="roleQuery.pageNum" :page-size="roleQuery.pageSize"
+        layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange" />
     </div>
 
     <el-dialog :visible.sync="dialogVisible" :title="dialogType">
-      <el-form :model="role" label-width="80px" label-position="left">
-        <el-form-item label="角色名称">
+      <el-form ref="form" :model="role" label-width="80px" label-position="left" :rules="rules">
+        <el-form-item label="角色名称" prop="rlName">
           <el-input v-model="role.rlName" placeholder="角色名称" />
         </el-form-item>
-        <el-form-item label="角色描述">
-          <el-input
-            v-model="role.rlDesc"
-            :autosize="{ minRows: 2, maxRows: 4}"
-            type="textarea"
-            placeholder="角色描述"
-          />
+        <el-form-item label="角色描述" prop="rlDesc">
+          <el-input v-model="role.rlDesc" :autosize="{ minRows: 2, maxRows: 4 }" type="textarea" placeholder="角色描述" />
         </el-form-item>
         <el-form-item label="路由树">
-          <el-tree
-            ref="tree"
-            :check-strictly="checkStrictly"
-            :data="routesData"
-            :props="defaultProps"
-            @check="checkTree"
-            show-checkbox
-            default-expand-all
-            node-key="id"
-            class="permission-tree"
-          />
+          <el-tree ref="tree" :check-strictly="true" :data="routesData" @check="checkTree" show-checkbox
+            default-expand-all node-key="id">
+            <span slot-scope="{data}">
+              {{ data.title }}
+              <span class="explain-text">{{ data.explain }}</span>
+            </span>
+          </el-tree>
         </el-form-item>
       </el-form>
       <div style="text-align:right;">
-        <el-button type="danger" @click="dialogVisible=false">取消</el-button>
+        <el-button type="danger" @click="dialogVisible = false">取消</el-button>
         <el-button type="primary" @click="confirmRole">提交</el-button>
       </div>
     </el-dialog>
@@ -78,20 +64,20 @@
 <script>
 import path from 'path'
 import { deepClone } from '@/utils'
-import { getRoles,addRole,deleteRole, updateRole} from '@/api/role'
-import { getRoutes} from '@/api/auth'
+import { getRoles, addRole, deleteRole, updateRole } from '@/api/role'
+import { getRoutes } from '@/api/auth'
 
 const defaultRole = {
   rlId: 0,
   rlName: '',
   rlDesc: '',
   routes: [],
-  companyId:'',
+  companyId: '',
 }
 
 export default {
-  data(){
-    return{
+  data() {
+    return {
       roleQuery: {
         companyId: null,
         pageNum: 1,
@@ -99,54 +85,53 @@ export default {
       },
       total: 0,
       role: Object.assign({}, defaultRole),
-      rolesList:[],
-      routes:null,
+      rolesList: [],
+      routes: null,
 
-      dialogType:"新增角色",
-      dialogVisible:false,
-
-      checkStrictly: true,// 父子节点 checkbox的选择是否关联
-      defaultProps: {                       // 角色树
-        children: 'children',
-        label: 'title'
-      },
-      companyId:'',
+      dialogType: "新增角色",
+      dialogVisible: false,
+      companyId: '',
+      rules: {
+        rlName: [{ required: true, message: "角色名称不能为空" }],
+        rlDesc: [{ required: true, message: "角色描述不能为空" }]
+      }
     }
   },
   created() {
     this.roleQuery.companyId = this.$store.getters.companyId
-    this.companyId=this.$store.getters.companyId;
+    this.companyId = this.$store.getters.companyId;
     this.getRoutes()
     this.getRoles()
   },
   computed: {
     routesData() {
+      // console.log(this.routes)
       return this.routes
     },
   },
-  methods:{
+  methods: {
     //handleCurrentChange
-    handleCurrentChange(val){
+    handleCurrentChange(val) {
       this.roleQuery.pageNum = val
       this.getRoles()
     },
     //获取角色
     getRoles() {
-      getRoles (this.roleQuery).then((res)=>{
-        if(res.status == "success"){
+      getRoles(this.roleQuery).then((res) => {
+        if (res.status == "success") {
           this.rolesList = res.data.list
           this.total = res.data.total
-        }else{
+        } else {
           this.$message.error(res.data)
         }
-      }).catch((error)=>{
+      }).catch((error) => {
         this.$message.error("查询数据失败")
       })
     },
     //获取路由
     getRoutes() {
-      getRoutes().then((res)=>{
-        if(res.status == "success"){
+      getRoutes().then((res) => {
+        if (res.status == "success") {
           this.serviceRoutes = res.data
           this.routes = this.generateRoutes(res.data)
         }
@@ -155,45 +140,47 @@ export default {
     //处理路由数据
     generateRoutes(routes, basePath = '/') {
       const res = []
-      console.log(routes)
-      if(this.$store.getters.roles[0] != 1){
-          //不是超管
-          
-          for (let route of routes) {
-              if(route.id != 1 && route.id != 113){
-                const data = {
-                  path: path.resolve(basePath, route.path),
-                  title: route.meta && (route.menuExplain ? `${route.meta.title}（${route.menuExplain}）`: route.meta.title),
-                  id: route.id
-                }
-                if (route.children.length>0) { 
-                  data.children = this.generateRoutes(route.children, data.path)
-                }
-                res.push(data)
-              }
+      // console.log(routes)
+      if (this.$store.getters.roles[0] != 1) {
+        //不是超管
+
+        for (let route of routes) {
+          if (route.id != 1 && route.id != 113) {
+            const data = {
+              path: path.resolve(basePath, route.path),
+              title: route.meta && route.meta.title,
+              explain: route.menuExplain,
+              id: route.id
             }
-        }else{
-          //是超管
-          for (let route of routes) {
-              
-                const data = {
-                  path: path.resolve(basePath, route.path),
-                  title: route.meta && (route.menuExplain ? `${route.meta.title}（${route.menuExplain}）`: route.meta.title),
-                  id: route.id
-                }
-                if (route.children.length>0) { 
-                  data.children = this.generateRoutes(route.children, data.path)
-                }
-                res.push(data)
-              
+            if (route.children.length > 0) {
+              data.children = this.generateRoutes(route.children, data.path)
             }
-          
+            res.push(data)
+          }
         }
-      
+      } else {
+        //是超管
+        for (let route of routes) {
+
+          const data = {
+            path: path.resolve(basePath, route.path),
+            title: route.meta && route.meta.title,
+            explain: route.menuExplain,
+            id: route.id
+          }
+          if (route.children.length > 0) {
+            data.children = this.generateRoutes(route.children, data.path)
+          }
+          res.push(data)
+
+        }
+
+      }
+
       return res
     },
     //新增角色
-    handleAddRole(){
+    handleAddRole() {
       this.role = Object.assign({}, defaultRole)
       this.role.companyId = this.$store.getters.companyId
       if (this.$refs.tree) {
@@ -203,10 +190,10 @@ export default {
       this.dialogVisible = true
     },
     //编辑角色
-    handleEdit(scope){
+    handleEdit(scope) {
       this.dialogType = '编辑角色'
       this.dialogVisible = true
-      console.log(scope)
+      // console.log(scope)
       this.role = deepClone(scope.row)
       this.$nextTick(() => {
         const selectedKeys = this.generateArr(this.role.routes)
@@ -221,80 +208,88 @@ export default {
           if (temp.length > 0) {
             data = [...data, ...temp]
           }
-        }else{
+        } else {
           data.push(route.id)
         }
       })
       return data
     },
     //删除角色
-    handleDelete({ $index, row }){
+    handleDelete({ $index, row }) {
       this.$confirm('确定要删除该角色吗?', 'Warning', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       })
         .then(() => {
-          deleteRole(row.rlId).then((res)=>{
-            if(res.status == 'success'){
+          deleteRole(row.rlId).then((res) => {
+            if (res.status == 'success') {
               this.$message.success("删除成功")
               this.rolesList.splice($index, 1)
-            }else{
+            } else {
               this.$message.error(res.data)
             }
-          }).catch((error)=>{
+          }).catch((error) => {
             this.$message.error("删除失败")
           })
         })
         .catch(err => { console.error(err) })
     },
     //提交
-    confirmRole(){
-
-      const isEdit = this.dialogType === '编辑角色'
-      // 获取选中权限树id
-      const checkedKeys = this.$refs.tree.getCheckedKeys()
-      if (checkedKeys){
-        let routes = []
-        checkedKeys.forEach(key => {
-          let obj = {id:key}
-          routes.push(obj)
-        })
-        // 将menu对象数组，赋给要添加的role
-        this.role.routes = routes
-      }
-      if (isEdit) { // 修改角色
-        updateRole(this.role).then((res)=>{
-          if(res.status=="success"){
-            this.$message.success("修改成功")
-            this.getRoles()
-          }else{
-            this.$message.error(res.data)
+    confirmRole() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          const isEdit = this.dialogType === '编辑角色'
+          // 获取选中权限树id
+          const checkedKeys = this.$refs.tree.getCheckedKeys()
+          if (checkedKeys) {
+            let routes = []
+            checkedKeys.forEach(key => {
+              let obj = { id: key }
+              routes.push(obj)
+            })
+            // 将menu对象数组，赋给要添加的role
+            this.role.routes = routes
           }
-        }).catch((error)=>{
-          this.$message.error("修改失败")
-        })
+          if (isEdit) { // 修改角色
+            updateRole(this.role).then((res) => {
+              if (res.status == "success") {
+                this.$message.success("修改成功")
+                this.getRoles()
+              } else {
+                this.$message.error(res.data)
+              }
+            }).catch((error) => {
+              this.$message.error("修改失败")
+            })
 
-      }else{
-        //新增角色
-        addRole(this.role).then((res)=>{
-          if(res.status=="success"){
-            this.$message.success("添加成功")
-            this.getRoles()
-          }else{
-            this.$message.error(res.data)
+          } else {
+            //新增角色
+            addRole(this.role).then((res) => {
+              if (res.status == "success") {
+                this.$message.success("添加成功")
+                this.getRoles()
+              } else {
+                this.$message.error(res.data)
+              }
+            }).catch((error) => {
+              this.$message.error("添加失败")
+            })
           }
-        }).catch((error)=>{
-          this.$message.error("添加失败")
-        })
-      }
-      this.dialogVisible = false
+          this.dialogVisible = false
+        }else{
+          this.$message({
+              type: 'warning',
+              message: '请填写正确信息！'
+            })
+        }
+      })
     },
 
 
 
     //点击树
-    checkTree(data){
+    checkTree(data) {
       const node = this.$refs.tree.getNode(data.id);
       this.setNode(node);
     },
@@ -332,4 +327,12 @@ export default {
 .footer {
   text-align: right;
 }
+
+.explain-text {
+  font-size: 12px;
+  font-weight: 400;
+  display: inline-block;
+  padding-left: 10px;
+  color: #949494;
+}
 </style>
\ No newline at end of file

src/views/personal/personal.vue

@@ -39,10 +39,12 @@
                   <el-tag v-for="item in userData.roleList" :key="item.rlId">{{item.rlName}}</el-tag>
                 </template>
               </el-form-item>
+              <el-form-item>
+                <el-button type="info" v-if="userupdata" icon="el-icon-edit" @click="userupdata = false">修改</el-button>
+                <el-button type="warning" v-if="!userupdata" @click="cancelUpdateUser">取消</el-button>
+                <el-button type="success" v-if="!userupdata" icon="el-icon-upload2" @click="updateUser">提交</el-button>
+              </el-form-item>
             </el-form>
-            <el-button type="info" v-if="userupdata" icon="el-icon-edit" @click="userupdata = false">修改</el-button>
-            <el-button type="warning" v-if="!userupdata" @click="cancelUpdateUser">取消</el-button>
-            <el-button type="success" v-if="!userupdata" icon="el-icon-upload2" @click="updateUser">提交</el-button>
           </el-col>
         </el-row>
       </el-tab-pane>
@@ -60,9 +62,12 @@
               <el-form-item label="确认密码" prop="confirmPassword">
                 <el-input type="password" show-password v-model="passwordData.confirmPassword"></el-input>
               </el-form-item>
+              <el-form-item >
+                <el-button type="primary" icon="el-icon-refresh-left" @click="passReset">重置信息</el-button>
+                <el-button type="success" icon="el-icon-upload2" @click="changePassword">更换密码</el-button>
+              </el-form-item>
             </el-form>
-            <el-button type="primary" icon="el-icon-refresh-left" @click="passReset">重置信息</el-button>
-            <el-button type="success" icon="el-icon-upload2" @click="changePassword">更换密码</el-button>
+            
           </el-col>
         </el-row>
       </el-tab-pane>

src/views/pettyMoney/addPettyMoneyRecord.vue

+<template>
+    <div class="main">
+        <div class="container">
+            <el-form :model="formData" ref="form" label-width="120px" :rules="rules"
+                class="petty-form contract-description-form">
+                <el-form-item label="借款缘由" prop="pettyReason">
+                    <el-input placeholder="请输入借款缘由" v-model="formData.pettyReason"></el-input>
+                </el-form-item>
+                <el-form-item label="借款详情" prop="pettyDetails">
+                    <el-input placeholder="请输入借款详情" v-model="formData.pettyDetails"></el-input>
+                </el-form-item>
+                <el-form-item label="借款金额" prop="pettyMoney">
+                    <el-input placeholder="请输入借款金额" type="number" v-model="formData.pettyMoney"></el-input>
+                </el-form-item>
+                <el-form-item label="借款时间" prop="pettyTime">
+                    <el-date-picker v-model="formData.pettyTime" align="right" type="datetime" placeholder="请输入借款时间"
+                        format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item label="备注" prop="pettyRemarks">
+                    <el-input placeholder="请输入备注" v-model="formData.pettyRemarks"></el-input>
+                </el-form-item>
+                <el-form-item label="申请附件">
+                    <el-upload ref="uploadPettyFile" list-type="picture-card" :action="action" :file-list="fileList"
+                        :on-change="uploadOnchange" :data="fileParams" :auto-upload="false" multiple accept='.pdf'
+                        :limit="1" class='el-contract-upload'>
+                        <i slot="default" class="el-icon-plus"></i>
+                        <div slot="file" slot-scope="{file}" class="file-list">
+                            <div class="avator"><i class="el-icon-document"></i></div>
+                            <div class="file-content" :title="file.name">{{ file.name }}</div>
+                            <div class="file-operate">
+                                <span class="" @click="handleDownload(file)">
+                                    <i class="el-icon-download"></i>
+                                </span>
+                            </div>
+                        </div>
+                        <!-- <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+                        <div class="el-upload__tip" slot="tip">只能上传pdf文件，且不超过500kb</div> -->
+                    </el-upload>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="addPettyMoneyRecord">{{isEdit ? '确认修改' : '确认申请'}}</el-button>
+                </el-form-item>
+            </el-form>
+
+        </div>
+    </div>
+</template>
+<script>
+import { insertPettyMoneyRecord, selctByPettyId, updatePettyMoneyRecord } from '@/api/pettyMoney'
+import { deepClone } from '@/utils'
+// import { contractNatures } from '../contractStaticData'
+import { mapGetters } from 'vuex'
+import { downloadPDFFile } from '@/utils/download'
+import { addRecordRules as rules, staticParams } from './pettyMoneyStaticData'
+export default {
+    // props: ['drawerVisible'],
+    computed: {
+        ...mapGetters([
+            'companyId',
+            'urId'
+        ]),
+    },
+    data() {
+        return {
+            rules: rules,
+            formData: {
+                ...staticParams,
+                userId: this.urId, //谁借的
+                companyId: this.companyId, //公司id
+                pettyState: 2,//状态0待还款1已还清2无需偿还
+                pettyApproval: 0, //0待审批1通过2驳回
+            },
+            fileList: [],
+            fileParams: {},
+            action: '',
+            uploadChange: false,
+            isEdit: false
+        }
+    },
+    created() {
+        this.action = process.env.VUE_APP_BASE_API + '/file/updataPettyFile'
+    },
+    mounted() {
+        const { pettyId } = this.$route.query
+        // 编辑
+        if (this.$route.path.indexOf('/editPetty') >= 0 && pettyId) {
+            this.isEdit = true;
+            this.getPettytDetail(pettyId)
+            this.getPettyFiles(pettyId)  //获取合同文件
+            // 添加
+        } else if (this.$route.path.indexOf('/addPettyMoneyRecord') >= 0) {
+            this.isEdit = false;
+        } else {
+            this.$router.back()
+        }
+        console.log(1)
+    },
+    methods: {
+        addPettyMoneyRecord() {
+            this.$refs.form.validate(valida => {
+                if (valida) {
+                    const params = {
+                        ...this.formData,
+                        userId: this.urId,
+                        companyId: this.companyId,
+                        pettySurplus: this.formData.pettyMoney
+                    }
+                    // [pettyMoney为空, userId为空, companyId为空, pettyApproval为空, pettyState为空]
+                    if (this.isEdit) {
+                        updatePettyMoneyRecord(params).then(res => {
+                            if (res.success) {
+                                this.addPettyFile(params.pettyId)
+                                this.$message.success("修改成功")
+                                setTimeout(() => {
+                                    this.$router.push('/pettyMoneyRecord')
+                                }, 1000);
+                            } else {
+                                this.$message.error(res.msg)
+                            }
+                        })
+                    } else {
+                        insertPettyMoneyRecord(params).then(res => {
+                            if (res.success) {
+                                this.addPettyFile(res.data)
+                                this.$message.success("申请成功")
+                                setTimeout(() => {
+                                    this.$router.push('/pettyMoneyRecord')
+                                }, 1000);
+                            } else {
+                                this.$message.error(res.msg)
+                            }
+                        })
+                    }
+                }
+            })
+        },
+        uploadOnchange(file, fileList) {
+            this.uploadChange = true
+        },
+        addPettyFile(pettyId) {
+            this.fileParams.Id = pettyId
+            this.uploadChange && this.$refs.uploadPettyFile.submit()
+        },
+        handleDownload(file) {
+            let { name, filePath } = file
+            let url = process.env.VUE_APP_BASE_API + filePath;
+            downloadPDFFile(url, name)
+        },
+        getPettytDetail(pettyId) {
+            if (pettyId) {
+                const params = {
+                    pettyId,
+                    userId: this.urId
+                }
+                selctByPettyId(params).then(res => {
+                    if (res.success) {
+                        this.formData = Object.assign({}, this.formData, res.data)
+                        const { pettyEnclosure } = res.data
+                        pettyEnclosure && (this.fileList = [{
+                            name: pettyEnclosure.slice(pettyEnclosure.lastIndexOf('/') + 1, pettyEnclosure.length),
+                            filePath: pettyEnclosure
+                        }])
+                    } else {
+                        this.$message.warning("获取备用金详情失败")
+                    }
+                })
+                // get()
+            }
+        },
+        getPettyFiles(pettyId) {
+            const params = {
+                pettyId
+            }
+            // selectContractFiles(params).then(res => {
+            //     if (res.success) {
+            //         this.fileList = res.data.map(item => {
+            //             item.name = item.filePath.slice(item.filePath.lastIndexOf('/') + 1, item.filePath.length)
+            //             return item
+            //         })
+            //     } else {
+            //         this.fileList = []
+            //     }
+            // })
+        },
+    }
+}
+</script>
+<style scoped lang="scss">
+.main {
+    .header {
+        padding: 25px 15px;
+    }
+
+    .container {
+        padding: 15px 0;
+
+        .petty-form {
+            width: 50%;
+        }
+
+    }
+}
+
+
+
+.file-list {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    width: 250px;
+    padding: 0 5px;
+
+    .avator {
+        width: 10%;
+        font-size: 32px;
+        color: #d75b5b;
+    }
+
+    .file-content {
+        width: 80%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        padding-left: 10px;
+    }
+
+    .file-operate {
+        width: 15%;
+        font-size: 16px;
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+
+        span {
+            cursor: pointer;
+        }
+
+    }
+
+}
+</style>
\ No newline at end of file

src/views/pettyMoney/components/examinePetty.vue

+<template>
+    <div class="main">
+        <el-form :inline="true" :model="examineQuery" v-if="tag === 'overview'">
+            <el-form-item>
+                <el-input v-model="examineQuery.pettyName" placeholder="请输入备用金名称" />
+            </el-form-item>
+            <el-form-item>
+                <el-input v-model="examineQuery.username" placeholder="请输入借款人" />
+            </el-form-item>
+            <el-form-item>
+                <el-select v-model="examineQuery.pettyApproval" placeholder="请选择审批状态">
+                    <el-option v-for="(item, index) in approveResult" :key="index" :value="index" :label="item.text">
+                    </el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item>
+                <el-select v-model="examineQuery.pettyState" placeholder="请选择还款状态">
+                    <el-option v-for="(item, index) in pettyStates" :key="index" :value="index" :label="item.text">
+                    </el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item>
+                <el-button size="medium" type="primary" icon="el-icon-search" @click="getexamineList(true)">
+                    查询
+                </el-button>
+                <el-button size="medium" type="primary" icon="el-icon-refresh-right" @click="examineQuery = {}">重置
+                </el-button>
+                <!-- <el-button size="medium" type="success" icon="el-icon-circle-plus-outline" @click="dialogTableVisible = true">添加合同</el-button> -->
+            </el-form-item>
+        </el-form>
+        <el-table :data="examineList" style="width: 100%;text-align: center;" border>
+            <el-table-column label="编号" width="50px">
+                <template slot-scope="scope">
+                    {{ (examinePageQuery.pageNum - 1) * examinePageQuery.pageSize + scope.$index + 1 }}
+                </template>
+            </el-table-column>
+            <el-table-column prop="pettyName" label="备用金名称" width="120px" v-if="tag === 'overview'">
+                <template slot-scope="scope">
+                    {{ parseInt(scope.row.pettyApproval) === 1 ? scope.row.pettyName : '暂未通过' }}
+                </template>
+            </el-table-column>
+            <el-table-column prop="pettyReason" label="借款缘由" />
+            <el-table-column prop="userName" label="借款人" width="120px" />
+            <el-table-column prop="pettyMoney" label="借款金额" width="120px" />
+            <el-table-column prop="pettySurplus" label="待还金额" width="120px" />
+            <el-table-column prop="pettyTime" label="借款日期" width="180px" />
+            <el-table-column prop="pettyApproval" label="申请状态" width="100px" v-if="tag === 'overview'">
+                <template slot-scope="scope">
+                    <el-tag size="small" :type="approveResult[scope.row.pettyApproval].type">
+                        {{ approveResult[scope.row.pettyApproval].text }}</el-tag>
+                </template>
+            </el-table-column>
+            <el-table-column prop="pettyState" label="还款状态" width="100px" v-if="tag === 'overview'">
+                <template slot-scope="scope">
+                    <el-tag size="mini" :type="pettyStates[scope.row.pettyState].type">
+                        {{ pettyStates[scope.row.pettyState].text }}</el-tag>
+                </template>
+            </el-table-column>
+
+            <el-table-column label="操作" :width="tag === 'overview' ? '120px' : '200px'">
+                <template slot-scope="scope">
+                    <el-button-group>
+                        <el-button v-if="tag === 'unapprove'" type="success" size="mini"
+                            @click="controlDialogVisible('agree', scope.row)">同意
+                        </el-button>
+                        <el-button v-if="tag === 'unapprove'" type="warning" size="mini"
+                            @click="controlDialogVisible('reject', scope.row)">驳回
+                        </el-button>
+                        <el-button size="mini" v-if="tag === 'overview'"
+                            :style="{ background: '#5782df', color: '#fff', border: '1px solid #5782df' }"
+                            @click="controlDialogDrawerVisible('drawerVisible', scope.row)">
+                            详情</el-button>
+                    </el-button-group>
+                </template>
+            </el-table-column>
+        </el-table>
+        <div class="footer">
+            <el-pagination @current-change="getexamineList" :current-page.sync="examinePageQuery.pageNum"
+                :page-size="examinePageQuery.pageSize" layout="total, prev, pager, next"
+                :total="examinePageQuery.total">
+            </el-pagination>
+        </div>
+
+        <el-dialog :title="dialogVisible === 'agree' ? '同意审批' : '拒绝审批'" :visible="Boolean(dialogVisible)" width="40%"
+            :show-close="false">
+            <el-form label-position="left" :model="checkedRow" label-width="100px" ref="dialogForm">
+                <el-form-item v-if="dialogVisible === 'agree'" label="备用金名称"
+                    :rules="{ required: true, message: '请输入备用金名称' }" prop="pettyName">
+                    <el-input v-model="checkedRow.pettyName" placeholder="请选择备用金名称" />
+                </el-form-item>
+                <el-form-item v-else label="驳回理由" :rules="{ required: true, message: '请输入驳回理由' }" prop="pettyReject">
+                    <el-input v-model="checkedRow.pettyReject" placeholder="请选择驳回理由" />
+                </el-form-item>
+            </el-form>
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="controlDialogVisible('')">取 消</el-button>
+                <el-button type="primary" @click="operateConfirm">确 定</el-button>
+            </span>
+        </el-dialog>
+
+        <el-drawer :visible.sync="drawerVisible" size="50%" :with-header="false" @closed="">
+            <div class="drawerHeader">
+                申请详情
+            </div>
+            <div class="drawerContainer">
+                <el-descriptions :column="3" border>
+                    <el-descriptions-item label="备用金名称" span="3">{{ checkedRow.pettyName || '暂未通过' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item label="借款缘由" span="3">{{ checkedRow.pettyReason }}</el-descriptions-item>
+                    <el-descriptions-item label="借款详情" span="3">{{ checkedRow.pettyDetails }}</el-descriptions-item>
+                    <el-descriptions-item label="借款金额">{{ checkedRow.pettyMoney }}</el-descriptions-item>
+                    <el-descriptions-item label="审批人">{{ checkedRow.financeName }}</el-descriptions-item>
+                    <el-descriptions-item label="审批状态">
+                        <el-tag size="mini"
+                            :type="approveResult[checkedRow.pettyApproval] && approveResult[checkedRow.pettyApproval].type">
+                            {{ approveResult[checkedRow.pettyApproval] &&
+                                    approveResult[checkedRow.pettyApproval].text
+                            }}</el-tag>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="审批时间">{{ checkedRow.pettyApprovalTime }}</el-descriptions-item>
+                    <el-descriptions-item label="待还金额">{{ checkedRow.pettySurplus }}</el-descriptions-item>
+                    <el-descriptions-item label="还款状态">
+                        <el-tag size="mini"
+                            :type="pettyStates[checkedRow.pettyState] && pettyStates[checkedRow.pettyState].type">
+                            {{ pettyStates[checkedRow.pettyState] && pettyStates[checkedRow.pettyState].text }}
+                        </el-tag>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="驳回原因" span="3" v-if="checkedRow.pettyApproval === 2">{{ checkedRow.pettyReject }}</el-descriptions-item>
+                    <el-descriptions-item label="借款日期">{{ checkedRow.pettyTime }}</el-descriptions-item>
+                </el-descriptions>
+            </div>
+            <div v-if="checkedRow.pettyApproval === 1">
+                <div class="drawerHeader">
+                    还款记录
+                </div>
+                <!-- "repaymentId":1,"pettyId":1,"operationId":53,"repaymentTime":"2022-08-13 01:30:18","repaymentMoney":1.0,"repaymentRemarks":null,"repaymentDetails":null,"repaymentReason":"","repaymentEnclosure":null,"repaymentApproval":0,"repaymentReject":null,"operationName":"chenxin"} -->
+                <div class="drawerContainer">
+                    <div class="repay-timeline">
+                        <el-timeline>
+                            <el-timeline-item v-for="(item, index) in repayDetailList" :key="item.repaymentId"
+                                :type="approveResult[item.repaymentApproval].type" :timestamp="item.repaymentTime">
+
+                                <el-tag
+                                    :type="approveResult[item.repaymentApproval] && approveResult[item.repaymentApproval].type">
+                                    {{ approveResult[item.repaymentApproval] &&
+                                            approveResult[item.repaymentApproval].text
+                                    }}</el-tag>
+                                <span>还款金额：{{ item.repaymentMoney }}</span>
+                                <span>审批人：{{ item.operationName }}</span>
+                            </el-timeline-item>
+                        </el-timeline>
+                        <el-empty :image-size="200" v-if="!Boolean(repayDetailList.length)"></el-empty>
+                    </div>
+                </div>
+            </div>
+        </el-drawer>
+
+    </div>
+</template>
+<script>
+import { mapGetters } from 'vuex'
+import { selectCompanyPettyRecord, agreePetty, rejectPetty, repayRecordsByPettyId } from '@/api/pettyMoney'
+import { approveResult, pettyStates } from '../pettyMoneyStaticData'
+import { parseTime } from '@/utils'
+export default {
+    props: ['tag'],
+    computed: {
+        ...mapGetters([
+            'companyId',
+            'urId'
+        ]),
+    },
+    data() {
+        return {
+            examineQuery: {
+                pettyName: '',
+                pettyApproval: '',
+            },
+            examinePageQuery: {
+                pageNum: 1,
+                pageSize: 10,
+                total: 0
+            },
+            approveResult,
+            pettyStates,
+            examineList: [],
+            checkedPettyMoney: {},
+            dialogVisible: false,
+            checkedRow: {},
+            drawerVisible: false,
+            repayDetailList: []
+        }
+    },
+    mounted() {
+        this.getexamineList()
+    },
+    methods: {
+        getexamineList(isCondition) {
+            const params = {
+                ...this.examinePageQuery,
+                companyId: this.companyId
+            }
+            this.tag === 'unapprove' && (params.pettyApproval = 0)
+            isCondition && Object.assign(params, this.examineQuery)
+            selectCompanyPettyRecord(params).then(res => {
+                if (res.success) {
+                    const { list, total, repaymentCount, approvalPending } = res.data
+                    this.examinePageQuery.total = total
+                    this.examineList = list
+                    this.$emit("setTagNumbers", { repaymentCount, approvalPending })
+                } else {
+                    this.$message.error("获取数据失败")
+                }
+            })
+        },
+        controlDialogDrawerVisible(dialogVisible, data) {
+            if (dialogVisible) {
+                this.checkedRow = { ...data }
+            } else {
+                this.checkedRow = {}
+            }
+            if (dialogVisible === 'drawerVisible') {
+                this.drawerVisible = true
+                this.getRepayDetailList()
+                return
+            }
+            this.dialogVisible = dialogVisible
+        },
+        getRepayDetailList() {
+            const params = {
+                pettyId: this.checkedRow.pettyId
+            }
+            repayRecordsByPettyId(params).then(res => {
+                if (res.success) {
+                    this.repayDetailList = res.data
+                } else {
+                    this.$message.error("获取还款记录失败")
+                }
+            })
+        },
+        operateConfirm() {
+            this.dialogVisible === 'agree' ? this.agreeExaminePetty() : this.rejectExaminePetty()
+        },
+        agreeExaminePetty() {
+            this.$refs.dialogForm.validate((valida) => {
+                if (valida) {
+                    const params = { ...this.checkedRow, financeId: this.urId, pettyApproval: 1, pettyState: 0, pettyApprovalTime: parseTime(new Date()) }
+                    agreePetty(params).then(res => {
+                        if (res.success) {
+                            this.$message.success("操作成功")
+                            this.getexamineList()
+                            this.dialogVisible = false
+                        } else {
+                            this.$message.error("操作失败")
+                        }
+                    })
+                }
+            })
+        },
+        rejectExaminePetty() {
+            this.$refs.dialogForm.validate((valida) => {
+                if (valida) {
+                    const params = { ...this.checkedRow, financeId: this.urId, pettyApproval: 2, pettyApprovalTime: parseTime(new Date()) }
+                    rejectPetty(params).then(res => {
+                        if (res.success) {
+                            this.$message.success("操作成功")
+                            this.getexamineList()
+                            this.controlDialogVisible('')
+                        } else {
+                            this.$message.error("操作失败")
+                        }
+                    })
+                }
+            })
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.main {
+
+    .drawerHeader,
+    .drawerContainer {
+        padding: 15px 15px 0;
+
+        .repay-timeline {
+            height: 400px;
+            padding-top: 5px;
+            overflow-y: scroll;
+
+            span {
+                margin-right: 10px;
+                color: #616161;
+            }
+        }
+    }
+
+}
+
+.footer {
+    text-align: right;
+}
+</style>
\ No newline at end of file

src/views/pettyMoney/components/examineRepay.vue

+<template>
+    <div>
+        <el-form :inline="true" :model="examineQuery">
+            <el-form-item>
+                <el-input v-model="examineQuery.pettyName" placeholder="请选择备用金名称" />
+            </el-form-item>
+            <el-form-item>
+                <el-select v-model="examineQuery.pettyApproval" placeholder="请选择审批状态">
+                    <el-option v-for="(item, index) in approveResult" :key="index" :value="index" :label="item.text">
+                    </el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item>
+                <el-button size="medium" type="primary" icon="el-icon-search" @click="getexamineRepayList(true)">
+                    查询
+                </el-button>
+                <el-button size="medium" type="primary" icon="el-icon-refresh-right" @click="examineQuery = {}">重置
+                </el-button>
+                <!-- <el-button size="medium" type="success" icon="el-icon-circle-plus-outline" @click="dialogTableVisible = true">添加合同</el-button> -->
+            </el-form-item>
+        </el-form>
+        <el-table :data="examineList" style="width: 100%;text-align: center;" border>
+            <!-- <el-table-column label="编号" width="50px" type="index" /> -->
+            <el-table-column label="编号" width="50px">
+                <template slot-scope="scope">
+                    {{ (examinePageQuery.pageNum - 1) * examinePageQuery.pageSize + scope.$index + 1 }}
+                </template> 
+            </el-table-column>
+            <el-table-column prop="pettyName" label="备用金名称" width="120px">
+                <template slot-scope="scope">
+                    {{ Boolean(scope.row.pettyApproval) ? scope.row.pettyName : '暂未通过' }}
+                </template>
+            </el-table-column>
+            <el-table-column prop="pettyReason" label="借款缘由" />
+            <el-table-column prop="pettyMoney" label="借款金额" width="120px"/>
+            <el-table-column prop="repaymentMoney" label="还款金额" width="120px">
+                <template slot-scope="scope">
+                    <el-tag type="danger">{{ scope.row.repaymentMoney }}</el-tag>
+                </template>
+            </el-table-column>
+            <el-table-column prop="pettySurplus" label="待还金额" width="120px"/>
+            <el-table-column prop="userName" label="借款人" width="120px" />
+            <el-table-column prop="pettyTime" label="借款日期"   width="180px"/>
+            <!-- <el-table-column prop="pettyApproval" label="申请状态"  width="100px">
+                <template slot-scope="scope">
+                    <el-tag size="small" :type="approveResult[scope.row.pettyApproval].type">
+                        {{ approveResult[scope.row.pettyApproval].text }}</el-tag>
+                </template>
+            </el-table-column>
+            <el-table-column prop="pettyState" label="还款状态"  width="100px">
+                <template slot-scope="scope">
+                    <el-tag size="mini" :type="pettyStates[scope.row.pettyState].type">
+                        {{ pettyStates[scope.row.pettyState].text }}</el-tag>
+                </template>
+            </el-table-column> -->
+            <el-table-column label="操作" width="200px">
+                <template slot-scope="scope">
+                    <el-button-group>
+                        <el-button type="success" size="mini" @click="agree(scope.row)">同意</el-button>
+                        <el-button type="warning" size="mini">驳回</el-button>
+                        <!-- <el-button type="primary" size="mini">详情</el-button> -->
+                    </el-button-group>
+                    <!-- <el-button type="text"
+                        @click="$router.push({ path: '/editPetty', query: { pettyId: String(scope.row.pettyId) } })">
+                        同意
+                    </el-button>
+                    <el-button type="text"
+                        @click="$router.push({ path: '/editPetty', query: { pettyId: String(scope.row.pettyId) } })">
+                        驳回
+                    </el-button>
+                    <el-button type="text"
+                        @click="$router.push({ path: '/editPetty', query: { pettyId: String(scope.row.pettyId) } })">
+                        
+                    </el-button> -->
+                </template>
+            </el-table-column>
+        </el-table>
+        <div class="footer">
+            <el-pagination @current-change="getexamineRepayList" :current-page.sync="examinePageQuery.pageNum"
+                :page-size="examinePageQuery.pageSize" layout="total, prev, pager, next"
+                :total="examinePageQuery.total">
+            </el-pagination>
+        </div>
+    </div>
+</template>
+<script>
+import { mapGetters } from 'vuex'
+import { selectUnrepay, agreeRepay } from '@/api/pettyMoney'
+import { approveResult, pettyStates } from '../pettyMoneyStaticData'
+export default {
+    props:['pettyApproval'],
+    computed: {
+        ...mapGetters([
+            'companyId',
+            'urId'
+        ]),
+    },
+    data(){
+        return {
+            examineQuery: {
+                pettyName: '',
+                pettyApproval: '',
+            },
+            examinePageQuery: {
+                pageNum: 1,
+                pageSize: 10,
+                total: 0
+            },
+            approveResult,
+            pettyStates,
+            examineList: [],
+            checkedPettyMoney: {},
+        }
+    },
+    mounted() {
+        this.getexamineRepayList()
+    },
+    methods: {
+        getexamineRepayList(isCondition) {
+            const params = {
+                ...this.examinePageQuery,
+                companyId: this.companyId
+            }
+            isCondition && Object.assign(params, this.examineQuery)
+            selectUnrepay(params).then(res => {
+                if (res.success) {
+                    const {list, total} = res.data
+                    this.examinePageQuery.total = total
+                    this.examineList = list
+                    this.$emit("setTagNumbers",{repaymentCount: total})
+                } else {
+                    this.$message.error("获取数据失败")
+                }
+            })
+        },
+        // distinguishState({ pettyApproval, pettyState }){
+        //     // pettyState: '', //状态0待还款1已还清2无需偿还
+        //     // pettyApproval: '', //0待审批1通过2驳回
+
+        //     pettyState = parseInt(pettyState)
+        //     pettyApproval = parseInt(pettyApproval)
+        //     //申请金审批未通过
+        //     if(pettyState === 0 || pettyState === 2){
+        //         return 
+        //     }
+        //     return
+        // }
+        agree(data){
+            const {repaymentId, repaymentApproval, pettyId} = data
+            const params = {
+                operationId: this.urId,
+                repaymentId,
+                repaymentApproval: 1,
+                pettyId,
+            }
+            agreeRepay(params).then(res => {
+                if (res.success) {
+                    this.getexamineRepayList()
+                } else {
+                    this.$message.error("操作失败")
+                }
+            })
+
+        }
+    }
+}
+</script>
+<style>
+.footer {
+        text-align: right;
+    }
+</style>
\ No newline at end of file

src/views/pettyMoney/examineApprove.vue

+<template>
+    <div class="main">
+        <div class="container">
+            <el-tabs tab-position="left">
+                <el-tab-pane label="备用金申请总览">
+                    <examine-petty @setTagNumbers="setTagNumbers" tag="overview"></examine-petty>
+                </el-tab-pane>
+                <el-tab-pane :lazy="true">
+                    <span slot="label" class="petty-data-simple">
+                        <span v-if="tagNumbers.approvalPending"><el-badge :value="tagNumbers.approvalPending" :max="99" class="badges">备用金待审批
+                        </el-badge></span>
+                        <span v-else>备用金待审批</span>
+                    </span>
+                    <examine-petty @setTagNumbers="setTagNumbers" tag="unapprove"></examine-petty>
+                </el-tab-pane>
+                <!-- <el-tab-pane :lazy="true">
+                    <span slot="label" class="petty-data-simple">
+                        <el-badge :value="tagNumbers.approvalPending" :max="99" class="badges">备用金已审批
+                        </el-badge>
+                    </span>
+                    <examine-petty @setTagNumbers="setTagNumbers" pettyApproval="1"></examine-petty>
+                </el-tab-pane> -->
+                <el-tab-pane :lazy="true">
+                    <span slot="label" class="petty-data-simple">
+                        <span v-if="tagNumbers.repaymentCount"><el-badge :value="tagNumbers.repaymentCount" :max="99" class="badges">还款待审批
+                        </el-badge></span>
+                        <span v-else>还款待审批</span>
+                    </span>
+                    <examine-repay @setTagNumbers="setTagNumbers"></examine-repay>
+                </el-tab-pane>
+            </el-tabs>
+
+        </div>
+    </div>
+</template>
+<script>
+import ExaminePetty from "./components/examinePetty"
+import ExamineRepay from "./components/examineRepay.vue"
+export default {
+    components: {
+        ExaminePetty,
+        ExamineRepay
+    },
+    
+    data() {
+        return {
+            tagNumbers: {
+                approvalPending: 0,
+                repaymentCount: 0
+            },
+            
+            drawerVisible: true
+
+        }
+    },
+    methods: {
+        setTagNumbers(data){
+            this.tagNumbers = {...this.tagNumbers,...data}
+        }
+    }
+    
+}
+</script>
+<style scoped lang="scss">
+.main {
+    padding: 15px;
+
+    .footer {
+        text-align: right;
+    }
+
+    .drawerHeader,
+    .drawerContainer {
+        padding: 15px 15px 0;
+    }
+}
+</style>
\ No newline at end of file

src/views/pettyMoney/pettyMoneyRecord.vue

+<template>
+    <div class="main">
+        <div class="header">
+            <el-form :inline="true" :model="pettyMoneyQuery">
+                <!-- 合同名称，合同编号，合同类型，合同性质 -->
+                <!-- <el-form-item>
+                    <el-input v-model="pettyMoneyQuery.contractName" placeholder="请选择备用金名称" />
+                </el-form-item> -->
+                <el-form-item>
+                    <el-select v-model="pettyMoneyQuery.pettyApproval" placeholder="请选择审批状态">
+                        <el-option v-for="(item, index) in approveResult" :key="index" :value="index"
+                            :label="item.text"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-select v-model="pettyMoneyQuery.pettyState" placeholder="请选择还款状态">
+                        <el-option v-for="(item, index) in pettyStates" :key="index" :value="index"
+                            :label="item.text"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" icon="el-icon-search" @click="getPettyMoneyList(true)">查询</el-button>
+                    <el-button type="primary" icon="el-icon-refresh-right" @click="pettyMoneyQuery = {}">重置</el-button>
+                    <!-- <el-button type="success" icon="el-icon-circle-plus-outline" @click="dialogTableVisible = true">添加合同</el-button> -->
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="container">
+            <el-table :data="pettyMoneyList" style="width: 100%;text-align: center;" border>
+                <el-table-column label="编号" width="50px">
+                    <template slot-scope="scope">
+                        {{ (pettyMoneyPageQuery.pageNum - 1) * pettyMoneyPageQuery.pageSize + scope.$index + 1 }}
+                    </template>
+                </el-table-column>
+                <!-- <el-table-column prop="companyName" label="状态"/> -->
+                <el-table-column prop="pettyName" label="备用金名称" width="120px">
+                    <template slot-scope="scope">
+                        {{ parseInt(scope.row.pettyApproval) === 1 ? scope.row.pettyName : '暂未通过' }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="pettyReason" label="借款缘由" />
+                <el-table-column prop="pettyMoney" label="借款金额" width="120px" />
+                <el-table-column prop="pettySurplus" label="待还金额" width="120px" />
+                <el-table-column prop="pettyTime" label="借款日期" width="180px" />
+                <el-table-column prop="pettyApproval" label="审批状态" width="100px">
+                    <template slot-scope="scope">
+                        <el-tag :type="approveResult[scope.row.pettyApproval].type">
+                            {{ approveResult[scope.row.pettyApproval].text }}</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="pettyState" label="还款状态" width="100px">
+                    <template slot-scope="scope">
+                        <el-tag size="mini" :type="pettyStates[scope.row.pettyState].type">
+                            {{ pettyStates[scope.row.pettyState].text }}</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作">
+                    <template slot-scope="scope">
+                        <el-button-group>
+                            <el-button type="success" size="mini" v-if="parseInt(scope.row.pettyApproval) === 1"
+                                @click="controlDialogDrawerVisible('agree', scope.row)">还款
+                            </el-button>
+                            <el-button type="primary" size="mini" v-if="parseInt(scope.row.pettyApproval) === 0"
+                                @click="$router.push({ path: '/editPetty', query: { pettyId: String(scope.row.pettyId) } })">
+                                编辑</el-button>
+                            <el-button size="mini" :style="{background: '#5782df',color: '#fff',border: '1px solid #5782df'}"
+                                @click="controlDialogDrawerVisible('drawerVisible', scope.row)">
+                                详情</el-button>
+                        </el-button-group>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+        <div class="footer">
+            <el-pagination @current-change="getPettyMoneyList" :current-page.sync="pettyMoneyPageQuery.pageNum"
+                :page-size="pettyMoneyPageQuery.pageSize" layout="total, prev, pager, next"
+                :total="pettyMoneyPageQuery.total">
+            </el-pagination>
+        </div>
+        <el-dialog title="还款金额" :visible="Boolean(dialogVisible)" width="40%" :show-close="false">
+            <el-form label-position="left" :model="checkedRow" label-width="100px" ref="dialogForm">
+                <el-form-item label="还款金额" :rules="{ required: true, validator: checkRepayMoney }"
+                    prop="repaymentMoney">
+                    <el-input v-model="checkedRow.repaymentMoney" placeholder="请选择备用金名称" type="number" />
+                </el-form-item>
+            </el-form>
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="controlDialogDrawerVisible('')">取 消</el-button>
+                <el-button type="primary" @click="repay">确 定</el-button>
+            </span>
+        </el-dialog>
+
+        <el-drawer :visible.sync="drawerVisible" size="50%" :with-header="false" @closed="">
+            <div class="drawerHeader">
+                申请详情
+            </div>
+            <div class="drawerContainer">
+                <el-descriptions :column="3" border>
+                    <el-descriptions-item label="备用金名称" span="3">{{ checkedRow.pettyName || '暂未通过' }}</el-descriptions-item>
+                    <el-descriptions-item label="借款缘由" span="3">{{ checkedRow.pettyReason }}</el-descriptions-item>
+                    <el-descriptions-item label="借款详情" span="3">{{ checkedRow.pettyDetails }}</el-descriptions-item>
+                    <el-descriptions-item label="借款金额">{{ checkedRow.pettyMoney }}</el-descriptions-item>
+                    <el-descriptions-item label="审批人">{{ checkedRow.financeName }}</el-descriptions-item>
+                    <el-descriptions-item label="审批状态">
+                        <el-tag size="mini"
+                            :type="approveResult[checkedRow.pettyApproval] && approveResult[checkedRow.pettyApproval].type">
+                            {{ approveResult[checkedRow.pettyApproval] &&
+                                    approveResult[checkedRow.pettyApproval].text
+                            }}</el-tag>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="审批时间">{{ checkedRow.pettyApprovalTime }}</el-descriptions-item>
+                    <el-descriptions-item label="待还金额">{{ checkedRow.pettySurplus }}</el-descriptions-item>
+                    <el-descriptions-item label="还款状态">
+                        <el-tag size="mini"
+                            :type="pettyStates[checkedRow.pettyState] && pettyStates[checkedRow.pettyState].type">
+                            {{ pettyStates[checkedRow.pettyState] && pettyStates[checkedRow.pettyState].text }}
+                        </el-tag>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="驳回原因" span="3" v-if="checkedRow.pettyApproval === 2">{{ checkedRow.pettyReject }}</el-descriptions-item>
+                    <el-descriptions-item label="借款日期">{{ checkedRow.pettyTime }}</el-descriptions-item>
+                </el-descriptions>
+            </div>
+            <div v-if="checkedRow.pettyApproval === 1">
+                <div class="drawerHeader">
+                    还款记录
+                </div>
+                <!-- "repaymentId":1,"pettyId":1,"operationId":53,"repaymentTime":"2022-08-13 01:30:18","repaymentMoney":1.0,"repaymentRemarks":null,"repaymentDetails":null,"repaymentReason":"","repaymentEnclosure":null,"repaymentApproval":0,"repaymentReject":null,"operationName":"chenxin"} -->
+                <div class="drawerContainer ">
+                    <div class="repay-timeline">
+                        <el-timeline>
+                            <el-timeline-item v-for="(item, index) in repayDetailList" :key="item.repaymentId"
+                                :type="approveResult[item.repaymentApproval].type" :timestamp="item.repaymentTime">
+
+                                <el-tag
+                                    :type="approveResult[item.repaymentApproval] && approveResult[item.repaymentApproval].type">
+                                    {{ approveResult[item.repaymentApproval] &&
+                                            approveResult[item.repaymentApproval].text
+                                    }}</el-tag>
+                                <span>还款金额：{{ item.repaymentMoney }}</span>
+                                <span>审批人：{{ item.operationName }}</span>
+                            </el-timeline-item>
+                        </el-timeline>
+                        <el-empty :image-size="200" v-if="!Boolean(repayDetailList.length)"></el-empty>
+                    </div>
+                </div>
+            </div>
+        </el-drawer>
+    </div>
+</template>
+<script>
+import { mapGetters } from 'vuex'
+import { selectSelfPettyRecord, repayMoney, repayRecordsByPettyId } from '@/api/pettyMoney'
+import { approveResult, pettyStates } from './pettyMoneyStaticData'
+import { parseTime } from '@/utils'
+export default {
+    computed: {
+        ...mapGetters([
+            'companyId',
+            'urId'
+        ]),
+    },
+    data() {
+        return {
+            pettyMoneyQuery: {},
+            pettyMoneyPageQuery: {
+                pageSize: 10,
+                pageNum: 1,
+                total: 0
+            },
+            pettyMoneyList: [],
+            approveResult,
+            pettyStates,
+            checkedRow: {},
+            dialogVisible: '',
+            drawerVisible: false,
+            repayDetailList: []
+
+        }
+    },
+    mounted() {
+        this.getPettyMoneyList()
+    },
+    methods: {
+        checkRepayMoney(rule, value, callback) {
+            if (!value) {
+                return callback(new Error('还款金额不能为空'));
+            }
+            if (value > this.checkedRow.pettySurplus) {
+                callback(new Error('超出应还款金额'));
+            } else {
+                callback();
+            }
+        },
+        getPettyMoneyList(isCondition = false) {
+            const params = {
+                ...this.pettyMoneyPageQuery,
+                companyId: this.companyId,
+                userId: this.urId
+            }
+            isCondition && Object.assign(params, this.pettyMoneyQuery)
+            selectSelfPettyRecord(params).then(res => {
+                if (res.success) {
+                    this.pettyMoneyPageQuery.total = res.data.total
+                    this.pettyMoneyList = res.data.list
+                } else {
+                    this.$message.error("获取数据失败")
+                }
+            })
+        },
+
+        controlDialogDrawerVisible(dialogVisible, data) {
+            if (dialogVisible) {
+                this.checkedRow = { ...data }
+            } else {
+                this.checkedRow = {}
+            }
+            if (dialogVisible === 'drawerVisible') {
+                this.drawerVisible = true
+                parseInt(data.pettyApproval) === 1 && this.getRepayDetailList()
+                return
+            }
+            this.dialogVisible = dialogVisible
+        },
+        getRepayDetailList() {
+            const params = {
+                pettyId: this.checkedRow.pettyId
+            }
+            repayRecordsByPettyId(params).then(res => {
+                if (res.success) {
+                    this.repayDetailList = res.data
+                } else {
+                    this.$message.error("获取还款记录失败")
+                }
+            })
+        },
+        repay() {
+            this.$refs.dialogForm.validate((valida) => {
+                if (valida) {
+                    const { pettyId, repaymentMoney } = this.checkedRow
+                    const params = {
+                        // companyId: this.companyId,
+                        operationId: this.urId,
+                        pettyId,
+                        repaymentMoney,
+                        repaymentApproval: 0,
+                        repaymentTime: parseTime(new Date()),
+                        repaymentReason: ''
+                    }
+                    repayMoney(params).then(res => {
+                        if (res.success) {
+                            this.$message.success("还款成功")
+                            this.getPettyMoneyList()
+                            this.controlDialogDrawerVisible('')
+                        } else {
+                            this.$message.error(res.msg)
+                        }
+                    })
+                }
+            })
+
+        }
+    }
+}
+</script>
+<style scoped lang="scss">
+.main {
+    padding: 15px;
+
+    .drawerHeader,
+    .drawerContainer {
+        padding: 15px 15px 0;
+
+        .repay-timeline {
+            height: 400px;
+            padding-top: 5px;
+            overflow-y: scroll;
+
+            span {
+                margin-right: 10px;
+                color: #616161;
+            }
+        }
+    }
+}
+
+.footer {
+    text-align: right;
+}
+</style>
\ No newline at end of file

src/views/pettyMoney/pettyMoneyStaticData.js

+//申请金状态
+export const approveResult = [
+    {
+        text: '待审批',
+        type: 'info'
+    },
+    {
+        text: '通过',
+        type: 'success'
+    },
+    {
+        text: '驳回',
+        type: 'danger'
+    }
+]
+//还款状态
+export const pettyStates = [
+    {
+        text: '待还款',
+        type: 'info'
+    },
+    {
+        text: '已还清',
+        type: 'success'
+    },
+    {
+        text: '无需偿还',
+        type: 'warning'
+    }
+]
+
+
+export const addRecordRules = {
+    pettyReason:[
+        { required: true, message: '请输入借款缘由', trigger: 'blur' },
+    ],
+    pettyDetails:[
+        { required: true, message: '请输入借款详情', trigger: 'blur' },
+    ],
+    pettyMoney:[
+        { required: true, message: '请输入借款金额', trigger: 'blur' },
+    ],
+    pettyTime:[
+        { required: true, message: '请输入借款时间', trigger: 'blur' },
+    ],
+}
+
+export const staticParams = {
+    pettyId: '', //表id
+    financeId: '', //审批人
+    pettyName: '', //备用金名称
+    pettyMoney: '', //借款金额
+    pettySurplus: '', //待还金额
+    pettyReason: '', //借款缘由.
+    pettyTime: '', //借的日期
+    pettyRemarks: '', //备注
+    pettyDetails: '', //详情
+    pettyState: '', //状态0待还款1已还清2无需偿还
+    pettyEnclosure: '', //附件
+    pettyApproval: '', //0待审批1通过2驳回
+    pettyReject: '', //驳回理由，
+}
+
+export const repayParams = {
+    operationId: '',
+    pettyId: '',
+    repaymentApproval: '',
+    repaymentDetails: '',
+    repaymentEnclosure: '',
+    repaymentId: '',
+    repaymentMoney: '',
+    repaymentReason: '',
+    repaymentReject: '',
+    repaymentRemarks: '',
+    repaymentTime: ''
+  }
\ No newline at end of file