Browse Source

修改返回图标

lilei 4 năm trước cách đây
mục cha
commit
651bbf33a5

+ 2 - 2
src/views/customerManagement/customerInfo/edit.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="customerManagementEdit-wrap">
-    <a-page-header :ghost="false" @back="handleBack" class="customerManagementEdit-back">
+    <a-page-header :ghost="false" :backIcon="false" class="customerManagementEdit-back">
       <!-- 自定义的二级文字标题 -->
       <template slot="subTitle">
-        <a id="customerManagementEdit-back-btn" href="javascript:;" @click="handleBack">返回列表</a>
+        <a id="customerManagementEdit-back-btn" href="javascript:;" @click="handleBack"><a-icon type="left" /> 返回列表</a>
       </template>
     </a-page-header>
     <a-card size="small" :bordered="false" class="customerManagementEdit-table-page-wrapper">

+ 93 - 0
src/views/financialManagement/financialPayment/detailModal.vue

@@ -0,0 +1,93 @@
+<template>
+  <a-modal
+    centered
+    class="financialPaymentDetail-modal"
+    :footer="null"
+    :maskClosable="false"
+    title="凭证"
+    v-model="isShow"
+    @cancle="isShow=false"
+    :width="600">
+    <!-- 详情 -->
+    <div v-if="detailsData">
+      <a-descriptions :column="1" size="default">
+        <a-descriptions-item label="付款单号">{{ detailsData.settleNo || '--' }}</a-descriptions-item>
+        <a-descriptions-item label="关联单号">{{ detailsData.bizNo || '--' }}</a-descriptions-item>
+        <a-descriptions-item label="商户名称">{{ detailsData.settleClientName || '--' }}</a-descriptions-item>
+        <a-descriptions-item label="付款金额">{{ detailsData.totalAmount || '--' }}</a-descriptions-item>
+        <a-descriptions-item label="付款类型">{{ detailsData.bizName || '--' }}</a-descriptions-item>
+        <a-descriptions-item label="付款方式">{{ detailsData.settleStyleName || '--' }}</a-descriptions-item>
+        <a-descriptions-item label="付款时间">{{ detailsData.settleTime || '--' }}</a-descriptions-item>
+        <a-descriptions-item label="审核时间">{{ detailsData.auditTime || '--' }}</a-descriptions-item>
+      </a-descriptions>
+      <div class="btn-cont"><a-button id="financialPaymentDetail-modal-back" @click="isShow = false">关闭</a-button></div>
+    </div>
+  </a-modal>
+</template>
+
+<script>
+import { findPayDetail } from '@/api/settlePay.js'
+export default {
+  name: 'FinancialPaymentDetailModal',
+  props: {
+    openModal: { //  弹框显示状态
+      type: Boolean,
+      default: false
+    },
+    itemId: {
+      type: [Number, String],
+      default: ''
+    }
+  },
+  data () {
+    return {
+      isShow: this.openModal, //  是否打开弹框
+      // detailsData: null, //  详情数据
+      detailsData: {
+        productName: '',
+        productCode: '',
+        origCode: '',
+        unit: '',
+        productBrandName: ''
+      }
+    }
+  },
+  methods: {
+    //  获取详情
+    getDetail (id) {
+      findPayDetail({ id: id }).then(res => {
+        	if (res.status == 200) {
+        		this.detailsData = res.data
+        	} else {
+        		this.detailsData = null
+        	}
+      })
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (newValue, oldValue) {
+      if (!newValue) {
+        this.$emit('close')
+        this.detailsData = null
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .financialPaymentDetail-modal{
+    .ant-modal-body {
+    	padding: 40px 40px 24px;
+    }
+    .btn-cont {
+    	text-align: center;
+    	margin: 35px 0 10px;
+    }
+  }
+</style>

+ 107 - 39
src/views/financialManagement/financialPayment/list.vue

@@ -11,18 +11,14 @@
       <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
         <a-row :gutter="15">
           <a-col :md="6" :sm="24">
-            <a-form-item label="付款单号">
-              <a-input id="finacialPay-settleNo" v-model.trim="queryParam.settleNo" allowClear placeholder="请输入付款单号"/>
-            </a-form-item>
+            <a-form-item label="付款单号"><a-input id="finacialPay-settleNo" v-model.trim="queryParam.settleNo" allowClear placeholder="请输入付款单号" /></a-form-item>
           </a-col>
           <a-col :md="6" :sm="24">
-            <a-form-item label="关联单号">
-              <a-input id="finacialPay-bizNo" v-model.trim="queryParam.bizNo" allowClear placeholder="请输入关联单号"/>
-            </a-form-item>
+            <a-form-item label="关联单号"><a-input id="finacialPay-bizNo" v-model.trim="queryParam.bizNo" allowClear placeholder="请输入关联单号" /></a-form-item>
           </a-col>
           <a-col :md="6" :sm="24">
             <a-form-item label="商户名称">
-              <a-input id="finacialPay-settleClientName" v-model.trim="queryParam.settleClientName" allowClear placeholder="请输入商户名称"/>
+              <a-input id="finacialPay-settleClientName" v-model.trim="queryParam.settleClientName" allowClear placeholder="请输入商户名称" />
             </a-form-item>
           </a-col>
           <template v-if="advanced">
@@ -38,18 +34,16 @@
               </a-form-item>
             </a-col>
             <a-col :md="6" :sm="24">
-              <a-form-item label="审核时间">
-                <a-range-picker v-model="queryParam.auditDate" id="finacialPay-auditDate"/>
-              </a-form-item>
+              <a-form-item label="审核时间"><a-range-picker v-model="queryParam.auditDate" id="finacialPay-auditDate" /></a-form-item>
             </a-col>
           </template>
           <a-col :md="6" :sm="24">
             <span class="table-page-search-submitButtons">
               <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="finacialPay-refresh">查询</a-button>
               <a-button style="margin-left: 8px" @click="resetSearchForm()" :disabled="disabled" id="finacialPay-reset">重置</a-button>
-              <a @click="advanced=!advanced" style="margin-left: 8px">
+              <a @click="advanced = !advanced" style="margin-left: 8px">
                 {{ advanced ? '收起' : '展开' }}
-                <a-icon :type="advanced ? 'up' : 'down'"/>
+                <a-icon :type="advanced ? 'up' : 'down'" />
               </a>
             </span>
           </a-col>
@@ -58,12 +52,19 @@
     </div>
     <!-- alert -->
     <a-alert type="info" showIcon style="margin-bottom:15px">
-      <div slot="message">共 <strong>{{ totalData.count }}</strong> 条记录,付款金额合计 <strong>¥{{ totalData.totalAmount }}</strong> ,其中已付 <strong>¥{{ totalData.settledAmount }}</strong> ,未付 <strong>¥{{ totalData.unsettleAmount }}</strong> </div>
+      <div slot="message">
+        共
+        <strong>{{ totalData.count }}</strong>
+        条记录,付款金额合计
+        <strong>¥{{ totalData.totalAmount }}</strong>
+        ,其中已付
+        <strong>¥{{ totalData.settledAmount }}</strong>
+        ,未付
+        <strong>¥{{ totalData.unsettleAmount }}</strong>
+      </div>
     </a-alert>
     <div style="margin-bottom: 15px">
-      <a-button type="primary" id="finacialPay-export" :disabled="!hasSelected" :loading="loading" @click="handlePayment">
-        批量付款
-      </a-button>
+      <a-button type="primary" id="finacialPay-export" :disabled="!hasSelected" :loading="loading" @click="handlePayment">批量付款</a-button>
       <span style="margin-left: 8px">
         <template v-if="hasSelected">
           {{ `已选 ${selectedRowKeys.length} 项` }}
@@ -76,11 +77,12 @@
       ref="table"
       size="default"
       :row-selection="rowSelection"
-      :rowKey="(record) => record.id"
+      :rowKey="record => record.id"
       :columns="columns"
       :data="loadData"
       :scroll="{ x: 1280 }"
-      bordered>
+      bordered
+    >
       <!-- 操作 -->
       <template slot="action" slot-scope="text, record">
         <a-button size="small" type="link" v-if="record.settleState == 'FINISH'" @click="handleVoucher(record)" id="finacialPay-voucher-btn">凭证</a-button>
@@ -93,19 +95,23 @@
           id="finacialPay-pay-btn">付款</a-button>
       </template>
     </s-table>
+    <!-- 详情 -->
+    <detail-modal :openModal="openModal" ref="detailModal" @close="openModal = false" />
   </a-card>
 </template>
 
 <script>
 import { STable, VSelect } from '@/components'
-import { settlePayQuery, queryByTypeSum, settlePayMoney, findPayDetail, settlePayQuerySum } from '@/api/settlePay.js'
+import detailModal from './detailModal.vue'
+import { settlePayQuery, queryByTypeSum, settlePayMoney, settlePayQuerySum } from '@/api/settlePay.js'
 import moment from 'moment'
 export default {
-  components: { STable, VSelect },
+  components: { STable, VSelect, detailModal },
   data () {
     return {
       advanced: false, //  高级搜索 展开/关闭
       disabled: false, //  查询、重置按钮是否可操作
+      openModal: false, // 详情弹框
       curBizType: '',
       // 查询参数
       queryParam: {
@@ -128,14 +134,77 @@ export default {
       // 表头
       columns: [
         { title: '序号', dataIndex: 'no', width: 80, align: 'center' },
-        { title: '付款单号', dataIndex: 'settleNo', width: 140, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '关联单号', dataIndex: 'bizNo', width: 140, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '商户名称', dataIndex: 'settleClientName', align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '付款金额', dataIndex: 'totalAmount', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? ('¥' + text) : '--') } },
-        { title: '付款类型', dataIndex: 'bizName', width: 100, align: 'center' },
-        { title: '付款方式', dataIndex: 'settleStyleName', width: 100, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '付款时间', dataIndex: 'settleTime', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '审核时间', dataIndex: 'auditTime', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
+        {
+          title: '付款单号',
+          dataIndex: 'settleNo',
+          width: 140,
+          align: 'center',
+          customRender: function (text) {
+            return text || '--'
+          }
+        },
+        {
+          title: '关联单号',
+          dataIndex: 'bizNo',
+          width: 140,
+          align: 'center',
+          customRender: function (text) {
+            return text || '--'
+          }
+        },
+        {
+          title: '商户名称',
+          dataIndex: 'settleClientName',
+          align: 'center',
+          customRender: function (text) {
+            return text || '--'
+          }
+        },
+        {
+          title: '付款金额',
+          dataIndex: 'totalAmount',
+          width: 100,
+          align: 'center',
+          customRender: function (text) {
+            return text || text == 0 ? '¥' + text : '--'
+          }
+        },
+        {
+          title: '付款类型',
+          dataIndex: 'bizName',
+          width: 100,
+          align: 'center',
+          customRender: function (text) {
+            return text || '--'
+          }
+        },
+        {
+          title: '付款方式',
+          dataIndex: 'settleStyleName',
+          width: 100,
+          align: 'center',
+          customRender: function (text) {
+            return text || '--'
+          }
+        },
+        {
+          title: '付款时间',
+          dataIndex: 'settleTime',
+          width: 160,
+          align: 'center',
+          customRender: function (text) {
+            return text || '--'
+          }
+        },
+        {
+          title: '审核时间',
+          dataIndex: 'auditTime',
+          width: 160,
+          align: 'center',
+          customRender: function (text) {
+            return text || '--'
+          }
+        },
         { title: '操作', scopedSlots: { customRender: 'action' }, width: 100, align: 'center', fixed: 'right' }
       ],
       selectedRowKeys: [], // Check here to configure the default column
@@ -205,11 +274,10 @@ export default {
         }
       })
     },
-    //  凭证
+    //  凭证弹框
     handleVoucher (row) {
-      findPayDetail({ id: row.id }).then(res => {
-        console.log(res, '凭证')
-      })
+      this.$refs.detailModal.getDetail(row.id)
+      this.openModal = true
     },
     // 付款
     handlePay (row) {
@@ -259,12 +327,12 @@ export default {
 }
 </script>
 <style lang="less">
-  .finacialPay-wrap{
-    .sTable{
-      margin-top: 15px;
-    }
-    .finacialPay-tabs{
-      margin-bottom: 15px;
-    }
+.finacialPay-wrap {
+  .sTable {
+    margin-top: 15px;
+  }
+  .finacialPay-tabs {
+    margin-bottom: 15px;
   }
+}
 </style>