chenkainan 4 weeks ago
parent
commit
20a4567579
  1. 3
      src/components/layout/HeaderNav.vue
  2. 16
      src/libs/utils.js
  3. 8
      src/views/Order/Index.vue
  4. 101
      src/views/Order/OrderDetail.vue
  5. 348
      src/views/User/ContractList.vue
  6. 2
      src/views/User/Index.vue
  7. 28
      src/views/User/OrderList.vue
  8. 85
      src/views/User/UserCenter.vue

3
src/components/layout/HeaderNav.vue

@ -94,10 +94,11 @@
<!-- 电话 --> <!-- 电话 -->
<div class="phone-entry"> <div class="phone-entry">
<div> <div style="display: flex;align-items: center;">
<img <img
src="https://static.ticket.sz-trip.com/shiweisuzhou/pc/login/phone.png" src="https://static.ticket.sz-trip.com/shiweisuzhou/pc/login/phone.png"
alt="联系电话" alt="联系电话"
style="margin-right: 5px;"
/> />
<span>0512-680541</span> <span>0512-680541</span>
<span class="cart-count" v-if="cartTotalCount > 0 && false">{{ <span class="cart-count" v-if="cartTotalCount > 0 && false">{{

16
src/libs/utils.js

@ -60,7 +60,7 @@ export default {
if (img.indexOf('https://') != -1 || img.indexOf('http://') != -1) { if (img.indexOf('https://') != -1 || img.indexOf('http://') != -1) {
return img; return img;
} else { } else {
return 'https://static.ticket.sz-trip.com' + img; return process.env.VUE_APP_URL + img;
} }
}, },
@ -73,6 +73,20 @@ export default {
} }
}); });
}, },
copyId(value) {
const input = document.createElement('input');
input.value = value;
document.body.appendChild(input);
input.select();
document.execCommand('copy');
document.body.removeChild(input);
Vue.prototype.$message({
message: '复制成功',
type: 'success'
});
},
} }
} }
} }

8
src/views/Order/Index.vue

@ -79,7 +79,7 @@
<el-option <el-option
v-for="(title, index) in invoiceTitles" v-for="(title, index) in invoiceTitles"
:key="index" :key="index"
:label="title.name" :label="title.invoice_head"
:value="title.id" :value="title.id"
></el-option> ></el-option>
</el-select> </el-select>
@ -364,13 +364,15 @@ export default {
...this.titleForm, ...this.titleForm,
}; };
this.post(this.titleForm).then((res) => { this.post(this.titleForm, "/api/enterprise_invoice/create").then(
(res) => {
if (res.code == 1) { if (res.code == 1) {
this.getInvoiceList(); this.getInvoiceList();
this.$message.success("发票抬头添加成功"); this.$message.success("发票抬头添加成功");
this.invoiceTitleDialogVisible = false; this.invoiceTitleDialogVisible = false;
} }
}); }
);
} }
}); });
}, },

101
src/views/Order/OrderDetail.vue

@ -33,15 +33,22 @@
> >
</div> </div>
<el-button type="primary" size="medium">在线付款</el-button> <el-button
<el-button type="text" size="small" style="padding: 0" type="primary"
>打印订单</el-button size="medium"
v-if="info.state != 'WAIT_COMMENT'"
>在线付款</el-button
> >
<!-- <el-button type="text" size="small" style="padding: 0"
>打印订单</el-button
> -->
</div> </div>
<div class="order-step"> <div class="order-step">
<el-steps :active="2" align-center style="width: 100%"> <el-steps :active="activities.length" align-center style="width: 100%">
<el-step v-for="(item, i) in activities" :key="i"> <el-step v-for="(item, i) in activities" :key="i">
<div class="process-title" slot="title">{{ item.remark }}</div> <div class="process-title" slot="description">
{{ item.remark }}
</div>
<div slot="icon"> <div slot="icon">
<span v-if="i >= 2">{{ i + 1 }}</span> <span v-if="i >= 2">{{ i + 1 }}</span>
<i v-else style="color: #fff" class="el-icon-check"></i> <i v-else style="color: #fff" class="el-icon-check"></i>
@ -61,41 +68,41 @@
> >
<el-descriptions title="订单信息" :column="1"> <el-descriptions title="订单信息" :column="1">
<el-descriptions-item label="订单号">{{ <el-descriptions-item label="订单号">{{
orderInfo.orderNumber info.order_id
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="订单状态">{{ <el-descriptions-item label="订单状态">{{
orderInfo.status info.state_text
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="下单时间">{{ <el-descriptions-item label="下单时间">{{
orderInfo.orderTime info.create_time
}}</el-descriptions-item> }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
<el-descriptions title="配送信息" :column="1"> <el-descriptions title="配送信息" :column="1">
<el-descriptions-item label="收货人">{{ <el-descriptions-item label="收货人">{{
deliveryInfo.receiver info.order_product_list[0].consignee_info.name
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="地址">{{ <el-descriptions-item label="地址">{{
deliveryInfo.address info.order_product_list[0].consignee_info.address
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="手机号码">{{ <el-descriptions-item label="手机号码">{{
deliveryInfo.phone info.order_product_list[0].consignee_info.tel
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="配送方式">{{ <!-- <el-descriptions-item label="配送方式">{{
deliveryInfo.deliveryMethod deliveryInfo.deliveryMethod
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="期望送达时间">{{ <el-descriptions-item label="期望送达时间">{{
deliveryInfo.expectedDeliveryTime deliveryInfo.expectedDeliveryTime
}}</el-descriptions-item> }}</el-descriptions-item> -->
</el-descriptions> </el-descriptions>
<el-descriptions title="支付信息" :column="1" style="border: none"> <el-descriptions title="支付信息" :column="1" style="border: none" v-if="info.pay_method_text">
<el-descriptions-item label="支付方式">{{ <el-descriptions-item label="支付方式">{{
paymentInfo.paymentMethod info.pay_method_text
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="支付状态">{{ <!-- <el-descriptions-item label="支付状态">{{
paymentInfo.paymentStatus paymentInfo.paymentStatus
}}</el-descriptions-item> }}</el-descriptions-item> -->
<el-descriptions-item label="支付时间">{{ <el-descriptions-item label="支付时间">{{
paymentInfo.paymentTime info.pay_at
}}</el-descriptions-item> }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</div> </div>
@ -106,24 +113,32 @@
<el-table-column prop="name" label="商品名称" align="center"> <el-table-column prop="name" label="商品名称" align="center">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<img :src="row.image" class="product-image" :alt="row.name" /> <img
<div>{{ row.name }}</div> :src="row.product_img"
class="product-image"
:alt="row.product_title"
/>
<div>{{ row.product_title }}</div>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="spec" prop="sku_name"
label="规格" label="规格"
align="center" align="center"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="price" prop="product_price"
label="单价(元)" label="单价(元)"
align="center" align="center"
width="200" width="200"
></el-table-column> >
<template slot-scope="{ row }">
<div>{{ row.product_price / 100 }}</div>
</template>
</el-table-column>
<el-table-column <el-table-column
prop="quantity" prop="product_num"
label="数量" label="数量"
align="center" align="center"
width="100" width="100"
@ -135,7 +150,7 @@
width="200" width="200"
> >
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div style="color: #ff1111">{{ row.subtotal }}</div> <div style="color: #ff1111">{{ row.paid_money / 100 }}</div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -144,14 +159,14 @@
<div class="common-card normal-margin-bottom total-card"> <div class="common-card normal-margin-bottom total-card">
<el-descriptions :column="1"> <el-descriptions :column="1">
<el-descriptions-item label="商品总价" <el-descriptions-item label="商品总价"
>{{ totalPrice.productTotal }}</el-descriptions-item >{{ info.total_money / 100 }}</el-descriptions-item
> >
<el-descriptions-item label="运费" <el-descriptions-item label="运费"
>{{ totalPrice.shippingFee }}</el-descriptions-item >{{ info.total_post_fee / 100 }}</el-descriptions-item
> >
<el-descriptions-item label="实付款"> <el-descriptions-item label="实付款">
<span style="font-size: 16px; font-weight: bold; color: #ff1111" <span style="font-size: 16px; font-weight: bold; color: #ff1111"
>{{ totalPrice.actualPayment }}</span >{{ info.paid_money / 100 }}</span
> >
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
@ -183,24 +198,7 @@ export default {
paymentStatus: "已支付", paymentStatus: "已支付",
paymentTime: "2025-08-01 15:35:00", paymentTime: "2025-08-01 15:35:00",
}, },
productList: [ productList: [],
{
name: "商品1",
spec: "规格1",
price: 100,
quantity: 1,
subtotal: 100,
image: "https://picsum.photos/200/200?random=1",
},
{
name: "商品2",
spec: "规格2",
price: 200,
quantity: 2,
subtotal: 400,
image: "https://picsum.photos/200/200?random=1",
},
],
totalPrice: { totalPrice: {
productTotal: 500, productTotal: 500,
shippingFee: 0, shippingFee: 0,
@ -222,6 +220,11 @@ export default {
"/api/order/query" "/api/order/query"
).then((res) => { ).then((res) => {
this.info = res.data; this.info = res.data;
this.productList = this.info.order_product_list;
this.info.order_product_list.forEach((item) => {
if (item.product_model === "post" && item.consignee_info)
item.consignee_info = JSON.parse(item.consignee_info);
});
}); });
// //
@ -258,7 +261,7 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-around;
.order-no { .order-no {
color: #999; color: #999;
.el-button { .el-button {
@ -309,12 +312,12 @@ export default {
color: #666; color: #666;
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
margin-top: -70px; margin-top: 20px;
} }
.process-description { .process-description {
color: #666; color: #666;
font-size: 12px; font-size: 12px;
margin-top: 45px; // margin-top: 45px;
} }
::v-deep .is-finish .el-step__icon { ::v-deep .is-finish .el-step__icon {
background: #67c23a; background: #67c23a;

348
src/views/User/ContractList.vue

@ -6,22 +6,33 @@
<div>1.订单提交成功系统将根据订单内容自动为您创建交易合同</div> <div>1.订单提交成功系统将根据订单内容自动为您创建交易合同</div>
<div>2.您可直接下载合同模板线下邮寄盖章使用</div> <div>2.您可直接下载合同模板线下邮寄盖章使用</div>
</div> </div>
</div> </div>
<div class="filter-bar"> <div class="filter-bar">
<el-form :inline="true" :model="filterForm" size="small"> <el-form :inline="true" :model="filterForm" size="small">
<el-form-item label="合同号"> <el-form-item label="合同号">
<el-input v-model="filterForm.orderNo" placeholder="请输入订单编号"></el-input> <el-input
v-model="filterForm.contract_number"
placeholder="请输入合同号"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="订单编号"> <el-form-item label="订单编号">
<el-input v-model="filterForm.orderNo" placeholder="请输入订单编号"></el-input> <el-input
v-model="filterForm.order_id"
placeholder="请输入订单编号"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="下单时间"> <el-form-item label="下单时间">
<el-date-picker v-model="filterForm.createTime" type="daterange" range-separator="" start-placeholder="开始日期" <el-date-picker
end-placeholder="结束日期" value-format="yyyy-MM-dd"></el-date-picker> v-model="filterForm.datetime"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="供应商名称"> <!-- <el-form-item label="供应商名称">
<el-input v-model="filterForm.orderNo" placeholder="请输入订单编号"></el-input> <el-input v-model="filterForm.orderNo" placeholder="请输入订单编号"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="商品名称"> <el-form-item label="商品名称">
@ -31,10 +42,15 @@
<el-input-number v-model="filterForm.min"></el-input-number> <el-input-number v-model="filterForm.min"></el-input-number>
<el-input-number v-model="filterForm.max"></el-input-number> <el-input-number v-model="filterForm.max"></el-input-number>
</el-form-item> </el-form-item> -->
<el-form-item> <el-form-item>
<el-button style="background:#6a8a27;border: none;" type="primary" @click="search">搜索</el-button> <el-button
style="background: #6a8a27; border: none"
type="primary"
@click="search"
>搜索</el-button
>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button @click="reset">重置</el-button> <el-button @click="reset">重置</el-button>
@ -42,26 +58,66 @@
</el-form> </el-form>
</div> </div>
<el-table :data="orders" border style="width: 100%;"> <el-table :data="orders" border style="width: 100%">
<el-table-column prop="createTime" label="下单时间" width="200"></el-table-column> <el-table-column
<el-table-column prop="orderNo" label="订单号" min-width="120"></el-table-column> prop="create_time"
<el-table-column prop="status" label="商品信息" width="120"></el-table-column> label="下单时间"
<el-table-column prop="totalAmount" label="合同号" width="120"></el-table-column> width="160"
<el-table-column prop="orderNo" label="合同金额" min-width="120"></el-table-column> ></el-table-column>
<el-table-column label="操作" width="200"> <el-table-column
prop="order_id"
label="订单号"
min-width="100"
></el-table-column>
<el-table-column prop="status" label="商品信息" min-width="200">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" @click="handleEdit(scope.row)">查看</el-button> <div class="product-info">
<el-button size="mini" type="danger" @click="handleDelete(scope.row)">下载合同模板</el-button> <img
:src="util.showImg(scope.row.product_headimg)"
class="product-img"
/>
<div class="product-name">
{{ scope.row.product_title }}
{{
scope.row.child_order_num > 1
? "等" + scope.row.child_order_num + "款"
: ""
}}
</div>
</div>
</template>
</el-table-column>
<el-table-column
prop="contract_number"
label="合同号"
width="180"
></el-table-column>
<el-table-column
prop="paid_money"
label="合同金额"
min-width="70"
></el-table-column>
<el-table-column label="操作" width="130">
<template slot-scope="scope" v-if="scope.row.contract_number">
<!-- <el-button size="mini" @click="handlePreview(scope.row.contract_url)"
>查看</el-button
> -->
<el-button
size="mini"
type="danger"
@click="handleDownload(scope.row)"
>下载合同模板</el-button
>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div style="text-align: right; margin-top: 20px;"> <div style="text-align: right; margin-top: 20px">
<el-pagination <el-pagination
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="filterForm.currentPage" :current-page="currentPage"
:page-sizes="[5, 10, 20]" :page-sizes="[5, 10, 20]"
:page-size="filterForm.pageSize" :page-size="filterForm.limit"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="filterForm.total" :total="filterForm.total"
></el-pagination> ></el-pagination>
@ -71,179 +127,78 @@
<script> <script>
export default { export default {
name: 'OrderList', name: "OrderList",
data() { data() {
return { return {
activeTab: 'all', activeTab: "all",
currentPage: 1, currentPage: 1,
pageSize: 10,
filterForm: { filterForm: {
goodsName: '', contract_number: "",
orderNo: '', datetime: "",
createTime: '', order_id: "",
merchantName: '', limit: 10,
tradeStatus: ''
}, },
// - orders: [],
orders: [ };
{
id: 1,
orderNo: '209907091214560078',
createTime: '2099-07-09 10:47:49',
status: 'pendingPayment',
totalAmount: 937,
freight: 15,
isReviewed: false,
merchant: {
id: 101,
name: '花艺生活馆',
isOfficial: true
},
products: [
{
id: 1001,
name: '深情挚爱/卡罗拉玫瑰',
image: 'https://picsum.photos/200/200?random=1',
spec: '卡罗拉玫瑰33枝',
price: 349,
quantity: 1,
status: 'pendingPayment'
},
{
id: 1002,
name: '精美包装纸',
image: 'https://picsum.photos/200/200?random=4',
spec: '粉色',
price: 38,
quantity: 2,
status: 'pendingPayment'
}
]
}, },
{ mounted() {
id: 2, this.getList();
orderNo: '209907091214560079',
createTime: '2099-07-09 10:48:49',
status: 'pendingDelivery',
totalAmount: 199,
freight: 0,
isReviewed: false,
merchant: {
id: 102,
name: '北欧家居旗舰店',
isOfficial: true
}, },
products: [ methods: {
{ // PDF
id: 2001, handlePreview(pdfUrl) {
name: '北欧花艺素雅仿真花', window.open(pdfUrl, "_blank");
image: 'https://picsum.photos/200/200?random=2',
spec: '白色',
price: 199,
quantity: 1,
status: 'pendingDelivery'
}
]
}, },
{
id: 3, //
orderNo: '209907091214560080', handleDownload(row) {
createTime: '2099-07-09 10:49:49', const downloadUrl = this.util.showImg(row.contract_url);
status: 'delivering', //
totalAmount: 389, const link = document.createElement("a");
freight: 10, link.href = downloadUrl;
isReviewed: false, link.download = `合同${row.contract_number}.pdf`;
merchant: { link.style.display = "none";
id: 101, document.body.appendChild(link);
name: '花艺生活馆', link.click();
isOfficial: true document.body.removeChild(link);
this.$message({
message: `合同 ${row.contract_number} 开始下载`,
type: "success",
});
}, },
products: [ //
getList() {
this.get(
{ {
id: 3001, offset: (this.currentPage - 1) * this.filterForm.limit,
name: '香槟玫瑰+白玫瑰混搭', ...this.filterForm,
image: 'https://picsum.photos/200/200?random=3',
spec: '混搭',
price: 389,
quantity: 1,
status: 'delivering'
}
]
}
]
}
}, },
computed: { "/api/order/orderContract"
// ).then((res) => {
filteredOrders() { this.orders = res.data;
let result = [...this.orders];
//
if (this.activeTab !== 'all') {
result = result.filter(order => order.status === this.activeTab);
}
//
if (this.filterForm.goodsName) {
const keyword = this.filterForm.goodsName.toLowerCase();
result = result.filter(order => {
return order.products.some(product =>
product.name.toLowerCase().includes(keyword)
);
}); });
}
//
if (this.filterForm.orderNo) {
result = result.filter(order =>
order.orderNo.includes(this.filterForm.orderNo)
);
}
//
if (this.filterForm.merchantName) {
const keyword = this.filterForm.merchantName.toLowerCase();
result = result.filter(order =>
order.merchant.name.toLowerCase().includes(keyword)
);
}
//
if (this.filterForm.tradeStatus) {
result = result.filter(order =>
order.status === this.filterForm.tradeStatus
);
}
return result;
}
}, },
methods: {
// //
search() { search() {
this.currentPage = 1; // this.currentPage = 1; //
this.$message({ this.getList()
message: '搜索条件已应用',
type: 'info'
});
}, },
// //
reset() { reset() {
this.filterForm = { this.filterForm = {
goodsName: '', order_id: "",
orderNo: '', createTime: "",
createTime: '', contract_number: "",
merchantName: '',
tradeStatus: ''
}; };
this.activeTab = 'all'; this.activeTab = "all";
this.currentPage = 1; this.currentPage = 1;
}, },
// //
handleSizeChange(val) { handleSizeChange(val) {
this.pageSize = val; this.filterForm.limit = val;
}, },
// //
@ -254,11 +209,11 @@ export default {
// //
getStatusText(status) { getStatusText(status) {
const statusMap = { const statusMap = {
pendingPayment: '待付款', pendingPayment: "待付款",
pendingDelivery: '待发货', pendingDelivery: "待发货",
delivering: '配送中', delivering: "配送中",
completed: '已完成', completed: "已完成",
cancelled: '已取消' cancelled: "已取消",
}; };
return statusMap[status] || status; return statusMap[status] || status;
}, },
@ -266,20 +221,20 @@ export default {
// //
getStatusTagType(status) { getStatusTagType(status) {
const typeMap = { const typeMap = {
pendingPayment: 'warning', pendingPayment: "warning",
pendingDelivery: 'info', pendingDelivery: "info",
delivering: 'primary', delivering: "primary",
completed: 'success', completed: "success",
cancelled: 'danger' cancelled: "danger",
}; };
return typeMap[status] || 'default'; return typeMap[status] || "default";
}, },
// //
payOrder(orderId) { payOrder(orderId) {
this.$message({ this.$message({
message: `订单 ${orderId} 去付款`, message: `订单 ${orderId} 去付款`,
type: 'info' type: "info",
}); });
}, },
@ -287,7 +242,7 @@ export default {
remindDelivery(orderId) { remindDelivery(orderId) {
this.$message({ this.$message({
message: `已提醒订单 ${orderId} 发货`, message: `已提醒订单 ${orderId} 发货`,
type: 'success' type: "success",
}); });
}, },
@ -295,7 +250,7 @@ export default {
checkLogistics(orderId) { checkLogistics(orderId) {
this.$message({ this.$message({
message: `查看订单 ${orderId} 物流`, message: `查看订单 ${orderId} 物流`,
type: 'info' type: "info",
}); });
}, },
@ -303,18 +258,18 @@ export default {
gotoReview(orderId) { gotoReview(orderId) {
this.$message({ this.$message({
message: `去评价订单 ${orderId}`, message: `去评价订单 ${orderId}`,
type: 'info' type: "info",
}); });
}, },
// //
viewOrderDetail(orderId) { viewOrderDetail(orderId) {
this.$router.push({ this.$router.push({
name: 'OrderDetail', name: "OrderDetail",
}); });
} },
} },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -329,7 +284,7 @@ export default {
color: #6a8a27; color: #6a8a27;
} }
::v-deep .el-tabs__active-bar { ::v-deep .el-tabs__active-bar {
background-color: #6a8a27 background-color: #6a8a27;
} }
::v-deep .el-tabs__item:hover { ::v-deep .el-tabs__item:hover {
color: #6a8a27; color: #6a8a27;
@ -350,7 +305,6 @@ export default {
} }
} }
/* 订单卡片样式 */ /* 订单卡片样式 */
.order-card { .order-card {
border: 1px solid #eee; border: 1px solid #eee;
@ -370,8 +324,6 @@ export default {
font-size: 14px; font-size: 14px;
} }
/* 订单商品列表 */ /* 订单商品列表 */
.order-products { .order-products {
padding: 10px 20px; padding: 10px 20px;
@ -489,6 +441,24 @@ export default {
line-height: 1.5; line-height: 1.5;
} }
.product-info {
display: flex;
align-items: center;
padding: 5px 0;
.product-img {
width: 50px;
height: 50px;
object-fit: cover;
border-radius: 4px;
margin-right: 10px;
border: 1px solid #eee;
}
.product-name {
color: #333;
}
}
</style> </style>

2
src/views/User/Index.vue

@ -27,7 +27,7 @@ export default {
// {title: '' ,path:""}, // {title: '' ,path:""},
{title: '我的足迹',path:"/User/ViewHistory" }, // {title: '',path:"/User/ViewHistory" },
{title: '消息中心',path:"/User/MessageList" }, {title: '消息中心',path:"/User/MessageList" },
{title: '个人信息',path:"/User/UserInfo" }, {title: '个人信息',path:"/User/UserInfo" },
{title: '采购人信息',path:"/User/PurchaserAdd" }, {title: '采购人信息',path:"/User/PurchaserAdd" },

28
src/views/User/OrderList.vue

@ -1,12 +1,12 @@
<template> <template>
<div class="bg"> <div class="bg">
<el-tabs v-model="activeTab"> <!-- <el-tabs v-model="activeTab">
<el-tab-pane label="所有订单" name="all"></el-tab-pane> <el-tab-pane label="所有订单" name="all"></el-tab-pane>
<el-tab-pane label="待付款" name="pendingPayment"></el-tab-pane> <el-tab-pane label="待付款" name="pendingPayment"></el-tab-pane>
<el-tab-pane label="待发货" name="pendingDelivery"></el-tab-pane> <el-tab-pane label="待发货" name="pendingDelivery"></el-tab-pane>
<el-tab-pane label="配送中" name="delivering"></el-tab-pane> <el-tab-pane label="配送中" name="delivering"></el-tab-pane>
<el-tab-pane label="待评价" name="pendingReview"></el-tab-pane> <el-tab-pane label="待评价" name="pendingReview"></el-tab-pane>
</el-tabs> </el-tabs> -->
<div class="filter-bar"> <div class="filter-bar">
<el-form :inline="true" :model="filterForm" size="small"> <el-form :inline="true" :model="filterForm" size="small">
@ -40,7 +40,7 @@
</el-form-item> </el-form-item>
<el-form-item label="交易状态"> <el-form-item label="交易状态">
<el-select <el-select
v-model="filterForm.tradeStatus" v-model="filterForm.state"
placeholder="请选择" placeholder="请选择"
style="width: 200px" style="width: 200px"
> >
@ -228,9 +228,10 @@ export default {
start_date: "", start_date: "",
end_date: "", end_date: "",
total: 1, total: 1,
state: ''
}, },
typeList: [ typeList: [
{ name: "全部", id: "ALL" }, { name: "全部", id: "" },
{ name: "待付款", id: "WAIT_PAYMENT" }, { name: "待付款", id: "WAIT_PAYMENT" },
{ name: "待发货", id: "WAIT_POST" }, { name: "待发货", id: "WAIT_POST" },
{ name: "待使用/出行", id: "WAIT_USE" }, { name: "待使用/出行", id: "WAIT_USE" },
@ -260,10 +261,25 @@ export default {
}, },
// //
search() {}, search() {
this.filterForm.currentPage = 1
this.getList()
},
// //
reset() {}, reset() {
this.filterForm = {
keywords: "",
currentPage: 1,
limit: 10,
order_id: "",
createTime: null,
start_date: "",
end_date: "",
total: 1,
}
this.getList()
},
// //
handleSizeChange(val) { handleSizeChange(val) {

85
src/views/User/UserCenter.vue

@ -19,7 +19,9 @@
<i :class="item.icon"></i> <i :class="item.icon"></i>
</div> </div>
<span class="feature-name">{{ item.title }}</span> <span class="feature-name">{{ item.title }}</span>
<el-button type="text" size="mini" style="margin-top: 5px;">去设置</el-button> <el-button type="text" size="mini" style="margin-top: 5px"
>去设置</el-button
>
</router-link> </router-link>
</el-col> </el-col>
</el-row> </el-row>
@ -29,18 +31,22 @@
<el-card v-if="userInfo"> <el-card v-if="userInfo">
<div slot="header">个人信息</div> <div slot="header">个人信息</div>
<div class="user-info"> <div class="user-info">
<img :src="userInfo.avatar" alt="用户头像" class="user-avatar"> <img :src="userInfo.avatar" alt="用户头像" class="user-avatar" />
<div class="user-details"> <div class="user-details">
<div> <div>
<div class="user-name">{{ userInfo.nickname }}</div> <div class="user-name">{{ userInfo.nickname }}</div>
<div class="user-other-info"> <div class="user-other-info">
ID: {{ userInfo.user_id }} ID: {{ userInfo.user_id }}
<el-button type="text" size="mini" @click="copyId">复制</el-button> <el-button
type="text"
size="mini"
@click="util.copyId(userInfo.user_id)"
>复制</el-button
>
</div> </div>
<div class="user-other-info">手机号: {{ userInfo.mobile }}</div> <div class="user-other-info">手机号: {{ userInfo.mobile }}</div>
</div> </div>
<div class="login-info"> <div class="login-info">
<div class="login-section"> <div class="login-section">
<div class="login-section-title">当前登录信息</div> <div class="login-section-title">当前登录信息</div>
@ -57,18 +63,21 @@
</div> </div>
</div> </div>
<div> <div>
<el-button @click="goPath('/User/UserInfo')" type="primary" size="mini" style="background-color: #6a8a27;border: none;"> <el-button
@click="goPath('/User/UserInfo')"
type="primary"
size="mini"
style="background-color: #6a8a27; border: none"
>
<i class="el-icon-edit"></i> 编辑个人信息 <i class="el-icon-edit"></i> 编辑个人信息
</el-button> </el-button>
</div> </div>
</div> </div>
</el-card> </el-card>
<!-- 订单管理卡片 --> <!-- 订单管理卡片 -->
<div class="flex-center"> <div class="flex-center">
<el-card style="flex: 1;"> <el-card style="flex: 1">
<div slot="header">我的议价</div> <div slot="header">我的议价</div>
<div class="feature-grid"> <div class="feature-grid">
<div class="feature-item" v-for="(item, i) in bargaining" :key="i"> <div class="feature-item" v-for="(item, i) in bargaining" :key="i">
@ -80,8 +89,8 @@
</div> </div>
</div> </div>
</el-card> </el-card>
<div style="width: 20px;flex-shrink: 0;"></div> <div style="width: 20px; flex-shrink: 0"></div>
<el-card style="flex: 1;"> <el-card style="flex: 1">
<div slot="header">我的订单</div> <div slot="header">我的订单</div>
<div class="feature-grid"> <div class="feature-grid">
<div class="feature-item" v-for="(item, i) in order" :key="i"> <div class="feature-item" v-for="(item, i) in order" :key="i">
@ -94,23 +103,32 @@
</div> </div>
</el-card> </el-card>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'UserCenter', name: "UserCenter",
data() { data() {
return { return {
showNotice: true, showNotice: true,
userId: '200901071124', userId: "200901071124",
headFun: [ headFun: [
{icon: "el-icon-location", title: "设置收货地址", path: "/User/UserAddress"}, {
{icon: "el-icon-document", title: "设置发票抬头", path: "/User/UserInvoice"}, icon: "el-icon-location",
{icon: "el-icon-user", title: "设置采购人信息", path: "/User/PurchaserAdd"}, title: "设置收货地址",
path: "/User/UserAddress",
},
{
icon: "el-icon-document",
title: "设置发票抬头",
path: "/User/UserInvoice",
},
{
icon: "el-icon-user",
title: "设置采购人信息",
path: "/User/PurchaserAdd",
},
], ],
bargaining: [ bargaining: [
{ icon: "el-icon-time", title: "待回复", path: "", value: 2 }, { icon: "el-icon-time", title: "待回复", path: "", value: 2 },
@ -124,45 +142,26 @@ export default {
], ],
userInfo: null, userInfo: null,
};
}
},
computed: {
}, },
computed: {},
mounted() { mounted() {
this.getUserInfo(); this.getUserInfo();
}, },
methods: { methods: {
getUserInfo() { getUserInfo() {
// //
this.post({},"/api/uservice/user/getMyInfo").then(res=>{ this.post({}, "/api/uservice/user/getMyInfo").then((res) => {
this.userInfo = res.data; this.userInfo = res.data;
console.log(this.userInfo) console.log(this.userInfo);
}) });
}, },
goPath(path) { goPath(path) {
this.$router.push(path); this.$router.push(path);
}, },
// ID
copyId() {
const input = document.createElement('input');
input.value = this.userId;
document.body.appendChild(input);
input.select();
document.execCommand('copy');
document.body.removeChild(input);
this.$message({
message: 'ID已复制',
type: 'success'
});
}, },
} };
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

Loading…
Cancel
Save