132 lines
		
	
	
		
			3.0 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			132 lines
		
	
	
		
			3.0 KiB
		
	
	
	
		
			Vue
		
	
	
	
| 
 | |
| <template>
 | |
|   <view class="contain">
 | |
|     <view class="kuang">
 | |
| 
 | |
|       <view class="kuang_i tit2">
 | |
|         <view>{{ '会员姓名' }}</view>
 | |
|         <view>{{ '联系方式' }}</view>
 | |
|       </view>
 | |
|       <view v-for="item,index in tableData"
 | |
|             :class="[index%2?'kuang_ii':'kuang_i']">
 | |
|         <view>{{ item.memberName }}</view>
 | |
|         <view>{{ item.phone }}</view>
 | |
|       </view>
 | |
| 
 | |
|     </view>
 | |
|     <u-button class="export"
 | |
|               @click="handleExport"
 | |
|               type="warning"
 | |
|               text="导出"></u-button>
 | |
|   </view>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| import * as api from '@/config/regiest'
 | |
| import { saveAs } from 'file-saver'
 | |
| import { getToken, removeToken } from '@/config/auth.js'
 | |
| 
 | |
| export default {
 | |
|   data() {
 | |
|     return {
 | |
|       tableData: [],
 | |
|       queryParams: {
 | |
|         pageNum: 1,
 | |
|         pageSize: 50,
 | |
|       },
 | |
|       total: 0,
 | |
|       recName: '',
 | |
|       recPhone: '',
 | |
|     }
 | |
|   },
 | |
|   onLoad(options) {
 | |
|     this.recName = options.recName
 | |
|     this.recPhone = options.recPhone
 | |
|     this.getDataList()
 | |
|   },
 | |
|   onReachBottom() {
 | |
|     this.queryParams.pageNum++
 | |
|     this.getDataList()
 | |
|   },
 | |
|   methods: {
 | |
|     getDataList() {
 | |
|       api
 | |
|         .specialList(
 | |
|           Object.assign(
 | |
|             {
 | |
|               recName: this.recName,
 | |
|               recPhone: this.recPhone,
 | |
|             },
 | |
|             this.queryParams
 | |
|           )
 | |
|         )
 | |
|         .then((res) => {
 | |
|           if (res.code == 200) {
 | |
|             this.tableData = this.tableData.concat(res.rows)
 | |
|             this.total = res.total
 | |
|           }
 | |
|         })
 | |
|     },
 | |
|     /** 导出按钮操作 */
 | |
|     handleExport() {
 | |
|       uni.request({
 | |
|         url:
 | |
|           uni.$u.http.config.baseURL +
 | |
|           '/member/api/member-special/special-export',
 | |
|         responseType: 'arraybuffer',//接收格式
 | |
|         method: 'POST',
 | |
|         data: {
 | |
|           recName: this.recName,
 | |
|           recPhone: this.recPhone,
 | |
|         },
 | |
|         header: {
 | |
|           'Content-Type': 'application/x-www-form-urlencoded',
 | |
|           Authorization: getToken(),
 | |
|         },
 | |
|         success: async (data) => {
 | |
|           const blob = new Blob([data.data])
 | |
|           let a = document.createElement('a')
 | |
|           let href = window.URL.createObjectURL(blob) //创建下载的链接
 | |
|           a.href = href
 | |
|           a.download = `${'会员信息'}${new Date().getTime()}.xlsx` //下载后文件名
 | |
|           document.body.appendChild(a)
 | |
|           a.click() //点击下载
 | |
|           document.body.removeChild(a) //下载完成移除元素
 | |
|           window.URL.revokeObjectURL(href) //释放掉blob对象
 | |
|         },
 | |
|       })
 | |
|     },
 | |
|   },
 | |
| }
 | |
| </script>
 | |
| 
 | |
| <style lang="scss" scoped>
 | |
| .contain {
 | |
|   background: #fff;
 | |
| }
 | |
| .tit2 {
 | |
|   background: #eee;
 | |
|   padding: 10rpx 20rpx;
 | |
| }
 | |
| .kuang {
 | |
|   padding: 20rpx 40rpx 120rpx 40rpx;
 | |
| }
 | |
| .kuang_i {
 | |
|   display: flex;
 | |
|   align-items: center;
 | |
|   justify-content: space-between;
 | |
|   padding: 6rpx 20rpx;
 | |
| }
 | |
| .kuang_ii {
 | |
|   display: flex;
 | |
|   align-items: center;
 | |
|   justify-content: space-between;
 | |
|   padding: 6rpx 20rpx;
 | |
|   background: #eee;
 | |
| }
 | |
| .export {
 | |
|   // width: 25%;
 | |
|   position: fixed;
 | |
|   bottom: 0%;
 | |
| }
 | |
| </style> |