Skip to content

P
pica.cloud.web-education-admin
提交 33b978ed 编写于 作者: yi.li's avatar yi.li
浏览文件
操作

订单管理UI及各个弹层

上级 34ab990b
隐藏空白字符变更
内嵌 并排
正在显示 包含 491 行增加 和 23 行删除
src/components/shop/change-info.vue 0 → 100644
浏览文件 @ 33b978ed
<template>
<div class="order-manage-wrapper">
<el-dialog
title="修改买家收货信息"
:visible="changeInfoDialog"
@close="cancelChangeInfo"
width="600px"
center
class="send-set-body">
<el-form ref="changeInfoForm" :model="changeInfoForm" :rules="rules" label-width="90px" label-suffix=":">
<el-form-item label="收货人" prop="name">
<el-input type="text" v-model="changeInfoForm.name" placeholder="请输入快递公司"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input type="text" v-model="changeInfoForm.phone" placeholder="请输入快递单号"></el-input>
</el-form-item>
<el-form-item label="所在地区" prop="area">
<el-cascader
size="small"
ref="cascaderRegion"
:options="optionsRegion"
:props="props"
v-model="changeInfoForm.area"
@change="handleChange"
filterable
change-on-select
placeholder="请选择地区"
></el-cascader>
</el-form-item>
<el-form-item label="详细地址" prop="address">
<el-input type="textarea"
v-model="changeInfoForm.address"
rows="5"
placeholder="请输入备注内容"
style="width: 100%;">
</el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="submitChange">完成</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { openLoading, closeLoading } from "@/utils/utils";
import * as operationData from "@/utils/operation";
let vm = null;
export default {
components: {
},
props: {
// sendSetFormData: {
// type: Object,
// required: true,
// default: () => {}
// },
},
data(){
return{
changeInfoDialog: true,
optionsRegion: [],
administrativeValue: '',
changeInfoForm: {
name: '',
phone: '',
area: '',
address: '',
},
props: {
lazy: true,
lazyLoad(node, resolve) {
const { level } = node;
console.log("node", node);
if (node.level == 1) {
let req = {
provinceId: node.data.value
};
vm.GET("basic-data/position/cities", req).then(res => {
let newData = vm.setMoreOption(res.data.cityList, "cities");
resolve(newData);
});
} else if (node.level == 2) {
let req = {
cityId: node.data.value
};
vm.GET("basic-data/position/counties", req).then(res => {
let newData = vm.setMoreOption(res.data.countyList, "counties");
resolve(newData);
});
} else if (node.level == 3) {
let req = {
countyId: node.data.value
};
vm.GET("basic-data/position/towns", req).then(res => {
let newData = vm.setMoreOption(res.data.townList, "towns");
resolve(newData);
});
}
}
},
rules: {
name: [
{ required: true, message: '请输入收货人姓名', trigger: "blur"},
],
phone: [
{ required: true, message: '请输入收货人手机号', trigger: "blur"},
],
area: [
{ required: true, message: '请选择所在地区', trigger: "blur"},
],
address: [
{ required: true, message: '请输入收货人详细地址', trigger: "blur"},
],
},
}
},
created() {
vm = this;
this.getRegionOption();
},
methods: {
handleChange(value) {
let areaId = "000";
for (let i = 0; i < value.length; i++) {
areaId += "_" + value[i];
}
this.administrativeValue = areaId;
console.log('修改后的值',value, this.administrativeValue);
},
//获取地区
getRegionOption() {
let req = {};
openLoading(vm);
vm.GET("basic-data/position/provinces", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.optionsRegion = operationData.setRegionOption2(
res.data.provinceList
);
}
});
},
setMoreOption(data, type) {
let option = [];
for (let i = 0; i < data.length; i++) {
let obj = data[i];
if (type == "cities") {
obj.label = data[i].cityName;
obj.value = data[i].cityId;
} else if (type == "counties") {
obj.label = data[i].countyName;
obj.value = data[i].countyId;
// obj.leaf = true;
} else if (type == "towns") {
obj.label = data[i].townName;
obj.value = data[i].townId;
obj.leaf = true;
}
option.push(obj);
}
return option;
},
cancelChangeInfo() {
this.$emit('closeChangeInfo',{type: 1})
},
submitChange() {
this.$emit('closeChangeInfo',{type: 2})
},
},
}
</script>
<style lang="scss">
.send-set-body{
.address-content{
width: 100%;
background-color: #F0F2F5;
border: 1px solid #E4E7ED;
border-radius: 4px;
padding: 10px 15px;
.address-title{
display: flex;
justify-content: space-between;
align-items: center;
.title{
font-size: 13px;
color: #999999;
}
}
.address-info{
p{
line-height: 26px;
}
}
}
.form-title{
margin-top: 15px;
margin-bottom: 15px;
}
.el-dialog__body{
padding-bottom: 0;
}
}
</style>
src/components/shop/send-set-dialog.vue 0 → 100644
浏览文件 @ 33b978ed
<template>
<div class="order-manage-wrapper">
<el-dialog
:title="sendSetFormData.dialogTitle"
:visible="sendGoodsDialog"
@close="cancelSendSet"
width="600px"
center
class="send-set-body">
<div class="address-content">
<div class="address-title">
<span class="title">买家收货信息</span>
<el-button type="text" size="small" @click="changeInfo">修改</el-button>
</div>
<div class="address-info">
<p>上海市浦东新区花木路世纪大厦22楼</p>
<p>张三 15829738940</p>
</div>
</div>
<p class="form-title">填写物流信息</p>
<el-form ref="sendSetForm" :model="sendSetForm" :rules="rules" label-width="75px" label-suffix=":">
<el-form-item label="快递公司" prop="name">
<el-input type="text" v-model="sendSetForm.name" placeholder="请输入快递公司"></el-input>
</el-form-item>
<el-form-item label="快递单号" prop="orderNum">
<el-input type="text" v-model="sendSetForm.orderNum" placeholder="请输入快递单号"></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea"
v-model="sendSetForm.content"
rows="5"
placeholder="请输入备注内容"
style="width: 100%;"></el-input>
<span class="word-num" style="float: right">{{(sendSetForm.content).replace(/\s+/g,"").length}}/400</span>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<!--<el-button size="small" @click="cancelSendSet">取 消</el-button>-->
<el-button size="small" type="primary" @click="submitSendSet">完成</el-button>
</span>
</el-dialog>
<change-info v-if="showChangeInfo" @closeChangeInfo="closeChangeInfo"></change-info>
</div>
</template>
<script>
// import { openLoading, closeLoading } from "../../utils/utils";
import ChangeInfo from "./change-info";
export default {
components: {
ChangeInfo
},
props: {
sendSetFormData: {
type: Object,
required: true,
default: () => {}
},
},
data(){
return{
sendGoodsDialog: true,
sendSetForm: {
name: '',
orderNum: '',
content: '',
},
showChangeInfo: false,
rules: {
name: [
{ required: true, message: '请输入快递公司', trigger: "blur"},
],
orderNum: [
{ required: true, message: '请输入快递单号', trigger: "blur"},
],
},
}
},
created() {
},
methods: {
//发货
cancelSendSet() {
this.$emit('closeSendSet',{type: 1})
},
submitSendSet() {
this.$emit('closeSendSet',{type: 2})
},
//修改买家收货信息
changeInfo() {
this.showChangeInfo = true;
},
closeChangeInfo(val) {
this.showChangeInfo = false;
},
},
}
</script>
<style lang="scss">
.send-set-body{
.address-content{
width: 100%;
background-color: #F0F2F5;
border: 1px solid #E4E7ED;
border-radius: 4px;
padding: 10px 15px;
.address-title{
display: flex;
justify-content: space-between;
align-items: center;
.title{
font-size: 13px;
color: #999999;
}
}
.address-info{
p{
line-height: 26px;
}
}
}
.form-title{
margin-top: 15px;
margin-bottom: 15px;
}
.el-dialog__body{
padding-bottom: 0;
}
}
</style>
src/utils/shop/index.js
浏览文件 @ 33b978ed
......@@ -8,7 +8,7 @@ let headers = {
export const saveStore = (params) => {
return fetch({
headers,
url: getBaseUrl(`mall/store/upsert`),
url: getBaseUrl(`store/upsert`),
method: 'post',
data: params,
description: '新建编辑店铺',
......@@ -18,7 +18,7 @@ export const saveStore = (params) => {
export const queryStoreInfo = (storeId) => {
return fetch({
headers,
url: getBaseUrl(`mall/store/query?storeId=${storeId}`),
url: getBaseUrl(`store/query?storeId=${storeId}`),
method: 'get',
// params: params,
description: '查询单个店铺信息',
......
src/views/goods/order-manage.vue
浏览文件 @ 33b978ed
......@@ -58,10 +58,16 @@
</template>
</el-table-column>
<el-table-column prop="name" label="备注" min-width="100" align="center"></el-table-column>
<el-table-column label="操作" min-width="370" align="center" fixed="right">
<el-table-column label="操作" min-width="250" align="center" fixed="right">
<template slot-scope="scope">
<div>
<el-button @click="shopManage(scope.row)" type="text" size="small">查看详情</el-button>
<el-button @click="closeTrade(scope.row)" type="text" size="small">关闭交易</el-button>
<el-button @click="changePrice(scope.row)" type="text" size="small">修改价格</el-button>
<el-button @click="sendGoods(scope.row)" type="text" size="small">发货</el-button>
<el-button @click="distribute(scope.row)" type="text" size="small">配送</el-button>
<el-button @click="viewLogistics(scope.row)" type="text" size="small">查看物流</el-button>
<el-button @click="distributeComplete(scope.row)" type="text" size="small">配送完成</el-button>
<el-button @click="goDetail(scope.row)" type="text" size="small">查看详情</el-button>
</div>
</template>
</el-table-column>
......@@ -78,14 +84,79 @@
:total="totalRows"
></el-pagination>
</div>
<el-dialog
title="确定关闭交易吗？"
:visible="closeTradeDialog"
@close="cancelTrade"
:show-close="false"
width="600px"
center>
<p style="text-align: center;margin-top: -25px;color: #9B9997">关闭后买家将不能再付款</p>
<div style="text-align: center;margin-top: 30px;">
<el-input type="textarea"
v-model="reasonTxt"
maxlength="400"
rows="5"
placeholder="请输入备注内容"
style="width: 80%;"></el-input>
<span class="word-num">{{reasonTxt.replace(/\s+/g,"").length}}/400</span>
</div>
<!--<el-form ref="auditForm" :model="auditForm" label-width="120px">
<el-form-item label="拒绝原因：">
<el-radio-group v-model="auditForm.label">
<div v-for="item in refuseReasonList" :key="item">
<div style="padding-top: 12px;">
<el-radio :label="item"></el-radio>
</div>
</div>
<div style="padding-top: 16px;">
<el-radio label="其他"></el-radio>
</div>
</el-radio-group>
<div v-if="auditForm.label == '其他'">
<el-input type="textarea" v-model="auditForm.desc" maxlength="25" style="width: 310px;margin-top: 10px;"></el-input>
<span class="word-num">{{(auditForm.desc).replace(/\s+/g,"").length}}/25</span>
</div>
</el-form-item>
</el-form>-->
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="cancelTrade">取 消</el-button>
<el-button size="small" type="primary" @click="submitTrade">关闭交易</el-button>
</span>
</el-dialog>
<el-dialog
title="修改价格"
:visible="changePriceDialog"
@close="cancelPrice"
width="600px"
center>
<el-form ref="changePriceForm" :model="changePriceForm" label-width="120px" label-suffix=":">
<el-form-item label="目前价格">
<span>￥{{changePriceForm.nowPrice}}</span>
</el-form-item>
<el-form-item label="修改价格">
<el-input type="text" v-model="changePriceForm.updatePrice" placeholder="请输入修改后的价格" style="width: 70%"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="submitPrice">完成</el-button>
</span>
</el-dialog>
<send-set-dialog
v-if="sendGoodsDialog"
:sendSetFormData="sendSetForm"
@closeSendSet="closeSendSet">
</send-set-dialog>
</div>
</div>
</template>
<script>
// import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "@/components/breadcrumb.vue";
import SendSetDialog from "@/components/shop/send-set-dialog";
export default {
components: {
SendSetDialog,
BreadCrumb
},
data(){
......@@ -103,14 +174,14 @@
},
totalRows: 0,
tableData: [
// {
// id: '',
// name: '',
// type: null,
// status: '',
// num: null,
// createdTime: '',
// }
{
id: '',
name: '',
type: null,
status: '',
num: null,
createdTime: '',
}
],
typeList: [{
label: '供货商',
......@@ -121,7 +192,29 @@
}, {
label: '小药房',
value: '3',
}]
}],
closeTradeDialog: false,
reasonTxt: '',
changePriceDialog: false,
changePriceForm: {
nowPrice: 45,
updatePrice: '',
},
sendGoodsDialog: false,
sendSetForm: {
name: '',
orderNum: '',
content: '',
dialogTitle: '',
},
rules: {
name: [
{ required: true, message: '请输入快递公司', trigger: "blur"},
],
orderNum: [
{ required: true, message: '请输入快递单号', trigger: "blur"},
],
},
}
},
created() {
......@@ -169,15 +262,6 @@
});
},
//编辑
editShop(row) {
this.$router.push({
path: `/create-shop?enterType`,
query:{
storeId:row.storeId,
}
})
},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
......@@ -188,6 +272,54 @@
this.searchList();
},
handleClick(tab, event) {},
//关闭交易
closeTrade(row) {
this.closeTradeDialog = true;
},
cancelTrade() {
this.closeTradeDialog = false;
},
submitTrade() {
this.closeTradeDialog = false;
},
//修改价格
changePrice(row) {
this.changePriceDialog = true;
},
cancelPrice() {
this.changePriceDialog = false;
},
submitPrice() {
this.changePriceDialog = false;
},
//发货
sendGoods(row) {
this.sendGoodsDialog = true;
this.sendSetForm.dialogTitle = '发货配置';
},
closeSendSet(val) {
console.log('关闭时传递参数',val)
//保存操作
if (val.type == 2) {
}
this.sendGoodsDialog = false;
},
//配送
distribute(row) {},
//查看物流
viewLogistics(row) {},
//配送完成
distributeComplete(row) {},
//查看详情
goDetail(row) {
this.$router.push({
path: `/order-detail`,
query:{
storeId: row.orderId,
}
})
},
},
}
</script>
......@@ -234,4 +366,5 @@
.el-tabs__item:hover{
color: #449284;
}
</style>
src/views/shop/create-shop.vue
浏览文件 @ 33b978ed
......@@ -559,7 +559,7 @@
storeLogo: this.formData.storeLogo,//店铺logo
storeName: this.formData.storeName,
storeDescription: this.formData.storeDescription,
storeType: this.formData.storeType,
storeType: Number(this.formData.storeType),
storeOwner:this.formData.storeOwner,
storePhone: this.formData.storePhone,
imageList: this.formData.imageList,
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或