diff --git a/anrui-buscenter/anrui-finmanage-ui/src/api/anruifinmanagement/paymentConfirmation.js b/anrui-buscenter/anrui-finmanage-ui/src/api/anruifinmanagement/paymentConfirmation.js
index 90bf7f1ee8..98ee34846e 100644
--- a/anrui-buscenter/anrui-finmanage-ui/src/api/anruifinmanagement/paymentConfirmation.js
+++ b/anrui-buscenter/anrui-finmanage-ui/src/api/anruifinmanagement/paymentConfirmation.js
@@ -141,6 +141,15 @@ export function createPdf(data) {
   })
 }
 
+// 客户账单明细--下载
+export function createPdfByCustomer(data) {
+  return request({
+    url: '/fin/finuncollectedreceivablesdetailed/createPdf',
+    method: 'post',
+    params: data
+  })
+}
+
 // 收款款项确认
 export function ctskd(data) {
   return request({
diff --git a/anrui-buscenter/anrui-finmanage-ui/src/views/anruifinmanagement/paymentConfirmation/customerBillingDetails.vue b/anrui-buscenter/anrui-finmanage-ui/src/views/anruifinmanagement/paymentConfirmation/customerBillingDetails.vue
index c2d72cdab3..49955ac126 100644
--- a/anrui-buscenter/anrui-finmanage-ui/src/views/anruifinmanagement/paymentConfirmation/customerBillingDetails.vue
+++ b/anrui-buscenter/anrui-finmanage-ui/src/views/anruifinmanagement/paymentConfirmation/customerBillingDetails.vue
@@ -1,56 +1,47 @@
 <template>
   <div class="app-container">
     <div>
-      <div class="tab-header webtop">
-        <div>客户账单明细</div>
-        <div>
-          <el-button type="info" size="small">导表</el-button>
-          <el-button type="info" size="small">关闭</el-button>
-        </div>
-      </div>
-      <div class="webcon">
+      <button-bar view-title="客户账单明细" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/>
+      <div class="main-content">
         <div class="searchcon">
           <el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button>
           <div v-show="isSearchShow" class="search">
             <el-form ref="listQueryform" :inline="true" :model="listQuery" label-width="100px" class="tab-header">
-              <el-row>
-                <el-form-item label="客户名称:">
-                  <el-input v-model="listQuery.params.customerName" placeholder="" clearable class="addinputw"/>
-                </el-form-item>
-                <el-form-item label="合同编号:">
-                  <el-input v-model="listQuery.params.contractNo" placeholder="" clearable class="addinputw"/>
-                </el-form-item>
-                <el-form-item label="款项类型:">
-                  <el-select v-model="listQuery.params.paymentTypeKey" placeholder="请选择" filterable clearable>
-                    <el-option v-for="item in paymentType_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
-                  </el-select>
-                </el-form-item>
-                <el-form-item label="生成时间:">
-                  <el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.createStartTime" clearable style="width: 160px" type="date" placeholder="开始日期"/>
-                  <div class="line">至</div>
-                  <el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.createEndTime" clearable style="width: 160px" type="date" placeholder="结束日期"/>
-                </el-form-item>
-              </el-row>
-              <el-row>
-                <el-form-item label="款项名称:">
-                  <el-input v-model="listQuery.params.receivablesName" placeholder="" clearable class="addinputw"/>
-                </el-form-item>
-              </el-row>
-              <div class="searchbtns">
-                <el-button type="primary" @click="handleFilter">查询</el-button>
-                <el-button type="primary" @click="handReset">重置</el-button>
-              </div>
+              <el-form-item label="客户名称:">
+                <el-input v-model="listQuery.params.customerName" placeholder="" clearable class="addinputw"/>
+              </el-form-item>
+              <el-form-item label="合同编号:">
+                <el-input v-model="listQuery.params.contractNo" placeholder="" clearable class="addinputw"/>
+              </el-form-item>
+              <el-form-item label="车架号:">
+                <el-input v-model="listQuery.params.vinNo" placeholder="" clearable class="addinputw"/>
+              </el-form-item>
+              <el-form-item label="款项名称:">
+                <el-input v-model="listQuery.params.receivablesName" placeholder="" clearable class="addinputw"/>
+              </el-form-item>
+              <el-form-item label="生成时间:">
+                <el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.createStartTime" clearable style="width: 160px" type="date" placeholder="开始日期"/>
+                <span style="padding: 0 8px">至</span>
+                <el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.createEndTime" clearable style="width: 160px" type="date" placeholder="结束日期"/>
+              </el-form-item>
             </el-form>
+            <div class="btn" style="text-align: center;">
+              <el-button type="primary" icon="el-icon-search" size="small" @click="handleFilter">查询</el-button>
+              <el-button type="primary" icon="el-icon-refresh" size="small" @click="handReset">重置</el-button>
+            </div>
           </div>
-        </div>
-        <div>
           <div class="listtop">
             <div class="tit">应收款项列表</div>
             <pageye v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/>
           </div>
           <div class="">
-            <el-table v-loading="listLoading" :data="list" border style="width: 100%" row-key="noSubscriptionMoney" :tree-props="{children: 'finSelectedReceivablesDetailedVos', hasChildren: 'hasChildren'}">
+            <el-table :key="tableKey" v-loading="listLoading" :data="list" border style="width: 100%" row-key="sid" :tree-props="{children: 'finSelectedReceivablesDetailedVos', hasChildren: 'hasChildren'}">
               <el-table-column width="80px" label="序号" type="index" :index="indexMethod" align="center"/>
+              <el-table-column label="操作" width="80px" align="center">
+                <template slot-scope="scope">
+                  <el-button type="primary" v-show="scope.row.download" size="mini" @click="handleDownLoad(scope.row)">下载</el-button>
+                </template>
+              </el-table-column>
               <el-table-column label="客户名称" align="center">
                 <template slot-scope="scope">
                   <span>{{ scope.row.customerName }}</span>
@@ -61,9 +52,9 @@
                   <span>{{ scope.row.contractNo }}</span>
                 </template>
               </el-table-column>
-              <el-table-column label="款项类型" align="center">
+              <el-table-column label="车架号" align="center">
                 <template slot-scope="scope">
-                  <span>{{ scope.row.paymentTypeValue }}</span>
+                  <span>{{ scope.row.vinNo }}</span>
                 </template>
               </el-table-column>
               <el-table-column label="款项名称" align="center">
@@ -73,7 +64,7 @@
               </el-table-column>
               <el-table-column label="应收金额" align="center">
                 <template slot-scope="scope">
-                  <span>{{ scope.row.currentReceivableMoney }}</span>
+                  <span>{{ scope.row.reveivableMoney }}</span>
                 </template>
               </el-table-column>
               <el-table-column label="实收金额" align="center">
@@ -109,23 +100,35 @@
 </template>
 
 <script>
-import { customerBillDetailedListPage, dataDictionary } from '@/api/anruifinmanagement/paymentConfirmation.js'
+import { createPdfByCustomer, customerBillDetailedListPage} from '@/api/anruifinmanagement/paymentConfirmation.js'
 import Pagination from '@/components/pagination'
 import pageye from '@/components/pagination/pageye'
+import ButtonBar from '@/components/ButtonBar'
+import { getStorage } from '@/utils/auth'
 
 export default {
   name: 'kehuzhangdanmingxi',
   components: {
     Pagination,
-    pageye
+    pageye,
+    ButtonBar
   },
   data() {
     return {
       isSearchShow: false,
+      btndisabled: false,
+      btnList: [
+        {
+          type: 'info',
+          size: 'small',
+          icon: 'cross',
+          btnKey: 'doClose',
+          btnLabel: '关闭'
+        }
+      ],
       searchxianshitit: '隐藏查询条件',
       tableKey: 0,
       list: [],
-      paymentType_list: [],
       listLoading: false,
       listQuery: {
         current: 1,
@@ -137,7 +140,8 @@ export default {
           receivablesName: '',
           createStartTime: '',
           createEndTime: '',
-          createBySid: window.sessionStorage.getItem('staffSid')
+          createBySid: '',
+          orgPath: ''
         },
         total: 0
       }
@@ -145,16 +149,11 @@ export default {
   },
   created() {
     this.getList()
-    this.DataDictionary()
+  },
+  mounted() {
+    this.$refs['btnbar'].setButtonList(this.btnList)
   },
   methods: {
-    DataDictionary() {
-      dataDictionary({ type: 'spaymentType' }).then((res) => {
-        if (res.code === '200') {
-          this.paymentType_list = res.data
-        }
-      })
-    },
     // 搜索条件效果
     clicksearchShow() {
       this.isSearchShow = !this.isSearchShow
@@ -164,6 +163,16 @@ export default {
         this.searchxianshitit = '显示查询条件'
       }
     },
+    btnHandle(btnKey) {
+      console.log('XXXXXXXXXXXXXXX    ' + btnKey)
+      switch (btnKey) {
+        case 'doClose':
+          this.doClose()
+          break
+        default:
+          break
+      }
+    },
     // ----------功能打开结束--------
     // 序号
     indexMethod(index) {
@@ -174,16 +183,22 @@ export default {
     // 查询列表信息
     getList() {
       this.listLoading = true
+      this.listQuery.params.orgPath = window.sessionStorage.getItem('defaultOrgPath')
+      this.listQuery.params.createBySid = window.sessionStorage.getItem('staffSid')
       customerBillDetailedListPage(this.listQuery).then((response) => {
         this.listLoading = false
-        if (response.code === '200') {
+        if (response.success) {
           this.listQuery.total = response.data.total
           this.list = response.data.records
+        } else {
+          this.listQuery.total = 0
+          this.list = []
         }
       })
     },
     // 查询按钮
     handleFilter() {
+      this.listQuery.current = 1
       this.getList()
     },
     handReset() {
@@ -197,31 +212,46 @@ export default {
           receivablesName: '',
           createStartTime: '',
           createEndTime: '',
-          createBySid: window.sessionStorage.getItem('staffSid')
+          createBySid: '',
+          orgPath: ''
         },
         total: 0
       }
       this.getList()
+    },
+    handleDownLoad(row) {
+      createPdfByCustomer({ detailedSid: row.sid, createBySid: window.sessionStorage.getItem('userSid') }).then((resp) => {
+        if (resp.success && resp.data !== null) {
+          var xhr = new XMLHttpRequest()
+          xhr.open('GET', process.env.VUE_APP_BASE_API + '/base/file/download?filePath=' + resp.data + '&outFileName=' + '收款单', true)
+          xhr.setRequestHeader('token', getStorage())
+          xhr.responseType = 'blob'
+          xhr.onload = function (e) {
+            // 如果请求执行成功
+            var blob = this.response
+            var filename = '账单明细.pdf'
+            var a = document.createElement('a')
+            // blob.type="application/octet-stream";
+            // 创键临时url对象
+            var url = URL.createObjectURL(blob)
+            a.href = url
+            a.download = filename
+            a.click()
+            // 释放之前创建的URL对象
+            window.URL.revokeObjectURL(url)
+          }
+          // 发送请求
+          xhr.send()
+        }
+      }).catch(() => {
+      })
+    },
+    doClose() {
+      this.$store.dispatch('tagsView/delView', this.$route)
+      this.$router.go(-1)
     }
   }
 }
 </script>
 <style scoped>
-.listtop {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  border: 1px solid #dfe4ed;
-  height: 40px;
-}
-.tit {
-  margin-bottom: -10px;
-}
-.pagination {
-  margin-bottom: -10px;
-}
-.line {
-  display: inline-block;
-  margin: 0px 15px;
-}
 </style>