|
@@ -0,0 +1,299 @@
|
|
|
+<template>
|
|
|
+ <view class="content flex flex_column" v-if="billInfo">
|
|
|
+ <view class="b_head">
|
|
|
+ <view class="head_list">
|
|
|
+ <text>分享时间</text>
|
|
|
+ <text>{{ billInfo.createDate }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="head_list" v-if="billInfo.customer">
|
|
|
+ <text>客户名称</text>
|
|
|
+ <text>{{ billInfo.customer.customerName }}</text>
|
|
|
+ </view>
|
|
|
+ <!-- <view class="head_list">
|
|
|
+ <text>对账周期</text>
|
|
|
+ <text>{{ timeInfo || '--' }}</text>
|
|
|
+ </view> -->
|
|
|
+ <view class="head_list">
|
|
|
+ <text>付款状态</text>
|
|
|
+ <text>{{ billInfo.billStatus == 'UNSETTLE' ? '未付款' : billInfo.settleStyleSnDictValue ? '已结清(' + billInfo.settleStyleSnDictValue + ')' : '已结清' }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="b_detail">
|
|
|
+ <view class="detail_list u-flex">
|
|
|
+ <view class="detail_box">
|
|
|
+ <text>总单数:</text>
|
|
|
+ <text>{{ billInfo.detailNum }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail_box">
|
|
|
+ <text>待收金额合计:</text>
|
|
|
+ <text>¥{{ billInfo.totalAmount ||billInfo.totalAmount == 0 ? toThousands(billInfo.totalAmount,2):'--' }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="detail_list u-flex">
|
|
|
+ <view class="detail_box">
|
|
|
+ <text>折让金额:</text>
|
|
|
+ <text>¥{{ billInfo.discountAmount||billInfo.discountAmount==0? toThousands(billInfo.discountAmount,2):'--'}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail_box">
|
|
|
+ <text>折让后待收金额:</text>
|
|
|
+ <text>¥{{ billInfo.settleAmount||billInfo.settleAmount ==0? toThousands(billInfo.settleAmount,2):'--' }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="detail_list u-flex" v-if="billInfo.billStatus != 'UNSETTLE'">
|
|
|
+ <view class="detail_box">
|
|
|
+ <text>实际折让金额:</text>
|
|
|
+ <text>¥{{ billInfo.discountAmount||billInfo.discountAmount==0? toThousands(billInfo.discountAmount,2):'--'}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail_box">
|
|
|
+ <text>实际收款金额:</text>
|
|
|
+ <text>¥{{ billInfo.settleAmount||billInfo.settleAmount ==0? toThousands(billInfo.settleAmount,2):'--' }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="detail_con"><billList ref="billBox" :list="billArr" :showCheck="isShowEdit" @allChecked="chooseBillList"></billList></view>
|
|
|
+ <view class="footer flex align_center" v-if="billInfo.billStatus == 'UNSETTLE'">
|
|
|
+ <u-checkbox-group style="flex:1;">
|
|
|
+ <u-checkbox v-model="checkedAll" shape="circle" @change="chooseAll">{{checkedAll?'取消全选':'全选'}}</u-checkbox>
|
|
|
+ </u-checkbox-group>
|
|
|
+ <view class="u-flex u-row-right">
|
|
|
+ <u-button type="error" shape="circle" :loading="btnLoading" @click="submitOrder" :custom-style="customStyle">删除</u-button>
|
|
|
+ <u-button type="warning" shape="circle" style="margin-left: 30rpx;" @click="openPaymentModal">一键刷新</u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 确认收款弹窗 -->
|
|
|
+ <u-popup v-model="showPayment" mode="center" :border-radius="20" width="82%">
|
|
|
+ <view class="slot-content">
|
|
|
+ <view style="padding:50rpx 40rpx;">
|
|
|
+ <u-form :model="form" ref="uForm" :label-width="190" :rules="rules" :label-style="{color:'#999'}">
|
|
|
+ <u-form-item :border-bottom ="false" label="总单数:" prop="num">23</u-form-item>
|
|
|
+ <u-form-item :border-bottom ="false" label="实际收款金额:" prop="money"><u-input type="number" placeholder="请输入实际收款金额(最多2位小数)" :border="true" :height="60" v-model="form.money"/></u-form-item>
|
|
|
+ </u-form>
|
|
|
+ </view>
|
|
|
+ <view class="paymentFooter flex algin-center">
|
|
|
+ <view @click="showPayment = false">取消</view>
|
|
|
+ <view >确定</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ <!-- 分享询问弹窗 -->
|
|
|
+ <u-modal v-model="shareShow" :show-cancel-button="true" :content="shareContent" @confirm="handleShare" @cancel="shareShow = false;btnLoading = false;"></u-modal>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import billList from './billListComponent.vue';
|
|
|
+import { findBySn, insert } from '@/api/verify.js';
|
|
|
+import getDate from '@/libs/getDate.js';
|
|
|
+import { toThousands } from '@/libs/tools.js'
|
|
|
+export default {
|
|
|
+ components: { billList },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ customStyle: {
|
|
|
+ width:'200rpx',
|
|
|
+ color: '#fff'
|
|
|
+ },
|
|
|
+ verifySn: '',
|
|
|
+ billInfo: null,
|
|
|
+ billArr: [],
|
|
|
+ timeInfo: '',
|
|
|
+ btnLoading: false,
|
|
|
+ shareShow: false,
|
|
|
+ isShowEdit:true,//删除
|
|
|
+ shareContent: `是否同意发送对账单给微信好友?`,
|
|
|
+ toThousands,
|
|
|
+ showPayment:false,
|
|
|
+ form:{
|
|
|
+ money:''
|
|
|
+ },
|
|
|
+ checkedAll:false,
|
|
|
+ rules: {
|
|
|
+ money: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请输入实际收款金额',
|
|
|
+ trigger: ['change','blur'],
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onReady() {
|
|
|
+ uni.setNavigationBarColor({
|
|
|
+ frontColor: '#ffffff',
|
|
|
+ backgroundColor: this.$config('primaryColor')
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ if (options && options.billId) {
|
|
|
+ this.verifySn = options.billId;
|
|
|
+ this.loadData({ verifySn: options.billId });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ //经销商信息
|
|
|
+ userData() {
|
|
|
+ return this.$store.state.vuex_userData;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ chooseBillList(flag){
|
|
|
+ this.checkedAll = flag
|
|
|
+ },
|
|
|
+ chooseAll(){
|
|
|
+ this.$refs.billBox.allSelect(!this.checkedAll);
|
|
|
+ },
|
|
|
+ loadData(ajaxData) {
|
|
|
+ let that = this;
|
|
|
+ findBySn(ajaxData).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ that.billInfo = res.data;
|
|
|
+ that.billArr = res.data.detailList;
|
|
|
+ let timeobj = getDate.editDay(res.data.bizBeginDate, res.data.bizEndDate);
|
|
|
+ that.timeInfo = timeobj.starttime + '~' + timeobj.endtime;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs.billBox.setData(res.data.detailList);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 打开确认收款弹窗
|
|
|
+ openPaymentModal(){
|
|
|
+ this.showPayment = true
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.uForm.setRules(this.rules);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ submitOrder() {
|
|
|
+ //发送对账单
|
|
|
+ this.shareShow = true;
|
|
|
+ },
|
|
|
+ //确认收款
|
|
|
+ handlePay(){
|
|
|
+ this.$refs.uForm.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ console.log('验证通过');
|
|
|
+ } else {
|
|
|
+ console.log('验证失败');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleEdit(){
|
|
|
+ this.isShowEdit=!this.isShowEdit
|
|
|
+ this.$refs.billBox.allSelect(true)
|
|
|
+ },
|
|
|
+ // 分享图文
|
|
|
+ handleShare() {
|
|
|
+ let jumpUrl = getApp().globalData.baseUrl.replace('qpls-md/','')
|
|
|
+ let url = jumpUrl+'dzd/index.html?' + this.userData.orgSn + '&' + this.verifySn;
|
|
|
+ if (uni.getSystemInfoSync().platform == 'ios') {
|
|
|
+ uni.share({
|
|
|
+ provider: 'weixin',
|
|
|
+ scene: 'WXSceneSession',
|
|
|
+ type: 0,
|
|
|
+ href: url,
|
|
|
+ title: this.billInfo.customer.customerName + '的对账单',
|
|
|
+ summary: '共' + this.billInfo.settleAmount + '元,请您查阅',
|
|
|
+ imageUrl: '../../static/logo.png',
|
|
|
+ success: function(res) {
|
|
|
+ console.log('success:' + JSON.stringify(res));
|
|
|
+ },
|
|
|
+ fail: function(err) {
|
|
|
+ console.log('fail:' + JSON.stringify(err));
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.shareWithSystem({
|
|
|
+ summary: this.billInfo.customer.customerName + '您好,您有一个对账单共' + this.billInfo.settleAmount + '元,请您查阅',
|
|
|
+ href: url,
|
|
|
+ success() {
|
|
|
+ console.log('调取微信列表成功,分享不一定成功');
|
|
|
+ },
|
|
|
+ fail() {
|
|
|
+ console.log('分享失败');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.content {
|
|
|
+ height: 100vh;
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .b_head {
|
|
|
+ background-color: #fff;
|
|
|
+ .head_list {
|
|
|
+ padding: 14rpx 20rpx;
|
|
|
+ border-bottom: 1rpx solid #f8f8f8;
|
|
|
+
|
|
|
+ text {
|
|
|
+ &:first-child {
|
|
|
+ color: $uni-text-color-grey;
|
|
|
+ display: inline-block;
|
|
|
+ width: 160rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .b_detail {
|
|
|
+ margin: 6rpx 0;
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .detail_list {
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+ &:last-child {
|
|
|
+ margin-bottom: 0rpx;
|
|
|
+ }
|
|
|
+ .detail_box::after {
|
|
|
+ content: ';';
|
|
|
+ color: $uni-text-color-grey;
|
|
|
+ }
|
|
|
+ .detail_box {
|
|
|
+ text {
|
|
|
+ &:first-child {
|
|
|
+ color: $uni-text-color-grey;
|
|
|
+ }
|
|
|
+ &:last-child {
|
|
|
+ color: $uni-color-warning;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .detail_con {
|
|
|
+ flex-grow: 1;
|
|
|
+ overflow: auto;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+ .footer {
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10rpx 20rpx;
|
|
|
+ background: #fff;
|
|
|
+ }
|
|
|
+}
|
|
|
+// 确认收款弹窗
|
|
|
+.slot-content{
|
|
|
+ .u-form-item{
|
|
|
+ line-height:0 !important;
|
|
|
+ }
|
|
|
+ .paymentFooter{
|
|
|
+ border-top:1rpx solid #eee;
|
|
|
+ view{
|
|
|
+ width: 50%;
|
|
|
+ text-align:center;
|
|
|
+ padding:26rpx 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .paymentFooter view:last-child{
|
|
|
+ color:#007aff;
|
|
|
+ border-left:1rpx solid #eee;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|