billHistoryDetail.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. <template>
  2. <view class="content flex flex_column" v-if="billInfo">
  3. <view class="b_head">
  4. <view class="head_list">
  5. <text>分享时间</text>
  6. <text>{{billInfo.createDate}}</text>
  7. </view>
  8. <view class="head_list" v-if="billArr.customer">
  9. <text>客户名称</text>
  10. <text>{{billInfo.customer.customerName}}</text>
  11. </view>
  12. <view class="head_list">
  13. <text>对账周期</text>
  14. <text>{{timeInfo || '--'}}</text>
  15. </view>
  16. <view class="head_list">
  17. <text>付款状态</text>
  18. <text>{{billInfo.billStatus != 'UNSETTLE'?'未付款':billInfo.settleStyleSnDictValue ? '已付款('+billInfo.settleStyleSnDictValue+')':'已付款'}}</text>
  19. </view>
  20. </view>
  21. <view class="b_detail">
  22. <view class="detail_list u-flex">
  23. <view class="detail_box">
  24. <text>总单数:</text>
  25. <text>{{billInfo.detailNum}}</text>
  26. </view>
  27. <view class="detail_box">
  28. <text>待收金额合计:</text>
  29. <text>{{billInfo.totalAmount}}</text>
  30. </view>
  31. </view>
  32. <view class="detail_list u-flex">
  33. <view class="detail_box">
  34. <text>折让金额:</text>
  35. <text>{{billInfo.discountAmount}}</text>
  36. </view>
  37. <view class="detail_box">
  38. <text>折让后待收金额:</text>
  39. <text>{{billInfo.settleAmount}}</text>
  40. </view>
  41. </view>
  42. </view>
  43. <view class="detail_con">
  44. <billList ref="billBox" :list="billArr" ></billList>
  45. </view>
  46. <view class="footer" v-if="billInfo.billStatus != 'UNSETTLE'">
  47. <u-button type="primary" :loading="btnLoading" @click="submitOrder" :custom-style="customStyle" shape="circle">再次发送对账单</u-button>
  48. </view>
  49. <!-- 分享询问弹窗 -->
  50. <u-modal v-model="shareShow" :content="shareContent" @confirm="handleShare" @cancel="shareShow = false"></u-modal>
  51. </view>
  52. </template>
  53. <script>
  54. import billList from './billListComponent.vue'
  55. import { findBySn,insert} from '@/api/verify.js';
  56. import getDate from '@/libs/getDate.js';
  57. export default {
  58. components: { billList },
  59. data() {
  60. return {
  61. customStyle:{
  62. backgroundColor: this.$config('primaryColor'),
  63. color: '#fff',
  64. verifySn:''
  65. },
  66. billInfo:null,
  67. billArr:[],
  68. timeInfo:'',
  69. btnLoading:false,
  70. shareShow:false
  71. };
  72. },
  73. onReady() {
  74. uni.setNavigationBarColor({
  75. frontColor: '#ffffff',
  76. backgroundColor: this.$config('primaryColor')
  77. });
  78. },
  79. onLoad(options) {
  80. if(options && options.billId){
  81. this.verifySn=options.billId
  82. this.loadData({verifySn:options.billId})
  83. }
  84. },
  85. computed: {
  86. //经销商信息
  87. userData() {
  88. return this.$store.state.vuex_userData;
  89. }
  90. },
  91. methods:{
  92. loadData(ajaxData){
  93. let that=this
  94. findBySn(ajaxData).then(res => {
  95. if (res.status == 200) {
  96. that.billInfo=res.data;
  97. that.billArr=res.data.detailList;
  98. let timeobj=getDate.editDay(res.data.bizBeginDate,res.data.bizEndDate);
  99. that.timeInfo= timeobj.starttime +'~'+timeobj.endtime
  100. that.$nextTick(()=>{
  101. that.$refs.billBox.setData(res.data.detailList);
  102. })
  103. }
  104. });
  105. },
  106. submitOrder(){//发送对账单
  107. this.shareShow = true;
  108. },
  109. // 分享图文
  110. handleShare(){
  111. let url = 'http://p.iscm.360arrow.com/dzd/index.html?userSn=' + this.userData.orgSn + '&verifySn='+this.verifySn + '&name='+this.userData.orgName;
  112. if (uni.getSystemInfoSync().platform == 'ios') {
  113. uni.share({
  114. provider: 'weixin',
  115. scene: 'WXSceneSession',
  116. type: 0,
  117. href: url,
  118. title: this.billInfo.customer.customerName,
  119. summary: '共' + this.billInfo.settleAmount + '元,请您查阅',
  120. imageUrl: '../../static/logo.png',
  121. success: function(res) {
  122. console.log('success:' + JSON.stringify(res));
  123. },
  124. fail: function(err) {
  125. console.log('fail:' + JSON.stringify(err));
  126. }
  127. });
  128. } else {
  129. uni.shareWithSystem({
  130. summary: this.billInfo.customer.customerName + '您好,您有一个对账单共' + this.billInfo.settleAmount + '元,请您查阅',
  131. href: url,
  132. success() {
  133. console.log('调取微信列表成功,分享不一定成功')
  134. },
  135. fail() {
  136. console.log('分享失败')
  137. }
  138. });
  139. }
  140. }
  141. }
  142. };
  143. </script>
  144. <style lang="scss" scoped>
  145. .content {
  146. height: 100vh;
  147. width: 100%;
  148. .b_head {
  149. background-color: #fff;
  150. .head_list {
  151. padding:14rpx 20rpx;
  152. border-bottom: 1rpx solid #f8f8f8;
  153. text {
  154. &:first-child {
  155. color: $uni-text-color-grey;
  156. display: inline-block;
  157. width: 160rpx;
  158. }
  159. }
  160. }
  161. }
  162. .b_detail{
  163. margin:6rpx 0;
  164. background-color: #fff;
  165. padding:20rpx;
  166. box-sizing: border-box;
  167. .detail_list{
  168. margin-bottom: 10rpx;
  169. &:last-child{
  170. margin-bottom: 0rpx;
  171. }
  172. .detail_box::after{
  173. content:';';
  174. color:$uni-text-color-grey;
  175. }
  176. .detail_box{
  177. text{
  178. &:first-child{
  179. color:$uni-text-color-grey;
  180. }
  181. &:last-child{
  182. color:$uni-color-warning;
  183. font-weight: 600;
  184. }
  185. }
  186. }
  187. }
  188. }
  189. .detail_con{
  190. flex-grow: 1;
  191. overflow: auto;
  192. background-color: #fff;
  193. }
  194. .footer{
  195. padding:10rpx 20rpx;
  196. background:#fff;
  197. margin-top:20rpx;
  198. }
  199. }
  200. </style>