oa-system/src/components/Finance/GroupUnreviewed.vue

<template>
    <div class="groupunreviewed-all" v-loading.fullscreen.lock="groupunreviewedLoading">
        <div class="groupunreviewed-title">团组未审核数据</div>
        <div class="groupunreviewed-haed">
            <div>
                <el-date-picker @change="datechange" style="width:350px" v-model="value" type="daterange" align="left"
                    unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                    :picker-options="pickerOptions">
                </el-date-picker>
                <el-input
                style="width:250px"
                placeholder="请输入团组名称"
                v-model="teamName"
                clearable>
                </el-input>
                <el-button @click="inquirebtn" type="primary">查 询</el-button>
            </div>
            <div v-if="jurisdiction">
                <el-button @click="examinebtn(1)" type="primary">审核通过</el-button>
                <el-button @click="examinebtn(2)" type="danger">审核不通过</el-button>
            </div>
        </div>
        <div class="tree-box">
            <el-tree 
            @check="handleSelectionChange" 
            :data="groupstableData" 
            ref="tree"
            show-checkbox 
            :default-expand-all="false" 
            :default-checked-keys="defaultarr"
            node-key="id" 
            :props="defaultProps"
            highlight-current>
                <span class="custom-tree-node" slot-scope="{ data }">
                    <span>{{data.groupName?'（团组：'+data.groupName+'）':'' }}</span>
                    <span>
                        {{ data.applicant?'申请人：'+data.applicant:''}}
                    </span>
                    <span>
                        {{ data.payType?'【'+data.payType+'】':''}}
                    </span>
                    <span>
                        {{ data.moduleName?'['+data.moduleName+']':''}}
                    </span>
                    <span>
                        {{ data.priceName?data.priceName:''}}
                    </span>
                    <span>
                        {{ data.payee?'（收款方：'+data.payee+'）':'' }}
                    </span>
                    <span>
                        {{ data.payCurrCode?'  : '+data.payCurrCode+' ':'' }}
                    </span>
                    <span>
                        {{ data.paymentAmount!=undefined?'  '+twonumder(data.paymentAmount):'' }}
                    </span>
                    <span>
                        {{ data.cnyTotalAmount!=undefined?'&nbsp;&nbsp;&nbsp;付款金额&nbsp;&nbsp;&nbsp;CNY  '+twonumder(data.cnyTotalAmount):'' }}
                    </span>
                    <span>
                        {{ data.cnySubTotalAmount!=undefined?'  、 CNY  '+twonumder(data.cnySubTotalAmount=data.paymentAmount*data.payRate)+'、':'' }}
                    </span>
                    <span>
                        {{ data.payRate!=undefined?'&nbsp;&nbsp;&nbsp;汇率：'+twonumders(data.payRate):'' }}
                    </span>
                    <!-- <el-input-number v-if="data.payRate!=undefined" style="width:100px" @blur="inputblur(data.id,data.payRate,data.hotelSubId)" :precision="4" placeholder="公务翻译费" v-model="data.payRate" :controls='false'>
                    </el-input-number> -->
                </span>
            </el-tree>
        </div>
    </div>
</template>
<script>
export default {
    data () {
        return {
            pickerOptions: {
                shortcuts: [{
                    text: '最近一个月',
                    onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                    picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近六个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 180);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近一年',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 365);
                        picker.$emit('pick', [start, end]);
                    }
                }]
            },
            userid:'',
            value:[],
            defaultarr:[],//团组勾选中
            groupstableData:[],//团组付款申请
            defaultProps: {
                children: 'childList',
                label: 'groupName'
            },
            groupunreviewedLoading:false,
            hotelSubIdarr:[],
            jurisdiction:false,//审核权限
            teamName:''
        }
    },
    methods:{
        //两位小数
        twonumder(val){
            return val.toFixed(2)
        },
        //4位小数
        twonumders(val){
            return val.toFixed(4)
        },
        //处理日期
        datetime(val){
            var date=new Date(val);
            var y=date.getFullYear();
            var m=date.getMonth()+1>=10?date.getMonth()+1:'0'+(date.getMonth()+1).toString();
            var d=date.getDate()>=10?date.getDate():'0'+(date.getDate()).toString();
            return y+'-'+m+'-'+d
        },
        //查询
        inquirebtn(){
            if (this.value.length==0) {
                this.$message.error("请选择时间！");
                return
            }
            this.GroupUnAuditFeeList(this.datetime(this.value[0]),this.datetime(this.value[1]))
        },
        //切换时间
        datechange(){
            if(this.value==null){
                return
            }
            this.GroupUnAuditFeeList(this.datetime(this.value[0]),this.datetime(this.value[1]))
        },
        //获取团组未审核数据
        GroupUnAuditFeeList(beginDt,endDt){
            this.groupunreviewedLoading=true;
            this.groupstableData=[];
            var that = this;
            var url = "/api/Financial/GroupUnAuditFeeList?beginDt="+beginDt+"&endDt="+endDt+"&teamName="+that.teamName
            this.$axios({
                method: 'get',
                url: url,
                headers: {
                    Authorization: 'Bearer '
                },
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.groupstableData=res.data.data.dataList;
                    that.groupunreviewedLoading=false;
                } else {
                    that.$message.error(res.data.msg);
                    that.groupunreviewedLoading=false;
                }
            })
        },
        //勾选
        handleSelectionChange(data,node) {
            for(let i=0;i<node.checkedNodes.length;i++){
                for(let j=0;j<node.checkedKeys.length;j++){
                    if(node.checkedNodes[i].id==node.checkedKeys[j]){
                        this.hotelSubIdarr.push(node.checkedNodes[i].hotelSubId)
                    }
                }
            }
            this.defaultarr=node.checkedKeys
        },
        //审核通过
        examinebtn(val){
            var auditarr=''
            for (var i = 0; i < this.defaultarr.length; i++) {
                if (!isNaN(Number(this.defaultarr[i]))) {
                    auditarr += this.defaultarr[i] + ','
                }
            }
            auditarr=auditarr.substring(0, auditarr.length - 1)
            console.log(auditarr);
            this.PostAuditGrpCreditCardPayment(val,auditarr);
        },
        //审核接口
        PostAuditGrpCreditCardPayment(val,auditarr) {
            var url = "/api/Groups/PostAuditGrpCreditCardPayment"
            var that = this
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' + that.token
                },
                data: {
                    portType:1,
                    userId:that.userid,
                    pageId:47,
                    CreditIdStr:auditarr,
                    auditCode: val,//1审核通过，2审核未通过
                }
            }).then(function (res) {
                console.log(res);
                if (res.data.code == 200) {
                    that.$message({
                        message: res.data.msg,
                        type: 'success',
                        offset: 50
                    });
                    that.GroupUnAuditFeeList(that.datetime(that.value[0]),that.datetime(that.value[1]))
                }else{
                    that.$message({
                        message: res.data.msg,
                        type: 'warning',
                        offset: 50
                    });
                }
            })
        },
    },
    mounted(){
        this.userid = JSON.parse(localStorage.getItem('userinif')).userInfo.userId;
        var Permissions=JSON.parse(localStorage.getItem('Permissions'));
        for(let y=0;y<Permissions.length;y++){
            if(Permissions[y].functionName=='审核'){
                this.jurisdiction=true
            }
        }
    }
}
</script>
<style>
.groupunreviewed-all{
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 0 5px #0005;
    border-radius: 10px;
    height: 100%;
    min-height: 830px;
    min-width: 1400px;
}
.groupunreviewed-title{
    color: #555;
    margin-bottom: 5px;
}
.groupunreviewed-haed{
    display: flex;
    justify-content: space-between;
}
.groupunreviewed-all .tree-box{
    margin-top: 10px;
    border: 1px solid #EBEEF5;
    padding: 10px;
    max-height: 740px;
    overflow-y: auto;
}
.groupunreviewed-all .custom-tree-node{
    line-height: 25px;
    display: flex;
    flex-wrap: wrap;
    font-size: 15px;
}
.groupunreviewed-all .el-tree-node__content {
    height: 50px;
}
</style>