|
|
@@ -0,0 +1,200 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="90px" >
|
|
|
+ <el-form-item label="商品名称" prop="title">
|
|
|
+ <el-input v-model="queryParams.title" placeholder="请输入商品名称" clearable size="small" style="width: 240px" @clear="queryParams.pageNum = 1;handleQuery()" @keyup.enter.native="handleQuery" />
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="用户手机号" prop="userPhone">
|
|
|
+ <el-input v-model="queryParams.userPhone" placeholder="请输入用户手机号" clearable size="small" style="width: 240px" @clear="queryParams.pageNum = 1;handleQuery()" @keyup.enter.native="handleQuery" />
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="下单时间">
|
|
|
+ <el-date-picker @clear="queryParams.pageNum = 1;handleQuery()" v-model="tradeTimeArr" type="datetimerange" size="small" value-format="timestamp" range-separator="至" start-placeholder="时间选择" end-placeholder="时间选择" @change="tardeTime">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery" >搜索</el-button >
|
|
|
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery" >重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <!-- 导出、刷新 -->
|
|
|
+ <el-row :gutter="10" class="mb8">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="infor"
|
|
|
+ plain
|
|
|
+ icon="el-icon-download"
|
|
|
+ size="small"
|
|
|
+ @click="handleExportDraw"
|
|
|
+ v-hasPermi="['order:exchange:export']"
|
|
|
+ >导出订单</el-button
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <right-toolbar
|
|
|
+ :showSearch.sync="showSearch"
|
|
|
+ @queryTable="getList"
|
|
|
+ ></right-toolbar>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <!-- 列表 -->
|
|
|
+ <el-table ref="table" v-loading="loading" :data="list">
|
|
|
+ <el-table-column label="回收时间" min-width="100" align="center">
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>{{ parseTime(row.createdTime) }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="商品主图" prop="picUrl" min-width="95" align="center">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <div v-if="row.picUrl">
|
|
|
+ <el-image
|
|
|
+ style="width: 100px; height: 100px"
|
|
|
+ :src="IMG_URL + row.picUrl.split(',')[0]"
|
|
|
+ :preview-src-list="row.picUrl.split(',').map(item => { return IMG_URL + item })"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <span v-else>-</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>>
|
|
|
+ <el-table-column label="商品名称" prop="title" min-width="95" align="center" />
|
|
|
+ <el-table-column label="商品规格" prop="properties" min-width="95" align="center" >
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <div v-if="row.sku">{{row.sku}}</div>
|
|
|
+ <div v-else>--</div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="单价(盲豆)" prop="exchangePrice" min-width="95" align="center"/>
|
|
|
+ <el-table-column label="回收数量" prop="num" min-width="60" align="num" />
|
|
|
+ <el-table-column label="回收折扣(%)" prop="discountRate" min-width="95" align="center"/>
|
|
|
+ <el-table-column label="返还盲豆数" prop="returnCoin" min-width="95" align="center"/>
|
|
|
+ <el-table-column label="用户昵称/手机号" min-width="120" align="center">
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>{{ row.nickName }}/{{ row.userPhone }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <!-- 分页 -->
|
|
|
+ <pagination
|
|
|
+ v-show="total > 0"
|
|
|
+ :total="total"
|
|
|
+ :page.sync="pageParams.pageNum"
|
|
|
+ :limit.sync="pageParams.pageSize"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { publicFileGetUrl } from "@/api/common"
|
|
|
+import { getRecoveryList, exchangeRecoveryExport } from "@/api/business/recovery";
|
|
|
+export default {
|
|
|
+ name: "exchange",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ IMG_URL: publicFileGetUrl,
|
|
|
+ loading: false,
|
|
|
+ showSearch: true,
|
|
|
+ // 筛选
|
|
|
+ queryParams: {
|
|
|
+ endTime: "",
|
|
|
+ startTime: "",
|
|
|
+ title: "",
|
|
|
+ userPhone: ""
|
|
|
+ },
|
|
|
+ // 分页
|
|
|
+ pageParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ },
|
|
|
+ // 总条数
|
|
|
+ total: 0,
|
|
|
+ list: [],
|
|
|
+ // 下单时间
|
|
|
+ tradeTimeArr: [],
|
|
|
+ // 订单列表状态
|
|
|
+ state: "null",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 订单列表
|
|
|
+ getList() {
|
|
|
+ this.loading = true;
|
|
|
+ getRecoveryList( "pageNum=" + this.pageParams.pageNum + "&pageSize=" + this.pageParams.pageSize + "&",this.queryParams)
|
|
|
+ .then((res) => {
|
|
|
+ this.loading = false;
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.total = res.total;
|
|
|
+ this.list = res.rows;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ //搜索
|
|
|
+ handleQuery() {
|
|
|
+ this.pageParams.pageNum = 1;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+
|
|
|
+ // 重置
|
|
|
+ resetQuery() {
|
|
|
+ this.resetForm("queryForm");
|
|
|
+ this.tradeTimeArr = [];
|
|
|
+ this.pageParams.pageNum = 1;
|
|
|
+ this.queryParams.startTime = "";
|
|
|
+ this.queryParams.endTime = "";
|
|
|
+
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+
|
|
|
+ // 选择下单时间
|
|
|
+ tardeTime(e) {
|
|
|
+ if (e) {
|
|
|
+ this.queryParams.startTime = e[0];
|
|
|
+ this.queryParams.endTime = e[1];
|
|
|
+ this.handleQuery();
|
|
|
+ } else {
|
|
|
+ this.queryParams.startTime = "";
|
|
|
+ this.queryParams.endTime = "";
|
|
|
+ this.handleQuery();
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 导出订单
|
|
|
+ handleExportDraw() {
|
|
|
+ this.$confirm("是否确认导出订单?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.vloading = this.$loading({
|
|
|
+ lock: true,
|
|
|
+ text: "正在导出订单.....",
|
|
|
+ background: "rgba(0, 0, 0, 0.7)",
|
|
|
+ });
|
|
|
+ return exchangeRecoveryExport(this.queryParams);
|
|
|
+ })
|
|
|
+ .then((response) => {
|
|
|
+ this.vloading.close();
|
|
|
+ this.download(response.msg);
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.vloading.close();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+::v-deep .el-tabs--border-card > .el-tabs__content {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+</style>
|
