#

whycq

2023-11-15 2667b6698161d233c150c588bcee6e0daafe6f44

#

 pages.json

@@ -223,6 +223,15 @@
                "navigationBarTitleText" : "测试",
                "enablePullDownRefresh" : false
            }
        },
        {
            "path" : "pages/business/goBusiness/modiReimburseOnlineDetl",
            "style" : 
            {
                "navigationBarTitleText" : "修改报销审批",
                "enablePullDownRefresh" : false,
                "navigationStyle": "custom"
            }
        }
    ],
    "globalStyle": {

 pages/business/goBusiness/goBusiness.vue

@@ -72,7 +72,6 @@
        },
        methods: {
            goDetl(e) {
                console.log(e);
                uni.navigateTo({
                    url: '/pages/business/goBusiness/goBusinessDetil',
                    success: function(res) {

 pages/business/goBusiness/modiReimburseOnlineDetl.vue

New file
@@ -0,0 +1,466 @@
<template>
    <view>
        <view class="status_bar">
            <!-- 这里是状态栏 -->
        </view>
        <uni-nav-bar left-icon="left" :title="title" @clickLeft="back" @clickRight="scan"  :fixed="true"
            :border="false" rightWidth="160rpx" leftWidth="160rpx"
            >
            <!-- <block slot="right">
                <view class="city">
                    <view>
                        <text class="uni-nav-bar-text">{{user.username}}</text>
                    </view>
                    <uni-icons type="arrowdown" color="#333333" size="20" />
                </view>
            </block> -->
         </uni-nav-bar>
        <view class="container">
            <view style="height: 16rpx;"></view>
            <view class="card" v-for="(item,index) in form">
                <view class="card-select" v-show="item.inputType != 'table'" style="width: 100%;">
                    <view class="flex">
                        <view class="card-required" v-show="item.required">*</view>
                        <view >{{item.name}}</view>
                    </view>
                    <uni-combox :candidates="orderIds" placeholder="请选择项目" v-model="orderId" 
                        @input="getOrderId()" v-if="item.inputType == 'chose'">
                    </uni-combox>
                    <view class="flex">
                        <!-- 输入框 -->
                        <view v-if="item.inputType != 'table'" style="flex:1">
                            <input type="text" :placeholder="item.placeholder" v-model="item.value" v-if="item.inputType != 'chose'">
                        </view>
                        <!-- 选择按钮 -->
                        <view class="flex" style="width: 50rpx;" v-if="item.inputType == 'select'" @click="showPicker(item.type)">
                            <uni-icons type="right" color="#000" ></uni-icons>
                        </view>
                    </view>
                </view>
                <!-- 表格 -->
                <view style="display: flex;flex-direction: column;width: 100%;font-size: 24rpx;" v-show="item.inputType == 'table'">
                    <view >{{item.name}}:</view>
                    <view style="width: 100%; overflow-x: scroll;border: 1px solid #bebebe;" v-if="item.inputType == 'table'">
                        <table cellpadding="0" cellspacing="0" style="">
                            <thead>
                                <tr style="background-color: #949494;color: #FFF;">
                                    <td class="scroll-item" v-for="(item,index) in table">
                                        <view class="item-content">{{item.name}}</view>
                                    </td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr v-for="(item,index) in tableData">
                                    <td class="scroll-item" v-for="(subitem,i) in table">
                                        <view class="item-content" v-if="subitem.type != 'options'">
                                            <input type="text" v-model="item[subitem.type]">
                                        </view>
										
                                        <view v-if="subitem.type == 'options'" style="color: red;" @click="delItem(index)">删除</view>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        <view style="height: 16rpx;"></view>
                        <view style="position: sticky;width: 100%;left: 0;text-align: center;height: 70rpx;line-height: 70rpx;" v-show="tableData.length == 0">无数据...</view>
                    </view>
                </view>
            </view>
            <view style="height: 16rpx;"></view>
            <view style="text-align: center;display: flex;align-items: center;justify-content: center;">
				
                <view style="background-color: #2d8cf0;width: 200rpx;height:50rpx;color: #fff;line-height: 50rpx;border-radius: 15rpx;" @click="addDetl('bottom')">
                    <uni-icons type="plusempty" color="#fff"></uni-icons>
                    <text>添加明细</text>
                </view>
            </view>
			
			
            <view style="height: 16rpx;"></view>
        </view>
		
        <view>
			
        </view>
		
        <u-picker :show="reimburseId" :columns="reimburseIds" @confirm="reimburseIdConfirm"></u-picker>
        <u-picker :show="checkData" :columns="checkDatas" @confirm="checkDataConfirm"></u-picker>
		
        <view>
            <!-- 普通弹窗 -->
            <uni-popup ref="popup">
                <view class="popup">
                    <view class="pop-title"> 添加明细 </view>
                    <view class="pop-subtitle">
                        费用类型
                    </view>
                    <view class="pop-body">
                        <u-radio-group v-model="radiovalue2" placement="column" shape="square"   @change="popChange">
                            <u-radio :customStyle="{marginBottom: '8px'}" v-for="(item, index) in radiolist2" 
                            @change="radioChange" :key="index" :label="item.name" :name="item.name" >
                            </u-radio>
                        </u-radio-group>
                    </view>
                </view>
            </uni-popup>
        </view>
		
        <view class="floor">
            <view class="default">重置</view>
            <view class="primary" @click="submit()">保存</view>
        </view>
    </view>
</template>

<script>
import colorGradient from '../../../uni_modules/uview-ui/libs/function/colorGradient';
    export default {
        data() {
            return {
                title: '修改报销审批',
                radiolist2: [{
                        name: '餐费',
                        disabled: false
                    },
                    {
                        name: '住宿费',
                        disabled: false
                    },
                    {
                        name: '车费',
                        disabled: false
                    }, {
                        name: '油费',
                        disabled: false
                    }, {
                        name: '其他',
                        disabled: false
                    }
                ],
                radiovalue2: '餐费',
                form: [
                    {name: '项目名',placeholder: '请选择',inputType: 'chose',type: 'orderId',value: '',submitVal: ''},
                    {name: '报销类型',placeholder: '请选择',required:true,inputType: 'select',type: 'reimburseId',value: '',submitVal: ''},
                    {name: '是否冲账',placeholder: '请选择',required:true,inputType: 'select',type: 'checkData',value: '',submitVal: ''},
                    {name: '报销明细',placeholder: '请选择',inputType: 'table'}
                ],
                table: [
                    {name:'事由',type: 'occupation'},
                    {name:'费用类型',type: 'expenseType$'},
                    {name:'税率',type: 'taxRate'},
                    {name:'未税本币金额',type: 'untaxedAmountInLocalCurrency'},
                    {name:'未税金额',type: 'untaxedAmount'},
                    {name:'税额',type: 'taxAmount'},
                    {name:'发票金额',type: 'invoiceValue'},
                    {name:'发票本币金额',type: 'invoiceAmountInLocalCurrency'},
                    {name:'报销比例',type: 'reimbursementRatio'},
                    {name:'报销金额',type: 'reimbursementAmount'},
                    {name:'报销本币金额',type: 'reimbursementAmountInLocalCurrency'},
                    {name:'出纳确认金额',type: 'cashierConfirmationAmount'},
                    {name:'列支人员',type: 'userId$'},
                    {name:'列支部门',type: 'deptId$'},
                    {name:'更新日期',type: 'updateTime'},
                    {name:'更新人员名字',type: 'updateUserName'},
                    {name:'操作',type: 'options'}
                ],
                tableData: [
                    {
                        occupation: 'CRMREIMBURSE1699507854268',
                        expenseType$: '1',
                        taxRate: '0.0',
                        untaxedAmountInLocalCurrency: '1.1',
                        untaxedAmount: '1.3',
                        taxAmount: 'aaa',
                        invoiceValue: '213',
                        invoiceAmountInLocalCurrency: '123213',
                        reimbursementRatio: '0.0',
                        reimbursementAmount: 11,
                        reimbursementAmountInLocalCurrency:12,
                        cashierConfirmationAmount: 123,
                        userId$: '123',
                        deptId$: '财务部',
                        updateTime: '2023-11-11',
                        updateUserName: 'name'
                    },
                    {
                        occupation: '请选择',
                        expenseType$: '1',
                        taxRate: '0.0',
                        untaxedAmountInLocalCurrency: '1.1',
                        untaxedAmount: '1.3',
                        taxAmount: 'aaa',
                        invoiceValue: '213',
                        invoiceAmountInLocalCurrency: 'CRMREIMBURSE1699507854268',
                        reimbursementRatio: '0.0',
                        reimbursementAmount: 11,
                        reimbursementAmountInLocalCurrency:12,
                        cashierConfirmationAmount: 123,
                        userId$: '123',
                        deptId$: '财务部',
                        updateTime: '2023-11-11',
                        updateUserName: 'name'
                    },
                ],
                dataRule: [
                    {occupation: ''}
                ],
                reimburseId: false,
                reimburseIds: [['项目未完成','项目已完成在质保期内','非项目型报销','其他']],
                checkData: false,
                checkDatas: [['是','否']],
                orderId: '',
                orderIds: [],
                orderIds2: [],
                orderIdList: [],
                newDetl: {
                        occupation: '',
                        expenseType$: '1',
                        taxRate: '0.0',
                        untaxedAmountInLocalCurrency: '1.1',
                        untaxedAmount: '1.3',
                        taxAmount: 'aaa',
                        invoiceValue: '213',
                        invoiceAmountInLocalCurrency: '123213',
                        reimbursementRatio: '0.0',
                        reimbursementAmount: 11,
                        reimbursementAmountInLocalCurrency:12,
                        cashierConfirmationAmount: 123,
                        userId$: '123',
                        deptId$: '财务部',
                        updateTime: '2023-11-11',
                        updateUserName: 'name'
                    },
            }
        },
        onLoad(option) {
            let _this = this
            _this.list = []
            const eventChannel = this.getOpenerEventChannel();
            eventChannel.on('reimburseOnlineDetl', function(data) {
                if (data.data == 'add') {
                    _this.title = '添加报销审批'
                }
                console.log(data)
                console.log(_this.title)
            })
            this.getOrderId('')
        },
        methods: {
            addDetl(type) {
                this.type = type
                // open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
                this.$refs.popup.open(type)
            },
            popChange(n) {
                // var detl=JSON.parse(JSON.stringify(this.newDetl));  // 牛逼
                let detl  = {...this.newDetl} // 牛逼
                console.log('groupChange', n);
                console.log(this.radiovalue2);
                detl.expenseType$ = this.radiovalue2
                this.tableData.push(detl)
                this.$refs.popup.close()
            },
            radioChange(n) {
                console.log('radioChange', n);
            },
            showPicker(e) {
                switch(e) {
                    case 'reimburseId':
                        this.reimburseId = true
                        break;
                    case 'orderId':
                        this.orderId = true
                        this.getOrderId();
                        break
                    case 'checkData':
                        this.checkData = true
                        break
                }
            },
            getOrderId(condition) {
                let _this = this
                uni.request({
                    url: `${_this.baseUrl}/orderQueryName/auth`,
                    header: { 'token': uni.getStorageSync('token') },
                    method: 'POST',
                    data: {condition: condition},
                    success(res) {
                        res = res.data
                        _this.orderIds = []
                        _this.orderIdList = []
                        if (res.code === 200 && res.data) {
                            _this.orderIds2 = res.data
                            for (let k of res.data) {
                                _this.orderIds.push(k.value)
                                _this.orderIdList.push(k)
                            }
							
                        }
                    }
					
                })
            },
            delItem(index) {
                this.tableData.splice(index,1)
            },
            reimburseIdConfirm(e) {
                console.log('confirm', e)
                this.form[1].value = e.value[0]
                this.form[1].submitVal = e.indexs[0]
                this.reimburseId = false
                console.log(this.form);
            },
            checkDataConfirm(e) {
                console.log('confirm', e)
                this.form[2].value = e.value[0]
                this.form[2].submitVal = e.indexs[0]
                this.checkData = false
                console.log(this.form);
            },
            // 表单提交
            submit() {
                let param = {
                    orderId: '',
                    checkData: '否',
                    docType: null,
                    reimburseId: null,
                    templateName: '项目未完成',
                    reimburseOnlineDetls: [
						
                    ]
                }
                for (let element of this.orderIdList) {
                    if(element.value == this.orderId) {
                        param.orderId = element.id + ''
                    }
                }
                for (let k of this.form) {
                    if (k.type == 'reimburseId') {
                        param.reimburseId = k.submitVal
                    }
                    if (k.type == 'checkData') {
                        param.checkData = k.value
                    }
                }
                console.log(this.form);
                console.log(param);
                param.reimburseOnlineDetls = this.tableData
                if (param.reimburseId == null || param.reimburseId === '') {
                    uni.showToast({title: '报销类型不能为空', icon: "none", position: 'top'})
                    return
                }
                if (param.checkData == '') {
                    uni.showToast({title: '是否冲账不能为空', icon: "none", position: 'top'})
                    return
                }
                if (param.reimburseOnlineDetls.length == 0) {
                    uni.showToast({title: '请添加报销明细', icon: "none", position: 'top'})
                    return
                }
                // console.log(this.orderIdList);
                // console.log(this.orderIds);
                console.log(param);
            },
			
            back() {
                uni.navigateBack({})
            },
            scan() {
                uni.navigateTo({
                    url: '/pages/authority/authority'
                })
            },
        }
    }
</script>

<style>
    .flex {
        display: flex;
        align-items: center;
    }
    .flex-column {
        display: flex;
        flex-direction: column;
    }
    .container {
        margin: 16rpx;
        background-color: #fff;
    }
    .card {
        display: flex;
        margin: 8rpx 16rpx;
    }
    .card-select {
        display: flex;
        flex-direction: column;
    }
    .card-required {
        color: red;
        padding-right: 4rpx;
    }
    .scroll-item {
        min-width: 150rpx;
        padding: 10rpx;
        text-align: center;
    }
    .scroll-item:last-child > .item-content {
        min-width: 150rpx;
        border-right: none;
    }
    .item-content {
        min-width: 150rpx;
        height: 30rpx;
        line-height: 30rpx;
        padding-right: 10rpx;
        border-right: 1px solid #d3d3d3;
    }
	
    .popup {
        background-color: #fff;
        border-radius: 50rpx 50rpx 0rpx 0rpx;
        height: 70vh;
    }
    .pop-title {
        width: 100%;
        height: 100rpx;
        line-height: 100rpx;
        text-align: center;
        font-size: 40rpx;
    }
    .pop-subtitle {
        margin: 32rpx;
        font-size: 32rpx;
    }
    .pop-body {
        margin: 32rpx;
    }
	
    .floor {
        height: 100rpx;
        line-height: 100rpx;
        width: 100%;
        background-color: #fff;
        position: fixed;
        bottom: 0;
        left: 0;
        display: flex;
        align-items: center;
        text-align: center;
        letter-spacing: 10rpx;
    }
    .default {
        flex: 2;
    }
    .default:active {
        background-color: #eff0f1;
    }
    .primary {
        flex: 3;
        background-color: #2d8cf0;
        color: #fff;
    }
    .primary:active {
        background-color: #007dea;
    }
</style>

 pages/business/goBusiness/reimburseOnline.vue

@@ -23,6 +23,9 @@
        </view>
        

        <view class="fxbtn">
            <uni-icons type="plusempty" color="#fff" @click="add()" ></uni-icons>
        </view>
    </view>
</template>

@@ -44,12 +47,14 @@
            this.getReimburseOnline()
        },
        methods: {
            back() {
                uni.navigateBack({})
            },
            scan() {
            add() {
                uni.navigateTo({
                    url: '/pages/authority/authority'
                    url: '/pages/business/goBusiness/modiReimburseOnlineDetl',
                    success: function(res) {
                        res.eventChannel.emit('reimburseOnlineDetl', {
                            data: 'add'
                        })
                    }
                })
            },
            goDetl(e) {
@@ -84,6 +89,14 @@
                    }
                })
            },
            back() {
                uni.navigateBack({})
            },
            scan() {
                uni.navigateTo({
                    url: '/pages/authority/authority'
                })
            },
        }
    }
</script>

 pages/business/goBusiness/reimburseOnlineDetl.vue

@@ -123,116 +123,12 @@
                                    <view class="item-content">{{item.updateTime}}</view>
                                </td>
                                <td class="scroll-item">
                                    <view class="item-content">{{item.updateUserName}}</view>
                                    <view class="item-content-last">{{item.updateUserName}}</view>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </view>
                <!-- <scroll-view class="box-scroll" scroll-x="true" >
                    <view class="scroll-head">
                        <view class="scroll-item scroll-head">
                            <view class="item-content">事由</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">费用类型</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">税率</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">未税本币金额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">未税金额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">税额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">发票金额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">发票本币金额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">报销比例</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">报销金额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">报销本币金额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">出纳确认金额</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">列支人员</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">列支部门</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content">更新日期</view>
                        </view>
                        <view class="scroll-item scroll-head">
                            <view class="item-content-last">更新人员名字</view>
                        </view>
                    </view>
                    <view style="border-top: 1px solid #e7e7e7;" v-for="(item, index) in onlineDetl" :key="index">
                        <view class="scroll-item">
                            <view class="item-content">{{item.occupation}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.expenseType$}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.taxRate}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.untaxedAmountInLocalCurrency}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.untaxedAmount}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.taxAmount}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.invoiceValue}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.invoiceAmountInLocalCurrency}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.reimbursementRatio}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.reimbursementAmount}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.reimbursementAmountInLocalCurrency}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.cashierConfirmationAmount}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.userId$}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.deptId$}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content">{{item.updateTime}}</view>
                        </view>
                        <view class="scroll-item">
                            <view class="item-content-last">{{item.updateUserName}}</view>
                        </view>
                    </view>
                    <view style="height: 10rpx;"></view>
                </scroll-view> -->
				
            </view>
        </view>

@@ -255,10 +151,14 @@
                </u-steps>
            </view>
        </view>
		
        <view style="height: 70rpx;">
			
        </view>w

        <view class="floor">
            <view class="wran">删除</view>
            <view class="default">编辑</view>
            <view class="default" @click="modiReimburse()">编辑</view>
            <view class="primary" @click="submit()">审批</view>
        </view>
    </view>
@@ -345,6 +245,11 @@
            }
        },
        methods: {
            modiReimburse() {
                uni.navigateTo({
                    url: '/pages/business/goBusiness/modiReimburseOnlineDetl'
                })
            },
            back() {
                uni.navigateBack({})
            },