|
|
@@ -0,0 +1,456 @@
|
|
|
+<template>
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClick">
|
|
|
+ <el-tab-pane label="入账管理" name="first">
|
|
|
+ <div style="display: inline-block;">
|
|
|
+ <div style="position: relative;display: inline-block;margin: 3px;">
|
|
|
+ <span>商铺名称:</span>
|
|
|
+ <el-input
|
|
|
+ style="width: 200px;"
|
|
|
+ @keydown.enter.native="phoneSelect"
|
|
|
+ placeholder="请输入商铺名称"
|
|
|
+ v-model="shopName"
|
|
|
+ >
|
|
|
+ </el-input
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="position: relative;display: inline-block;margin: 3px;">
|
|
|
+ <span>商铺手机号:</span>
|
|
|
+ <el-input
|
|
|
+ style="width: 200px;"
|
|
|
+ @keydown.enter.native="phoneSelect"
|
|
|
+ placeholder="请输入商铺手机号"
|
|
|
+ v-model="shopPhone"
|
|
|
+ >
|
|
|
+ </el-input
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="position: relative;display: inline-block;margin: 3px;">
|
|
|
+ <span>用户手机号:</span>
|
|
|
+ <el-input
|
|
|
+ style="width: 200px;"
|
|
|
+ @keydown.enter.native="phoneSelect"
|
|
|
+ placeholder="请输入用户手机号"
|
|
|
+ v-model="userPhone"
|
|
|
+ >
|
|
|
+ </el-input
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="position: relative;display: inline-block;margin: 3px;">
|
|
|
+ <span>优惠活动:</span>
|
|
|
+ <el-input
|
|
|
+ style="width: 200px;"
|
|
|
+ @keydown.enter.native="phoneSelect"
|
|
|
+ placeholder="请输入优惠活动标题"
|
|
|
+ v-model="activityTitle"
|
|
|
+ >
|
|
|
+ </el-input
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="position: relative;display: inline-block;margin: 3px;">
|
|
|
+ <span>订单号:</span>
|
|
|
+ <el-input
|
|
|
+ style="width: 200px;"
|
|
|
+ @keydown.enter.native="phoneSelect"
|
|
|
+ placeholder="请输入订单号"
|
|
|
+ v-model="orderNumber"
|
|
|
+ ></el-input
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="margin:5px;display: inline-block;">
|
|
|
+ <span>开始时间:</span>
|
|
|
+ <el-date-picker
|
|
|
+ style="width: 220px;margin-left: 10px;"
|
|
|
+ v-model="startTime"
|
|
|
+ align="right"
|
|
|
+ type="datetime"
|
|
|
+ format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ placeholder="选择开始时间"
|
|
|
+ >
|
|
|
+ </el-date-picker
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="margin:5px;display: inline-block;">
|
|
|
+ <span>截止时间:</span>
|
|
|
+ <el-date-picker
|
|
|
+ style="width: 220px;margin-left: 10px;"
|
|
|
+ v-model="endTime"
|
|
|
+ align="right"
|
|
|
+ type="datetime"
|
|
|
+ format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ placeholder="选择截止时间"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
+ <el-button
|
|
|
+ style="margin-left:15px;"
|
|
|
+ size="mini"
|
|
|
+ type="primary"
|
|
|
+ icon="document"
|
|
|
+ @click="phoneSelect"
|
|
|
+ >查询
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ style="margin-left:15px;"
|
|
|
+ size="mini"
|
|
|
+ type="primary"
|
|
|
+ icon="document"
|
|
|
+ @click="cleans"
|
|
|
+ >重置</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ style="margin-left:15px;"
|
|
|
+ size="mini"
|
|
|
+ type="warning"
|
|
|
+ icon="document"
|
|
|
+ @click="exportList"
|
|
|
+ >
|
|
|
+ 导出Excel
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ style="margin-left:15px;"
|
|
|
+ size="mini"
|
|
|
+ type="primary"
|
|
|
+ icon="document"
|
|
|
+ @click="abnormity"
|
|
|
+ >查询异常订单</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="color: orange;">
|
|
|
+ *
|
|
|
+ 导出订单提示:导出订单前请进行时间或者状态等筛选,否则导出订单量过多易出现卡顿或系统崩溃
|
|
|
+ </div>
|
|
|
+ <el-table v-loading="tableDataLoading" :data="tableData">
|
|
|
+ <el-table-column
|
|
|
+ fixed
|
|
|
+ prop="id"
|
|
|
+ label="编号"
|
|
|
+ width="80"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ fixed
|
|
|
+ prop="shopName"
|
|
|
+ label="店铺"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ fixed
|
|
|
+ prop="shopPhone"
|
|
|
+ label="店铺手机号"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column fixed prop="userName" label="下单用户">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="userPhone" label="手机号"></el-table-column>
|
|
|
+ <el-table-column prop="title" label="标题" width="200">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="couponName"
|
|
|
+ label="优惠活动标题"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="activityDiscountAmount"
|
|
|
+ label="活动优惠金额"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="couponMoney"
|
|
|
+ label="优惠券优惠金额"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="errandMoney"
|
|
|
+ label="跑腿费"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span @click="errandMoneyClick(scope.row)" style="cursor: pointer;color: #3e8ef7;">{{
|
|
|
+ scope.row.errandMoney
|
|
|
+ }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="orderNumber" label="订单号" width="180">
|
|
|
+ <!-- <template slot-scope="scope">
|
|
|
+ <span style="cursor: pointer;"">{{
|
|
|
+ scope.row.orderNumber
|
|
|
+ }}</span>
|
|
|
+ </template> -->
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="money" label="金额" width="100">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="createTime" label="创建时间"></el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div style="text-align: center;margin-top: 10px;">
|
|
|
+ <el-pagination
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :page-sizes="[10, 20, 30, 40]"
|
|
|
+ :page-size="limit"
|
|
|
+ :current-page="page"
|
|
|
+ layout="total,sizes, prev, pager, next"
|
|
|
+ :total="totalCount"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ <!-- 导出限制 -->
|
|
|
+ <el-dialog
|
|
|
+ custom-class="export"
|
|
|
+ :visible.sync="exportVisible"
|
|
|
+ center
|
|
|
+ :title="exportTitle"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <div class="con" v-show="exportFlag == 1">
|
|
|
+ <img src="../../assets/img/error.png" alt="" />
|
|
|
+ <span
|
|
|
+ style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
|
|
|
+ >当前导出条数超过50000条,暂不支持导出</span
|
|
|
+ >
|
|
|
+ <span style="font-size:14px;color: #808080;"
|
|
|
+ >(注:数据中的图片、附件只能以链接的形式导出)</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="con" v-show="exportFlag == 2">
|
|
|
+ <img class="gundong" src="../../assets/img/loading.png" alt="" />
|
|
|
+ <span
|
|
|
+ style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
|
|
|
+ >导出中...</span
|
|
|
+ >
|
|
|
+ <span style="font-size:14px;color: #808080;"
|
|
|
+ >(注:请到个人导出记录查看并下载)</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="con" v-show="exportFlag == 3">
|
|
|
+ <img src="../../assets/img/success.png" alt="" />
|
|
|
+ <span
|
|
|
+ style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
|
|
|
+ >导出成功</span
|
|
|
+ >
|
|
|
+ <span style="font-size:14px;color: #808080;"
|
|
|
+ >(注:请到个人导出记录查看并下载)</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="con" v-show="exportFlag == 4">
|
|
|
+ <img class="gundong" src="../../assets/img/loading.png" alt="" />
|
|
|
+ <span
|
|
|
+ style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
|
|
|
+ >版本迭代中,导出暂时无法使用</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="btn">
|
|
|
+ <el-button type="primary" @click="exportAffirm">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 点击跑腿费显示内容 -->
|
|
|
+ <el-dialog
|
|
|
+ custom-class="errandMoney"
|
|
|
+ :visible.sync="errandMoneyVisible"
|
|
|
+ center
|
|
|
+ title="内容"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <span style="font-size: 15px;">{{ content }}</span>
|
|
|
+ </el-dialog>
|
|
|
+ </el-tabs>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ activeName:"first",
|
|
|
+ shopName: "", //商铺名称
|
|
|
+ shopPhone: "", //商铺手机号
|
|
|
+ userPhone: "", //用户手机号
|
|
|
+ activityTitle: "", //优惠活动
|
|
|
+ orderNumber: "", //订单号
|
|
|
+ startTime: "", //开始时间:
|
|
|
+ endTime: "", //截止时间:
|
|
|
+
|
|
|
+ limit: 10,
|
|
|
+ page: 1,
|
|
|
+ tableDataLoading:false,
|
|
|
+ tableData:[],
|
|
|
+ totalCount:10,
|
|
|
+
|
|
|
+ exportVisible: false,
|
|
|
+ exportTitle:"",
|
|
|
+ exportFlag:"",
|
|
|
+
|
|
|
+ errandMoneyVisible:false,
|
|
|
+ content:'',
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 获取数据列表
|
|
|
+ getList() {
|
|
|
+ this.tableDataLoading = true;
|
|
|
+ this.$http({
|
|
|
+ url: this.$http.adornUrl("shop/shopmoney/accountEntryManagement"),
|
|
|
+ method: "get",
|
|
|
+ params: this.$http.adornParams({
|
|
|
+ page: this.page,
|
|
|
+ limit: this.limit,
|
|
|
+ shopName: this.shopName,
|
|
|
+ shopPhone: this.shopPhone,
|
|
|
+ userPhone: this.userPhone,
|
|
|
+ couponName: this.activityTitle,
|
|
|
+ orderNumber: this.orderNumber,
|
|
|
+ startTime: this.startTime,
|
|
|
+ endTime: this.endTime
|
|
|
+ })
|
|
|
+ }).then(({ data }) => {
|
|
|
+ console.log(data,'入账管理');
|
|
|
+ if (data.code == 0) {
|
|
|
+ this.tableDataLoading = false;
|
|
|
+ this.tableData = data.data.list;
|
|
|
+ this.totalCount=data.data.totalCount
|
|
|
+
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: data.msg,
|
|
|
+ type: "warning",
|
|
|
+ duration: 1500,
|
|
|
+ onClose: () => {}
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ phoneSelect(){
|
|
|
+ this.page = 1;
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ cleans(){
|
|
|
+ this.shopName= "" //商铺名称
|
|
|
+ this.shopPhone= "" //商铺手机号
|
|
|
+ this.userPhone= "" //用户手机号
|
|
|
+ this.activityTitle= "" //优惠活动
|
|
|
+ this.orderNumber= "" //订单号
|
|
|
+ this.startTime= "" //开始时间:
|
|
|
+ this.endTime= "" //截止时间:
|
|
|
+ this.page = 1;
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ abnormity(){},
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.limit = val;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.page = val;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ // 导出
|
|
|
+ exportList() {
|
|
|
+ console.log(this.totalCount, "导出条数");
|
|
|
+ this.exportTitle = "导出";
|
|
|
+ // this.exportFlag = 4;
|
|
|
+ this.exportVisible = true;
|
|
|
+ if (this.totalCount >= 50000) {
|
|
|
+ this.exportTitle = "导出错误";
|
|
|
+ this.exportFlag = 1;
|
|
|
+ } else {
|
|
|
+ this.exportTitle = "导出";
|
|
|
+ this.exportFlag = 2;
|
|
|
+ this.exportVisible = true;
|
|
|
+ var userId = this.$cookie.get("userId");
|
|
|
+ this.$http({
|
|
|
+ url: this.$http.adornUrl("admin/export/excelAccountEntry"),
|
|
|
+ method: "get",
|
|
|
+ // responseType: "blob",
|
|
|
+ params: this.$http.adornParams({
|
|
|
+ // 'page': page,
|
|
|
+ // 'size': this.size,
|
|
|
+ userId: userId,
|
|
|
+ shopName: this.shopName,
|
|
|
+ shopPhone: this.shopPhone,
|
|
|
+ userPhone: this.userPhone,
|
|
|
+ couponName: this.activityTitle,
|
|
|
+ orderNumber: this.orderNumber,
|
|
|
+ startTime: this.startTime,
|
|
|
+ endTime: this.endTime
|
|
|
+ })
|
|
|
+ }).then(({ data }) => {
|
|
|
+ console.log(data, "导出");
|
|
|
+ if (data.code == 0) {
|
|
|
+ this.exportTitle = "导出成功";
|
|
|
+ this.exportFlag = 3;
|
|
|
+ }
|
|
|
+ // let blob = new Blob([data], {
|
|
|
+ // type:
|
|
|
+ // "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
|
|
|
+ // });
|
|
|
+ // if (window.navigator.msSaveOrOpenBlob) {
|
|
|
+ // navigator.msSaveBlob(blob);
|
|
|
+ // } else {
|
|
|
+ // let url = window.URL.createObjectURL(blob);
|
|
|
+ // let elink = document.createElement("a");
|
|
|
+ // elink.download = "订单列表.xlsx";
|
|
|
+ // elink.style.display = "none";
|
|
|
+ // elink.href = url;
|
|
|
+ // document.body.appendChild(elink);
|
|
|
+ // elink.click();
|
|
|
+ // document.body.removeChild(elink);
|
|
|
+ // }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ exportAffirm() {
|
|
|
+ this.exportVisible = false;
|
|
|
+ },
|
|
|
+ // tabs切换
|
|
|
+ handleClick(tab, event) {
|
|
|
+ if (tab._props.label == "入账管理") {
|
|
|
+ this.page = 1;
|
|
|
+ this.limit = 10;
|
|
|
+ this.getList();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ errandMoneyClick(row){
|
|
|
+ console.log(row);
|
|
|
+ this.errandMoneyVisible=true;
|
|
|
+ this.content=row.content
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ mounted() {
|
|
|
+ this.getList()
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+/* 导出限制 */
|
|
|
+.el-tabs >>> .export {
|
|
|
+ width: 500px;
|
|
|
+}
|
|
|
+.el-tabs >>> .export .con {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+.el-tabs >>> .export .con .gundong {
|
|
|
+ animation: gundong 3s linear infinite;
|
|
|
+}
|
|
|
+@keyframes gundong {
|
|
|
+ /* from表示动画的开始位置,也可以使用0%来表示。 */
|
|
|
+ from {
|
|
|
+ transform: rotate(0deg);
|
|
|
+ }
|
|
|
+ /* to表示动画的结束位置,也可以使用100%来表示。 */
|
|
|
+ to {
|
|
|
+ transform: rotate(360deg);
|
|
|
+ }
|
|
|
+}
|
|
|
+.el-tabs >>> .export img {
|
|
|
+ width: 70px;
|
|
|
+}
|
|
|
+.el-tabs >>> .export .btn {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row-reverse;
|
|
|
+}
|
|
|
+
|
|
|
+.el-tabs >>> .errandMoney {
|
|
|
+ width: 450px;
|
|
|
+}
|
|
|
+</style>
|