From f20a554bdb24e9dfde9dc6a69d78595944f61d15 Mon Sep 17 00:00:00 2001
From: mark <mark18340872469@163.com>
Date: 星期二, 25 十月 2022 14:53:57 +0800
Subject: [PATCH] 设备管理 样式调整
---
src/views/personalCenter/components/OrderMng.vue | 314 ++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 228 insertions(+), 86 deletions(-)
diff --git a/src/views/personalCenter/components/OrderMng.vue b/src/views/personalCenter/components/OrderMng.vue
index 9e9f084..32c145a 100644
--- a/src/views/personalCenter/components/OrderMng.vue
+++ b/src/views/personalCenter/components/OrderMng.vue
@@ -5,7 +5,11 @@
<div class="left">
<div class="id">
璁㈠崟缂栧彿/浜у搧鍚嶇О
- <el-input v-model="inputText" placeholder="璇疯緭鍏�"></el-input>
+ <el-input
+ style="width: 140px"
+ v-model="inputText"
+ placeholder="璇疯緭鍏�"
+ ></el-input>
</div>
<div class="cluster">
@@ -18,7 +22,25 @@
start-placeholder="寮�濮嬫棩鏈�"
end-placeholder="缁撴潫鏃ユ湡"
:default-time="['00:00:00', '23:59:59']"
+ style="width: 212px"
></el-date-picker>
+ </div>
+
+ <div class="id">
+ 鐘舵��
+ <el-select
+ class="selectStatus"
+ v-model="status"
+ @change="searchingBtn"
+ >
+ <el-option label="鍏ㄩ儴" :value="-10"></el-option>
+ <el-option label="宸插彇娑�" :value="-1"></el-option>
+ <el-option label="鏈笅鍗�" :value="0"></el-option>
+ <el-option label="寰呮敮浠�" :value="1"></el-option>
+ <el-option label="宸叉敮浠�" :value="2"></el-option>
+ <el-option label="瀹℃牳涓�" :value="11"></el-option>
+ <el-option label="宸查┏鍥�" :value="12"></el-option>
+ </el-select>
</div>
</div>
@@ -26,7 +48,7 @@
<div class="button searchBtn" @click="searchingBtn">鎼滅储</div>
<div class="button resetBtn" @click="clearSearch">閲嶇疆</div>
</div>
- <div class="to-excel">
+ <div class="to-excel" @click="exportList">
<span class="iconfont"></span> <span>瀵煎嚭</span>
</div>
</div>
@@ -60,20 +82,46 @@
prop="createTime"
label="鍒涘缓鏃堕棿"
show-overflow-tooltip
+ sortable
+ width="180"
></el-table-column>
- <el-table-column prop="orderMoney" label="璁㈠崟閲戦"></el-table-column>
+ <el-table-column
+ prop="orderMoney"
+ label="璁㈠崟閲戦(鍏�)"
+ sortable
+ width="140"
+ ></el-table-column>
<el-table-column label="鏀粯鏂瑰紡">
<template slot-scope="scope">
- <div v-if="scope.row.payMethod == 0">绾夸笅姹囨</div>
- <div v-if="scope.row.payMethod == 1">鏀粯瀹�</div>
- <div v-if="scope.row.payMethod == 2">寰俊</div>
+ <div v-if="scope.row.payMethod == 0">灏氭湭鏀粯</div>
+ <div v-if="scope.row.payMethod == 1">绾夸笅姹囨</div>
+ <div v-if="scope.row.payMethod == 2">鏀粯瀹�</div>
+ <div v-if="scope.row.payMethod == 3">寰俊</div>
+ <div v-if="scope.row.payMethod == 4">鏀粯瀹漺ap绔�</div>
+ <div v-if="scope.row.payMethod == 5">0鍏冩敮浠�</div>
</template>
</el-table-column>
- <el-table-column prop="status" label="璁㈠崟鐘舵��"></el-table-column>
+ <el-table-column
+ prop="status"
+ label="璁㈠崟鐘舵��"
+ sortable
+ ></el-table-column>
- <el-table-column label="鎿嶄綔">
+ <el-table-column label="鎿嶄綔" width="140">
<template slot-scope="scope">
- <span class="option" @click="showDetail(scope.row)">璁㈠崟璇︽儏</span>
+ <span class="option" @click="showDetail(scope.row)">璇︽儏</span>
+ <span
+ class="option"
+ v-if="scope.row.status === '寰呮敮浠�'"
+ @click="showPayBox(scope.row.id)"
+ >鏀粯</span
+ >
+ <span
+ class="option"
+ v-if="scope.row.status === '寰呮敮浠�'"
+ @click="cancel(scope.row.id)"
+ >鍙栨秷</span
+ >
</template>
</el-table-column>
</el-table>
@@ -90,6 +138,12 @@
></el-pagination>
</div>
</div>
+
+ <ConfirmOrder
+ v-if="showOrder"
+ :orderId="orderId"
+ @close="closeBox"
+ ></ConfirmOrder>
</div>
<div class="order-detail" v-else>
@@ -213,9 +267,12 @@
>
<el-table-column prop="payMethod" label="鏀粯娓犻亾" min-width="80">
<template slot-scope="scope">
+ <div v-if="scope.row.payMethod == 0">灏氭湭鏀粯</div>
<div v-if="scope.row.payMethod == 1">绾夸笅姹囨</div>
<div v-if="scope.row.payMethod == 2">鏀粯瀹�</div>
<div v-if="scope.row.payMethod == 3">寰俊</div>
+ <div v-if="scope.row.payMethod == 4">鏀粯瀹漺ap绔�</div>
+ <div v-if="scope.row.payMethod == 5">0鍏冩敮浠�</div>
</template>
</el-table-column>
<!-- <el-table-column prop="payTime" label="浠樻鏃堕棿" align="center" min-width="150" ></el-table-column> -->
@@ -237,20 +294,25 @@
</template>
<script>
-import { getOrders } from "@/api/order";
+import { getOrders, getAuthFile, cancelOrder } from "@/api/order";
import { getOrderById } from "@/api/product";
+import ConfirmOrder from "@/views/productDetail/components/ConfirmOrder";
export default {
- components: {},
+ components: {
+ ConfirmOrder,
+ },
created() {
+ let type = sessionStorage.getItem("type");
+ if (type) {
+ this.status = +type;
+ sessionStorage.removeItem("type");
+ }
this.searchingBtn();
},
data() {
return {
- searchTime: [
- this.$moment().format("YYYY-MM-DD 00:00:00"),
- this.$moment().format("YYYY-MM-DD HH:mm:ss"),
- ], //鎼滅储鏃堕棿
+ searchTime: [], //鎼滅储鏃堕棿
page: 1,
size: 10, //鍒嗛〉鐩稿叧
inputText: "", //杈撳叆妗嗗唴瀹�
@@ -277,6 +339,9 @@
form: {}, //澶勭悊涓殑璁惧
isShowDetail: false,
showTable: false,
+ orderId: "",
+ showOrder: false,
+ status: -10,
};
},
methods: {
@@ -285,82 +350,86 @@
let param = {
page: this.page,
size: this.size,
- startTime: this.searchTime[0],
- endTime: this.searchTime[1],
+ startTime: this.searchTime ? this.searchTime[0] : "",
+ endTime: this.searchTime ? this.searchTime[1] : "",
inputText: this.inputText,
productBaseId: "0",
orderName: "",
orderType: "",
- status: 0,
+ status: this.status,
};
- getOrders(param).then((res) => {
- this.dataList = res.data.list.map((item, indez) => {
- let status = "";
- switch (item.orderStatus) {
- case -1:
- status = "宸插彇娑�";
- break;
- case 0:
- status = "鏈笅鍗�";
- break;
- case 1:
- status = "寰呮敮浠�";
- break;
- case 2:
- status = "宸叉敮浠�";
- break;
- case 11:
- status = "瀹℃牳涓�";
- break;
- case 12:
- status = "宸查┏鍥�";
- break;
- default:
- status = "";
- }
- let name = "";
- let downFlag = false;
- let products = [];
- item.products.forEach((every, index) => {
- // 鍒ゆ柇鏈鍗曟槸鍚﹀瓨鍦ㄥ彲涓嬭浇鐨勫唴瀹癸紙杞欢锛宻dk锛�
- if (every.productType == 1 || every.productType == 3) {
- downFlag = true;
+ getOrders(param)
+ .then((res) => {
+ this.dataList = res.data.list.map((item, indez) => {
+ let status = "";
+ switch (item.orderStatus) {
+ case -1:
+ status = "宸插彇娑�";
+ break;
+ case 0:
+ status = "鏈笅鍗�";
+ break;
+ case 1:
+ status = "寰呮敮浠�";
+ break;
+ case 2:
+ status = "宸叉敮浠�";
+ break;
+ case 11:
+ status = "瀹℃牳涓�";
+ break;
+ case 12:
+ status = "宸查┏鍥�";
+ break;
+ default:
+ status = "";
}
- // 褰掔被浜у搧鍜屾縺娲荤爜浠ヤ緵涓嬭浇
- products.push({
- productId: every.productId,
- productName: every.productName,
- activateCode: every.activateCode,
- productTypeName: every.productTypeName,
+ let name = "";
+ let downFlag = false;
+ let products = [];
+ item.products.forEach((every, index) => {
+ // 鍒ゆ柇鏈鍗曟槸鍚﹀瓨鍦ㄥ彲涓嬭浇鐨勫唴瀹癸紙杞欢锛宻dk锛�
+ if (every.productType == 1 || every.productType == 3) {
+ downFlag = true;
+ }
+ // 褰掔被浜у搧鍜屾縺娲荤爜浠ヤ緵涓嬭浇
+ products.push({
+ productId: every.productId,
+ productName: every.productName,
+ activateCode: every.activateCode,
+ productTypeName: every.productTypeName,
+ });
+ if (index == 0) {
+ name += every.productName + "(" + every.productTypeName + ")";
+ } else {
+ name +=
+ " / " + every.productName + "(" + every.productTypeName + ")";
+ }
});
- if (index == 0) {
- name += every.productName + "(" + every.productTypeName + ")";
- } else {
- name +=
- " / " + every.productName + "(" + every.productTypeName + ")";
- }
+ return {
+ id: item.id,
+ sn: item.sn,
+ name: name,
+ source: item.source == 0 ? "婵�娲荤爜涓嬭浇" : "绾夸笂璐拱",
+ createTime: item.createTime,
+ status: status,
+ orderStatus: item.orderStatus,
+ orderMoney: item.orderMoney,
+ payMethod: item.payMethod,
+ code:
+ item.products.length > 1 ? "-" : item.products[0].activateCode,
+ canDownLoad: downFlag,
+ products: products,
+ };
});
- return {
- id: item.id,
- sn: item.sn,
- name: name,
- source: item.source == 0 ? "婵�娲荤爜涓嬭浇" : "绾夸笂璐拱",
- createTime: item.createTime,
- status: status,
- orderStatus: item.orderStatus,
- orderMoney: item.orderMoney,
- payMethod: item.payMethod,
- code:
- item.products.length > 1 ? "-" : item.products[0].activateCode,
- canDownLoad: downFlag,
- products: products,
- };
+ this.total = res.data.total;
+ if (res.data.total <= this.size) {
+ this.page = 1;
+ }
+ })
+ .catch((err) => {
+ this.$notify.error(err.msg);
});
- this.total = res.data.total;
- if (res.data.total <= this.size) {
- this.page = 1;
- }
- });
},
//鍒嗛〉鍔熻兘
handleSizeChange(size) {
@@ -392,7 +461,9 @@
},
clearSearch() {
- this.searchTime = this.getDateInit();
+ debugger;
+ this.searchTime = [];
+ debugger;
this.inputText = "";
this.searchingBtn();
},
@@ -503,7 +574,71 @@
},
openImg(url) {
- window.open("http://" + url);
+ window.open("/httpImage/" + url);
+ },
+
+ async exportList() {
+ let param = {
+ page: this.page,
+ size: this.size,
+ startTime: this.searchTime ? this.searchTime[0] : "",
+ endTime: this.searchTime ? this.searchTime[1] : "",
+ inputText: this.inputText,
+ productBaseId: "0",
+ orderName: "",
+ orderType: "",
+ status: 0,
+ };
+
+ const result = await getAuthFile(param);
+
+ console.log(result);
+
+ var blob = new Blob([result.body.data], {
+ type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8",
+ }),
+ Temp = document.createElement("a");
+
+ Temp.href = window.URL.createObjectURL(blob);
+
+ console.log(result);
+ console.log(result.fileName);
+
+ Temp.download = window.decodeURI(result.fileName);
+
+ Temp.setAttribute("download", result.fileName);
+
+ document.body.appendChild(Temp);
+
+ Temp.click();
+
+ document.body.removeChild(Temp);
+
+ window.URL.revokeObjectURL(Temp);
+ },
+
+ showPayBox(id) {
+ this.showOrder = true;
+ this.orderId = id;
+ },
+
+ cancel(id) {
+ cancelOrder("/saas/api-s/saasOrder/cancel/" + id).then((res) => {
+ if (res && res.success) {
+ this.$notify({
+ type: "success",
+ message: "璁㈠崟鍙栨秷鎴愬姛",
+ duration: 2500,
+ offset: 57,
+ });
+ this.searchingBtn();
+ }
+ });
+ },
+
+ closeBox() {
+ this.showOrder = false;
+ this.searchingBtn();
},
},
mounted() {},
@@ -540,7 +675,7 @@
color: #fff;
background: #0065ff;
border-radius: 3px;
- margin-right: 20px;
+ margin-right: 10px;
}
.right {
display: flex;
@@ -556,7 +691,8 @@
color: #fff;
align-items: center;
justify-content: center;
- margin-left: 195px;
+ margin-left: 20px;
+ cursor: pointer;
}
.resetBtn {
width: 60px;
@@ -616,6 +752,12 @@
}
}
+ .selectStatus {
+ margin: 0 10px;
+ margin-right: 30px;
+ width: 100px;
+ }
+
.el-input ::v-deep {
width: 200px;
margin-left: 10px;
--
Gitblit v1.8.0