Skip to content

Commit 5e3d61c

Browse files
committed
订单列表已完成
1 parent b7a1289 commit 5e3d61c

File tree

4 files changed

+13728
-1
lines changed

4 files changed

+13728
-1
lines changed

src/components/goods/AddGood.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -165,7 +165,7 @@ export default {
165165
this.imgDialogVisible = true;
166166
},
167167
addGood() {
168-
this.$refs.goodRef.validate(async valid => {
168+
this.$ref.goodref.validate(async valid => {
169169
if (!valid) return this.$message.error('请填写商品的必填项');
170170
// 深拷贝对象
171171
const form = _.cloneDeep(this.goodForm)

src/components/orders/Order.vue

Lines changed: 136 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
<template>
2+
<div>
3+
<!-- 面包屑区域 -->
4+
<el-breadcrumb separator-class="el-icon-arrow-right">
5+
<el-breadcrumb-item :to="{ path: '/welcome' }">首页</el-breadcrumb-item>
6+
<el-breadcrumb-item>订单管理</el-breadcrumb-item>
7+
<el-breadcrumb-item>订单列表</el-breadcrumb-item>
8+
</el-breadcrumb>
9+
<el-card>
10+
<el-row>
11+
<el-col :span="8">
12+
<el-input placeholder="请输入内容" v-model="queryInfo.query" clearable @click="getOrderData">
13+
<el-button slot="append" icon="el-icon-search" @click="getOrderData"></el-button>
14+
</el-input>
15+
</el-col>
16+
</el-row>
17+
<el-table :data="orderTableList" border stripe>
18+
<el-table-column type="index"></el-table-column>
19+
<el-table-column label="订单编号" prop="order_number"></el-table-column>
20+
<el-table-column label="订单价格" prop="order_price"></el-table-column>
21+
<el-table-column label="是否付款">
22+
<template slot-scope="scope">
23+
<el-tag size="mini" v-if="scope.row.pay_status === '1'">已付款</el-tag>
24+
<el-tag type="danger" size="mini" v-else>未付款</el-tag>
25+
</template>
26+
</el-table-column>
27+
<el-table-column label="是否发货" prop="is_send"></el-table-column>
28+
<el-table-column label="下单时间" prop="create_time">
29+
<template slot-scope="scope">
30+
{{scope.row.create_time | dateFormat}}
31+
</template>
32+
</el-table-column>
33+
<el-table-column label="操作" width="180px">
34+
<template>
35+
<el-button type='primary' icon="el-icon-edit" size="mini" @click="adressDialog">地址</el-button>
36+
<el-button type="warning" icon="el-icon-location" size="mini" @click="progressDialog">物流</el-button>
37+
</template>
38+
</el-table-column>
39+
</el-table>
40+
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="queryInfo.pagenum" :page-sizes="[1, 3, 5, 10]" :page-size="queryInfo.pagesize" layout="total, sizes, prev, pager, next, jumper" :total="total">
41+
</el-pagination>
42+
<el-dialog title="收货地址" :visible.sync="addressDialogVisible" @close="adressClose">
43+
<el-form :model="addressForm" :rules="adressFormRules" ref="adressFormRef">
44+
<el-form-item label="省市区/县" prop="adress">
45+
<el-cascader v-model="addressForm.adress" :options="citydata" expandTrigger="hover"></el-cascader>
46+
</el-form-item>
47+
<el-form-item label="详细地址" prop="detailAdress">
48+
<el-input v-model="addressForm.detailAdress"></el-input>
49+
</el-form-item>
50+
</el-form>
51+
<span slot="footer" class="dialog-footer">
52+
<el-button @click="addressDialogVisible = false">取 消</el-button>
53+
<el-button type="primary" @click="addressDialogVisible = false">确 定</el-button>
54+
</span>
55+
</el-dialog>
56+
<el-dialog title="物流信息" :visible.sync="progressFormVisible">
57+
<span>物流信息</span>
58+
</el-dialog>
59+
</el-card>
60+
</div>
61+
</template>
62+
63+
<script>
64+
import citydata from './citydata'
65+
66+
export default {
67+
name: '',
68+
data() {
69+
return {
70+
queryInfo: {
71+
query: '',
72+
pagenum: 1,
73+
pagesize: 5
74+
},
75+
orderTableList: [],
76+
total: 0,
77+
addressDialogVisible: false,
78+
addressForm: {
79+
adress: '',
80+
detailAdress: '',
81+
},
82+
adressFormRules: {
83+
adress: [
84+
{ required: true, message: '请输入城市', trigger: 'blur' }
85+
],
86+
detailAdress: [
87+
{ required: true, message: '请输入详细地址', trigger: 'blur' }
88+
]
89+
},
90+
citydata,
91+
progressFormVisible: false,
92+
progressInfo: {}
93+
}
94+
},
95+
methods: {
96+
async getOrderData() {
97+
console.log(this.queryInfo.query);
98+
const { data: res } = await this.$axios.get('orders', { params: this.queryInfo });
99+
if (res.meta.status !== 200) return this.$message.error('查询订单数据失败');
100+
this.orderTableList = res.data.goods;
101+
this.total = res.data.total;
102+
console.log(res);
103+
},
104+
handleSizeChange(newSize) {
105+
this.queryInfo.pagesize = newSize;
106+
this.getOrderData();
107+
},
108+
handleCurrentChange(newPage) {
109+
this.queryInfo.pagenum = newPage;
110+
this.getOrderData();
111+
},
112+
adressDialog() {
113+
this.addressDialogVisible = true;
114+
},
115+
adressClose() {
116+
this.$refs.adressFormRef.resetFields();
117+
},
118+
async progressDialog() {
119+
/* const { data: res } = await this.$axios.get('kuaidi/1106975712662');
120+
console.log(res);
121+
if (res.meta.status !== 200) return this.$message.error('获取物流数据失败');
122+
this.progressInfo = res.data; */
123+
this.progressFormVisible = true;
124+
}
125+
},
126+
created() {
127+
this.getOrderData();
128+
}
129+
};
130+
</script>
131+
132+
<style scoped>
133+
.el-cascader {
134+
width: 100%;
135+
}
136+
</style>

0 commit comments

Comments
 (0)