13 changed files with 3309 additions and 1367 deletions
@ -0,0 +1,376 @@ |
|||
<style lang="less"> |
|||
@import "@/styles/table-common.less"; |
|||
@import "./logiticsCompany.less"; |
|||
</style> |
|||
<template> |
|||
<div class="search"> |
|||
<Card> |
|||
<Row v-show="openSearch" @keydown.enter.native="handleSearch"> |
|||
<Form ref="searchForm" :model="searchForm" inline :label-width="100"> |
|||
<FormItem label="状态" prop="orderId"> |
|||
<Select ref="dep" @on-change="checkStatus" clearable="true"> |
|||
<Option v-for="(item, i) in dictData" :key="i" :value="item.value">{{ |
|||
item.title |
|||
}}</Option> |
|||
</Select> |
|||
</FormItem> |
|||
<FormItem label="店铺名称" prop="shopName"> |
|||
<Input type="text" v-model="searchForm.shopName" clearable placeholder="请输入公司名称" |
|||
style="width: 200px" /> |
|||
</FormItem> |
|||
<FormItem style="margin-left: -35px" class="br"> |
|||
<Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button> |
|||
<Button @click="handleReset">重置</Button> |
|||
<a class="drop-down" @click="dropDown"> |
|||
{{ dropDownContent }} |
|||
<Icon :type="dropDownIcon"></Icon> |
|||
</a> |
|||
</FormItem> |
|||
</Form> |
|||
</Row> |
|||
<Row align="middle" justify="space-between" class="operation"> |
|||
<div> |
|||
<Button @click="add" type="primary" icon="md-briefcase">一键结算</Button> |
|||
<Button @click="delAll" icon="ios-checkbox-outline">确认</Button> |
|||
<Button @click="delAll" icon="md-folder-open">结算</Button> |
|||
</div> |
|||
<div class="icons"> |
|||
<Tooltip content="刷新" placement="top" transfer> |
|||
<Icon type="md-refresh" size="18" class="item" @click="getDataList" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openSearch ? '关闭搜索' : '开启搜索'" placement="top" transfer> |
|||
<Icon type="ios-search" size="18" class="item tip" @click="openSearch = !openSearch" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openTip ? '关闭提示' : '开启提示'" placement="top" transfer> |
|||
<Icon type="md-bulb" size="18" class="item tip" @click="openTip = !openTip" /> |
|||
</Tooltip> |
|||
<Tooltip content="表格密度" placement="top" transfer> |
|||
<Dropdown @on-click="changeTableSize" trigger="click"> |
|||
<Icon type="md-list" size="18" class="item" /> |
|||
<DropdownMenu slot="list"> |
|||
<DropdownItem :selected="tableSize == 'default'" name="default">默认</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'large'" name="large">宽松</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'small'" name="small">紧密</DropdownItem> |
|||
</DropdownMenu> |
|||
</Dropdown> |
|||
</Tooltip> |
|||
</div> |
|||
</Row> |
|||
<Alert show-icon v-show="openTip"> |
|||
已选择 |
|||
<span class="select-count">{{ selectList.length }}</span> 项 |
|||
<a class="select-clear" @click="clearSelectAll">清空</a> |
|||
</Alert> |
|||
<Table :loading="loading" border :columns="columns" :data="data" :size="tableSize" sortable="custom" |
|||
@on-sort-change="changeSort" @on-selection-change="showSelect" ref="table"></Table> |
|||
<Row type="flex" justify="end" class="page"> |
|||
<Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" |
|||
@on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" |
|||
size="small" show-total show-elevator show-sizer></Page> |
|||
</Row> |
|||
</Card> |
|||
<Modal :title="线路维护" v-model="Visiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<logistics-address v-if="Visiable" ref="dialog"></logistics-address> |
|||
<div slot="footer" v-show=Visiable> |
|||
<Button type="text" @click="Visiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
<Modal :title="线路绑定" v-model="bindingVisiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<line-binding v-if="bindingVisiable" ref="bindinglog"></line-binding> |
|||
<div slot="footer" v-show=bindingVisiable> |
|||
<Button type="text" @click="bindingVisiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
<Modal :title="充值记录明细" v-model="rechargeVisiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<recharge-one v-if="rechargeVisiable" ref="rechargelog"></recharge-one> |
|||
<div slot="footer" v-show=rechargeVisiable> |
|||
<Button type="text" @click="rechargeVisiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
getAllLogiticsCompanyData, |
|||
getLogiticsCompanyData, |
|||
deleteLogiticsCompany, |
|||
onLineCompany, |
|||
offLineCompany |
|||
} from "@/api/app"; |
|||
import { |
|||
shortcuts |
|||
} from "@/libs/shortcuts"; |
|||
import excel from "@/libs/excel"; |
|||
import { |
|||
offLineWorker, |
|||
onLineWorker |
|||
} from "@/api"; |
|||
export default { |
|||
name: "logiticsCompany", |
|||
components: {}, |
|||
data() { |
|||
return { |
|||
dictData: [{ |
|||
title: "全部", |
|||
value: "" |
|||
}, { |
|||
title: "待确认", |
|||
value: 0 |
|||
}, { |
|||
title: "待结算", |
|||
value: 1 |
|||
}, { |
|||
title: "已打款", |
|||
value: 2 |
|||
}], |
|||
tableSize: "default", |
|||
message: "", |
|||
selectIndex: "", |
|||
currentRow: {}, |
|||
height: 510, |
|||
showCompany: false, |
|||
bindingVisiable: false, |
|||
showType: "0", |
|||
openSearch: true, |
|||
openTip: true, |
|||
loading: true, |
|||
reading: false, |
|||
loadingExport: true, |
|||
exportModalVisible: false, |
|||
importModalVisible: false, |
|||
deployModalVisible: false, |
|||
uploadfile: { |
|||
name: "", |
|||
}, |
|||
drop: false, |
|||
selectList: [], |
|||
searchForm: { |
|||
id: "", |
|||
shopName: "", |
|||
contacts: "", |
|||
mobile: "", |
|||
pageNumber: 1, |
|||
pageSize: 10, |
|||
sort: "createTime", |
|||
order: "desc", |
|||
startDate: "", |
|||
endDate: "", |
|||
signCompany: "0", |
|||
}, |
|||
selectDate: null, |
|||
options: { |
|||
shortcuts: shortcuts, |
|||
}, |
|||
form: {}, |
|||
columns: [{ |
|||
type: "selection", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
type: "index", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "账单周期", |
|||
key: "shopName", |
|||
minWidth: 100, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "店铺名称", |
|||
key: "shopName", |
|||
minWidth: 100, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "订单数量", |
|||
key: "companyTel", |
|||
minWidth: 150, |
|||
sortable: true, |
|||
}, |
|||
{ |
|||
title: "配送费", |
|||
key: "companyEmail", |
|||
minWidth: 250, |
|||
}, |
|||
{ |
|||
title: "商品原价", |
|||
key: "contacts", |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: "餐盒费", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "账户余额支付金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家实收总金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "活动金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "抵用券金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "平台补贴", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商品平台抽成", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家补贴", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商品商家抽成", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家营收", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "平台营收", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "本期期初", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "实际打款金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "账单状态", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "操作", |
|||
key: "action", |
|||
width: 200, |
|||
align: "center", |
|||
fixed: "right", |
|||
render: (h, params) => { |
|||
return h("div", [h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.findAllRecord(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"确认" |
|||
), |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.stationBinding(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"详情" |
|||
), |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.edit(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"修改" |
|||
), |
|||
]); |
|||
}, |
|||
}, |
|||
], |
|||
chooseColumns: [], |
|||
filename: "公司数据", |
|||
exportTitle: "确认导出", |
|||
exportType: "", |
|||
data: [], |
|||
exportData: [], |
|||
total: 0, |
|||
Visiable: false, |
|||
rechargeVisiable: false, |
|||
}; |
|||
}, |
|||
methods: { |
|||
init() { |
|||
// this.getDataList(); |
|||
}, |
|||
getDataList() { |
|||
// 多条件搜索用户列表 |
|||
this.loading = true; |
|||
getLogiticsCompanyData(this.searchForm).then((res) => { |
|||
this.loading = false; |
|||
if (res.success) { |
|||
if (!this.getStore("roles").includes("ROLE_ADMIN")) { |
|||
res.result.content.forEach((e) => { |
|||
e.mobile = "您无权查看该数据"; |
|||
}); |
|||
} |
|||
this.data = res.result.content; |
|||
this.total = res.result.totalElements; |
|||
if (this.data.length == 0 && this.searchForm.pageNumber > 1) { |
|||
this.searchForm.pageNumber -= 1; |
|||
this.getDataList(); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
handleSearch() { |
|||
this.searchForm.pageNumber = 1; |
|||
this.searchForm.pageSize = 10; |
|||
this.getDataList(); |
|||
} |
|||
}, |
|||
mounted() { |
|||
// 计算高度 |
|||
this.height = Number(document.documentElement.clientHeight - 230); |
|||
this.init(); |
|||
}, |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,122 @@ |
|||
.oss-wrapper { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
position: relative; |
|||
} |
|||
|
|||
.oss-card { |
|||
margin: 10px 2.5% 10px 0; |
|||
width: 22.5%; |
|||
|
|||
:hover { |
|||
.content .other .name { |
|||
color: #1890ff; |
|||
transition: color .3s; |
|||
} |
|||
} |
|||
|
|||
cursor: pointer; |
|||
|
|||
.ivu-card-body { |
|||
padding: 0; |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
:hover { |
|||
.play { |
|||
transition: opacity .3s; |
|||
opacity: 1 !important; |
|||
} |
|||
} |
|||
|
|||
.img { |
|||
height: 135px; |
|||
object-fit: cover; |
|||
} |
|||
|
|||
.video { |
|||
height: 135px; |
|||
position: relative; |
|||
|
|||
.cover { |
|||
height: 100%; |
|||
width: 100%; |
|||
object-fit: fill; |
|||
} |
|||
|
|||
.play { |
|||
position: absolute; |
|||
top: 43px; |
|||
left: calc(50% - 25px); |
|||
height: 50px; |
|||
width: 50px; |
|||
opacity: 0.8; |
|||
} |
|||
} |
|||
|
|||
.other { |
|||
padding: 16px; |
|||
height: 135px; |
|||
|
|||
.name { |
|||
font-size: 16px; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
color: rgba(0, 0, 0, .85); |
|||
font-weight: 500; |
|||
margin-bottom: 4px; |
|||
} |
|||
|
|||
.key { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
word-break: break-all; |
|||
height: 45px; |
|||
color: rgba(0, 0, 0, .45); |
|||
} |
|||
|
|||
.info { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
height: 36px; |
|||
font-size: 12px; |
|||
color: rgba(0, 0, 0, .45); |
|||
} |
|||
} |
|||
|
|||
.actions { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 50px; |
|||
background: #f7f9fa; |
|||
border-top: 1px solid #e8e8e8; |
|||
|
|||
i:hover { |
|||
color: #1890ff; |
|||
} |
|||
|
|||
.btn { |
|||
display: flex; |
|||
justify-content: center; |
|||
width: 25%; |
|||
border-right: 1px solid #e8e8e8; |
|||
} |
|||
|
|||
.btn-no { |
|||
display: flex; |
|||
justify-content: center; |
|||
width: 25%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,376 @@ |
|||
<style lang="less"> |
|||
@import "@/styles/table-common.less"; |
|||
@import "./logiticsCompany.less"; |
|||
</style> |
|||
<template> |
|||
<div class="search"> |
|||
<Card> |
|||
<Row v-show="openSearch" @keydown.enter.native="handleSearch"> |
|||
<Form ref="searchForm" :model="searchForm" inline :label-width="100"> |
|||
<FormItem label="状态" prop="orderId"> |
|||
<Select ref="dep" @on-change="checkStatus" clearable="true"> |
|||
<Option v-for="(item, i) in dictData" :key="i" :value="item.value">{{ |
|||
item.title |
|||
}}</Option> |
|||
</Select> |
|||
</FormItem> |
|||
<FormItem label="店铺名称" prop="shopName"> |
|||
<Input type="text" v-model="searchForm.shopName" clearable placeholder="请输入公司名称" |
|||
style="width: 200px" /> |
|||
</FormItem> |
|||
<FormItem style="margin-left: -35px" class="br"> |
|||
<Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button> |
|||
<Button @click="handleReset">重置</Button> |
|||
<a class="drop-down" @click="dropDown"> |
|||
{{ dropDownContent }} |
|||
<Icon :type="dropDownIcon"></Icon> |
|||
</a> |
|||
</FormItem> |
|||
</Form> |
|||
</Row> |
|||
<Row align="middle" justify="space-between" class="operation"> |
|||
<div> |
|||
<Button @click="add" type="primary" icon="md-briefcase">一键结算</Button> |
|||
<Button @click="delAll" icon="ios-checkbox-outline">确认</Button> |
|||
<Button @click="delAll" icon="md-folder-open">结算</Button> |
|||
</div> |
|||
<div class="icons"> |
|||
<Tooltip content="刷新" placement="top" transfer> |
|||
<Icon type="md-refresh" size="18" class="item" @click="getDataList" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openSearch ? '关闭搜索' : '开启搜索'" placement="top" transfer> |
|||
<Icon type="ios-search" size="18" class="item tip" @click="openSearch = !openSearch" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openTip ? '关闭提示' : '开启提示'" placement="top" transfer> |
|||
<Icon type="md-bulb" size="18" class="item tip" @click="openTip = !openTip" /> |
|||
</Tooltip> |
|||
<Tooltip content="表格密度" placement="top" transfer> |
|||
<Dropdown @on-click="changeTableSize" trigger="click"> |
|||
<Icon type="md-list" size="18" class="item" /> |
|||
<DropdownMenu slot="list"> |
|||
<DropdownItem :selected="tableSize == 'default'" name="default">默认</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'large'" name="large">宽松</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'small'" name="small">紧密</DropdownItem> |
|||
</DropdownMenu> |
|||
</Dropdown> |
|||
</Tooltip> |
|||
</div> |
|||
</Row> |
|||
<Alert show-icon v-show="openTip"> |
|||
已选择 |
|||
<span class="select-count">{{ selectList.length }}</span> 项 |
|||
<a class="select-clear" @click="clearSelectAll">清空</a> |
|||
</Alert> |
|||
<Table :loading="loading" border :columns="columns" :data="data" :size="tableSize" sortable="custom" |
|||
@on-sort-change="changeSort" @on-selection-change="showSelect" ref="table"></Table> |
|||
<Row type="flex" justify="end" class="page"> |
|||
<Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" |
|||
@on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" |
|||
size="small" show-total show-elevator show-sizer></Page> |
|||
</Row> |
|||
</Card> |
|||
<Modal :title="线路维护" v-model="Visiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<logistics-address v-if="Visiable" ref="dialog"></logistics-address> |
|||
<div slot="footer" v-show=Visiable> |
|||
<Button type="text" @click="Visiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
<Modal :title="线路绑定" v-model="bindingVisiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<line-binding v-if="bindingVisiable" ref="bindinglog"></line-binding> |
|||
<div slot="footer" v-show=bindingVisiable> |
|||
<Button type="text" @click="bindingVisiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
<Modal :title="充值记录明细" v-model="rechargeVisiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<recharge-one v-if="rechargeVisiable" ref="rechargelog"></recharge-one> |
|||
<div slot="footer" v-show=rechargeVisiable> |
|||
<Button type="text" @click="rechargeVisiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
getAllLogiticsCompanyData, |
|||
getLogiticsCompanyData, |
|||
deleteLogiticsCompany, |
|||
onLineCompany, |
|||
offLineCompany |
|||
} from "@/api/app"; |
|||
import { |
|||
shortcuts |
|||
} from "@/libs/shortcuts"; |
|||
import excel from "@/libs/excel"; |
|||
import { |
|||
offLineWorker, |
|||
onLineWorker |
|||
} from "@/api"; |
|||
export default { |
|||
name: "logiticsCompany", |
|||
components: {}, |
|||
data() { |
|||
return { |
|||
dictData: [{ |
|||
title: "全部", |
|||
value: "" |
|||
}, { |
|||
title: "待确认", |
|||
value: 0 |
|||
}, { |
|||
title: "待结算", |
|||
value: 1 |
|||
}, { |
|||
title: "已打款", |
|||
value: 2 |
|||
}], |
|||
tableSize: "default", |
|||
message: "", |
|||
selectIndex: "", |
|||
currentRow: {}, |
|||
height: 510, |
|||
showCompany: false, |
|||
bindingVisiable: false, |
|||
showType: "0", |
|||
openSearch: true, |
|||
openTip: true, |
|||
loading: true, |
|||
reading: false, |
|||
loadingExport: true, |
|||
exportModalVisible: false, |
|||
importModalVisible: false, |
|||
deployModalVisible: false, |
|||
uploadfile: { |
|||
name: "", |
|||
}, |
|||
drop: false, |
|||
selectList: [], |
|||
searchForm: { |
|||
id: "", |
|||
shopName: "", |
|||
contacts: "", |
|||
mobile: "", |
|||
pageNumber: 1, |
|||
pageSize: 10, |
|||
sort: "createTime", |
|||
order: "desc", |
|||
startDate: "", |
|||
endDate: "", |
|||
signCompany: "0", |
|||
}, |
|||
selectDate: null, |
|||
options: { |
|||
shortcuts: shortcuts, |
|||
}, |
|||
form: {}, |
|||
columns: [{ |
|||
type: "selection", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
type: "index", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "账单周期", |
|||
key: "shopName", |
|||
minWidth: 100, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "店铺名称", |
|||
key: "shopName", |
|||
minWidth: 100, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "订单数量", |
|||
key: "companyTel", |
|||
minWidth: 150, |
|||
sortable: true, |
|||
}, |
|||
{ |
|||
title: "配送费", |
|||
key: "companyEmail", |
|||
minWidth: 250, |
|||
}, |
|||
{ |
|||
title: "商品原价", |
|||
key: "contacts", |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: "餐盒费", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "账户余额支付金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家实收总金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "活动金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "抵用券金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "平台补贴", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商品平台抽成", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家补贴", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商品商家抽成", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家营收", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "平台营收", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "本期期初", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "实际打款金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "账单状态", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "操作", |
|||
key: "action", |
|||
width: 200, |
|||
align: "center", |
|||
fixed: "right", |
|||
render: (h, params) => { |
|||
return h("div", [h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.findAllRecord(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"确认" |
|||
), |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.stationBinding(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"详情" |
|||
), |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.edit(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"修改" |
|||
), |
|||
]); |
|||
}, |
|||
}, |
|||
], |
|||
chooseColumns: [], |
|||
filename: "公司数据", |
|||
exportTitle: "确认导出", |
|||
exportType: "", |
|||
data: [], |
|||
exportData: [], |
|||
total: 0, |
|||
Visiable: false, |
|||
rechargeVisiable: false, |
|||
}; |
|||
}, |
|||
methods: { |
|||
init() { |
|||
// this.getDataList(); |
|||
}, |
|||
getDataList() { |
|||
// 多条件搜索用户列表 |
|||
this.loading = true; |
|||
getLogiticsCompanyData(this.searchForm).then((res) => { |
|||
this.loading = false; |
|||
if (res.success) { |
|||
if (!this.getStore("roles").includes("ROLE_ADMIN")) { |
|||
res.result.content.forEach((e) => { |
|||
e.mobile = "您无权查看该数据"; |
|||
}); |
|||
} |
|||
this.data = res.result.content; |
|||
this.total = res.result.totalElements; |
|||
if (this.data.length == 0 && this.searchForm.pageNumber > 1) { |
|||
this.searchForm.pageNumber -= 1; |
|||
this.getDataList(); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
handleSearch() { |
|||
this.searchForm.pageNumber = 1; |
|||
this.searchForm.pageSize = 10; |
|||
this.getDataList(); |
|||
} |
|||
}, |
|||
mounted() { |
|||
// 计算高度 |
|||
this.height = Number(document.documentElement.clientHeight - 230); |
|||
this.init(); |
|||
}, |
|||
}; |
|||
</script> |
|||
@ -0,0 +1,122 @@ |
|||
.oss-wrapper { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
position: relative; |
|||
} |
|||
|
|||
.oss-card { |
|||
margin: 10px 2.5% 10px 0; |
|||
width: 22.5%; |
|||
|
|||
:hover { |
|||
.content .other .name { |
|||
color: #1890ff; |
|||
transition: color .3s; |
|||
} |
|||
} |
|||
|
|||
cursor: pointer; |
|||
|
|||
.ivu-card-body { |
|||
padding: 0; |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
:hover { |
|||
.play { |
|||
transition: opacity .3s; |
|||
opacity: 1 !important; |
|||
} |
|||
} |
|||
|
|||
.img { |
|||
height: 135px; |
|||
object-fit: cover; |
|||
} |
|||
|
|||
.video { |
|||
height: 135px; |
|||
position: relative; |
|||
|
|||
.cover { |
|||
height: 100%; |
|||
width: 100%; |
|||
object-fit: fill; |
|||
} |
|||
|
|||
.play { |
|||
position: absolute; |
|||
top: 43px; |
|||
left: calc(50% - 25px); |
|||
height: 50px; |
|||
width: 50px; |
|||
opacity: 0.8; |
|||
} |
|||
} |
|||
|
|||
.other { |
|||
padding: 16px; |
|||
height: 135px; |
|||
|
|||
.name { |
|||
font-size: 16px; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
color: rgba(0, 0, 0, .85); |
|||
font-weight: 500; |
|||
margin-bottom: 4px; |
|||
} |
|||
|
|||
.key { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
word-break: break-all; |
|||
height: 45px; |
|||
color: rgba(0, 0, 0, .45); |
|||
} |
|||
|
|||
.info { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
height: 36px; |
|||
font-size: 12px; |
|||
color: rgba(0, 0, 0, .45); |
|||
} |
|||
} |
|||
|
|||
.actions { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 50px; |
|||
background: #f7f9fa; |
|||
border-top: 1px solid #e8e8e8; |
|||
|
|||
i:hover { |
|||
color: #1890ff; |
|||
} |
|||
|
|||
.btn { |
|||
display: flex; |
|||
justify-content: center; |
|||
width: 25%; |
|||
border-right: 1px solid #e8e8e8; |
|||
} |
|||
|
|||
.btn-no { |
|||
display: flex; |
|||
justify-content: center; |
|||
width: 25%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,122 @@ |
|||
.oss-wrapper { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
position: relative; |
|||
} |
|||
|
|||
.oss-card { |
|||
margin: 10px 2.5% 10px 0; |
|||
width: 22.5%; |
|||
|
|||
:hover { |
|||
.content .other .name { |
|||
color: #1890ff; |
|||
transition: color .3s; |
|||
} |
|||
} |
|||
|
|||
cursor: pointer; |
|||
|
|||
.ivu-card-body { |
|||
padding: 0; |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
:hover { |
|||
.play { |
|||
transition: opacity .3s; |
|||
opacity: 1 !important; |
|||
} |
|||
} |
|||
|
|||
.img { |
|||
height: 135px; |
|||
object-fit: cover; |
|||
} |
|||
|
|||
.video { |
|||
height: 135px; |
|||
position: relative; |
|||
|
|||
.cover { |
|||
height: 100%; |
|||
width: 100%; |
|||
object-fit: fill; |
|||
} |
|||
|
|||
.play { |
|||
position: absolute; |
|||
top: 43px; |
|||
left: calc(50% - 25px); |
|||
height: 50px; |
|||
width: 50px; |
|||
opacity: 0.8; |
|||
} |
|||
} |
|||
|
|||
.other { |
|||
padding: 16px; |
|||
height: 135px; |
|||
|
|||
.name { |
|||
font-size: 16px; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
color: rgba(0, 0, 0, .85); |
|||
font-weight: 500; |
|||
margin-bottom: 4px; |
|||
} |
|||
|
|||
.key { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
word-break: break-all; |
|||
height: 45px; |
|||
color: rgba(0, 0, 0, .45); |
|||
} |
|||
|
|||
.info { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
height: 36px; |
|||
font-size: 12px; |
|||
color: rgba(0, 0, 0, .45); |
|||
} |
|||
} |
|||
|
|||
.actions { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 50px; |
|||
background: #f7f9fa; |
|||
border-top: 1px solid #e8e8e8; |
|||
|
|||
i:hover { |
|||
color: #1890ff; |
|||
} |
|||
|
|||
.btn { |
|||
display: flex; |
|||
justify-content: center; |
|||
width: 25%; |
|||
border-right: 1px solid #e8e8e8; |
|||
} |
|||
|
|||
.btn-no { |
|||
display: flex; |
|||
justify-content: center; |
|||
width: 25%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,376 @@ |
|||
<style lang="less"> |
|||
@import "@/styles/table-common.less"; |
|||
@import "./logiticsCompany.less"; |
|||
</style> |
|||
<template> |
|||
<div class="search"> |
|||
<Card> |
|||
<Row v-show="openSearch" @keydown.enter.native="handleSearch"> |
|||
<Form ref="searchForm" :model="searchForm" inline :label-width="100"> |
|||
<FormItem label="状态" prop="orderId"> |
|||
<Select ref="dep" @on-change="checkStatus" clearable="true"> |
|||
<Option v-for="(item, i) in dictData" :key="i" :value="item.value">{{ |
|||
item.title |
|||
}}</Option> |
|||
</Select> |
|||
</FormItem> |
|||
<FormItem label="店铺名称" prop="shopName"> |
|||
<Input type="text" v-model="searchForm.shopName" clearable placeholder="请输入公司名称" |
|||
style="width: 200px" /> |
|||
</FormItem> |
|||
<FormItem style="margin-left: -35px" class="br"> |
|||
<Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button> |
|||
<Button @click="handleReset">重置</Button> |
|||
<a class="drop-down" @click="dropDown"> |
|||
{{ dropDownContent }} |
|||
<Icon :type="dropDownIcon"></Icon> |
|||
</a> |
|||
</FormItem> |
|||
</Form> |
|||
</Row> |
|||
<Row align="middle" justify="space-between" class="operation"> |
|||
<div> |
|||
<Button @click="add" type="primary" icon="md-briefcase">一键结算</Button> |
|||
<Button @click="delAll" icon="ios-checkbox-outline">确认</Button> |
|||
<Button @click="delAll" icon="md-folder-open">结算</Button> |
|||
</div> |
|||
<div class="icons"> |
|||
<Tooltip content="刷新" placement="top" transfer> |
|||
<Icon type="md-refresh" size="18" class="item" @click="getDataList" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openSearch ? '关闭搜索' : '开启搜索'" placement="top" transfer> |
|||
<Icon type="ios-search" size="18" class="item tip" @click="openSearch = !openSearch" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openTip ? '关闭提示' : '开启提示'" placement="top" transfer> |
|||
<Icon type="md-bulb" size="18" class="item tip" @click="openTip = !openTip" /> |
|||
</Tooltip> |
|||
<Tooltip content="表格密度" placement="top" transfer> |
|||
<Dropdown @on-click="changeTableSize" trigger="click"> |
|||
<Icon type="md-list" size="18" class="item" /> |
|||
<DropdownMenu slot="list"> |
|||
<DropdownItem :selected="tableSize == 'default'" name="default">默认</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'large'" name="large">宽松</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'small'" name="small">紧密</DropdownItem> |
|||
</DropdownMenu> |
|||
</Dropdown> |
|||
</Tooltip> |
|||
</div> |
|||
</Row> |
|||
<Alert show-icon v-show="openTip"> |
|||
已选择 |
|||
<span class="select-count">{{ selectList.length }}</span> 项 |
|||
<a class="select-clear" @click="clearSelectAll">清空</a> |
|||
</Alert> |
|||
<Table :loading="loading" border :columns="columns" :data="data" :size="tableSize" sortable="custom" |
|||
@on-sort-change="changeSort" @on-selection-change="showSelect" ref="table"></Table> |
|||
<Row type="flex" justify="end" class="page"> |
|||
<Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" |
|||
@on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" |
|||
size="small" show-total show-elevator show-sizer></Page> |
|||
</Row> |
|||
</Card> |
|||
<Modal :title="线路维护" v-model="Visiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<logistics-address v-if="Visiable" ref="dialog"></logistics-address> |
|||
<div slot="footer" v-show=Visiable> |
|||
<Button type="text" @click="Visiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
<Modal :title="线路绑定" v-model="bindingVisiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<line-binding v-if="bindingVisiable" ref="bindinglog"></line-binding> |
|||
<div slot="footer" v-show=bindingVisiable> |
|||
<Button type="text" @click="bindingVisiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
<Modal :title="充值记录明细" v-model="rechargeVisiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<recharge-one v-if="rechargeVisiable" ref="rechargelog"></recharge-one> |
|||
<div slot="footer" v-show=rechargeVisiable> |
|||
<Button type="text" @click="rechargeVisiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
getAllLogiticsCompanyData, |
|||
getLogiticsCompanyData, |
|||
deleteLogiticsCompany, |
|||
onLineCompany, |
|||
offLineCompany |
|||
} from "@/api/app"; |
|||
import { |
|||
shortcuts |
|||
} from "@/libs/shortcuts"; |
|||
import excel from "@/libs/excel"; |
|||
import { |
|||
offLineWorker, |
|||
onLineWorker |
|||
} from "@/api"; |
|||
export default { |
|||
name: "logiticsCompany", |
|||
components: {}, |
|||
data() { |
|||
return { |
|||
dictData: [{ |
|||
title: "全部", |
|||
value: "" |
|||
}, { |
|||
title: "待确认", |
|||
value: 0 |
|||
}, { |
|||
title: "待结算", |
|||
value: 1 |
|||
}, { |
|||
title: "已打款", |
|||
value: 2 |
|||
}], |
|||
tableSize: "default", |
|||
message: "", |
|||
selectIndex: "", |
|||
currentRow: {}, |
|||
height: 510, |
|||
showCompany: false, |
|||
bindingVisiable: false, |
|||
showType: "0", |
|||
openSearch: true, |
|||
openTip: true, |
|||
loading: true, |
|||
reading: false, |
|||
loadingExport: true, |
|||
exportModalVisible: false, |
|||
importModalVisible: false, |
|||
deployModalVisible: false, |
|||
uploadfile: { |
|||
name: "", |
|||
}, |
|||
drop: false, |
|||
selectList: [], |
|||
searchForm: { |
|||
id: "", |
|||
shopName: "", |
|||
contacts: "", |
|||
mobile: "", |
|||
pageNumber: 1, |
|||
pageSize: 10, |
|||
sort: "createTime", |
|||
order: "desc", |
|||
startDate: "", |
|||
endDate: "", |
|||
signCompany: "0", |
|||
}, |
|||
selectDate: null, |
|||
options: { |
|||
shortcuts: shortcuts, |
|||
}, |
|||
form: {}, |
|||
columns: [{ |
|||
type: "selection", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
type: "index", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "账单周期", |
|||
key: "shopName", |
|||
minWidth: 100, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "店铺名称", |
|||
key: "shopName", |
|||
minWidth: 100, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "订单数量", |
|||
key: "companyTel", |
|||
minWidth: 150, |
|||
sortable: true, |
|||
}, |
|||
{ |
|||
title: "配送费", |
|||
key: "companyEmail", |
|||
minWidth: 250, |
|||
}, |
|||
{ |
|||
title: "商品原价", |
|||
key: "contacts", |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: "餐盒费", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "账户余额支付金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家实收总金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "活动金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "抵用券金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "平台补贴", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商品平台抽成", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家补贴", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商品商家抽成", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "商家营收", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "平台营收", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "本期期初", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "实际打款金额", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "账单状态", |
|||
key: "mobile", |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: "操作", |
|||
key: "action", |
|||
width: 200, |
|||
align: "center", |
|||
fixed: "right", |
|||
render: (h, params) => { |
|||
return h("div", [h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.findAllRecord(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"确认" |
|||
), |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.stationBinding(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"详情" |
|||
), |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.edit(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"修改" |
|||
), |
|||
]); |
|||
}, |
|||
}, |
|||
], |
|||
chooseColumns: [], |
|||
filename: "公司数据", |
|||
exportTitle: "确认导出", |
|||
exportType: "", |
|||
data: [], |
|||
exportData: [], |
|||
total: 0, |
|||
Visiable: false, |
|||
rechargeVisiable: false, |
|||
}; |
|||
}, |
|||
methods: { |
|||
init() { |
|||
// this.getDataList(); |
|||
}, |
|||
getDataList() { |
|||
// 多条件搜索用户列表 |
|||
this.loading = true; |
|||
getLogiticsCompanyData(this.searchForm).then((res) => { |
|||
this.loading = false; |
|||
if (res.success) { |
|||
if (!this.getStore("roles").includes("ROLE_ADMIN")) { |
|||
res.result.content.forEach((e) => { |
|||
e.mobile = "您无权查看该数据"; |
|||
}); |
|||
} |
|||
this.data = res.result.content; |
|||
this.total = res.result.totalElements; |
|||
if (this.data.length == 0 && this.searchForm.pageNumber > 1) { |
|||
this.searchForm.pageNumber -= 1; |
|||
this.getDataList(); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
handleSearch() { |
|||
this.searchForm.pageNumber = 1; |
|||
this.searchForm.pageSize = 10; |
|||
this.getDataList(); |
|||
} |
|||
}, |
|||
mounted() { |
|||
// 计算高度 |
|||
this.height = Number(document.documentElement.clientHeight - 230); |
|||
this.init(); |
|||
}, |
|||
}; |
|||
</script> |
|||
@ -1,288 +1,288 @@ |
|||
<template> |
|||
<div class="company-edit"> |
|||
<!-- Drawer抽屉 --> |
|||
<Drawer |
|||
:title="title" |
|||
v-model="visible" |
|||
width="500" |
|||
draggable |
|||
:mask-closable="type == '0'" |
|||
> |
|||
<div :style="{ maxHeight: maxHeight }" class="drawer-content"> |
|||
<div class="drawer-header"> |
|||
<div style="margin-right: 16px">大巴配置</div> |
|||
</div> |
|||
<Form label-colon v-show="type != '2'"> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="大巴名称"> |
|||
{{ form.companyName }} |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
</Form> |
|||
<Form |
|||
ref="form" |
|||
:model="form" |
|||
:rules="formValidate" |
|||
label-position="top" |
|||
> |
|||
<Row :gutter="32" v-if="type == '2'"> |
|||
<Col span="24"> |
|||
<FormItem label="大巴名称" prop="companyName"> |
|||
<Input v-model="form.companyName" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="12"> |
|||
<FormItem label="登录账号" prop="username"> |
|||
<Input v-model="form.username" /> |
|||
</FormItem> |
|||
</Col> |
|||
<Col span="12"> |
|||
<FormItem label="登录密码" prop="password"> |
|||
<SetPassword v-model="form.password" @on-change="changePass" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="12"> |
|||
<FormItem label="大巴电话" prop="companyTel"> |
|||
<Input v-model="form.companyTel" /> |
|||
</FormItem> |
|||
</Col> |
|||
<Col span="12"> |
|||
<FormItem label="大巴邮箱" prop="companyEmail"> |
|||
<Input v-model="form.companyEmail" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="所在地区" prop="companyAddress"> |
|||
<al-cascader |
|||
v-model="form.companyAddress" |
|||
data-type="name" |
|||
level="2" |
|||
transfer |
|||
/> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="详细地址" prop="companyStreet"> |
|||
<Input v-model="form.companyStreet" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="12"> |
|||
<FormItem label="联系人" prop="contacts"> |
|||
<Input v-model="form.contacts" /> |
|||
</FormItem> |
|||
</Col> |
|||
<Col span="12"> |
|||
<FormItem label="手机号" prop="mobile"> |
|||
<Input v-model="form.mobile" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="12"> |
|||
<FormItem label="商圈区域" prop="region"> |
|||
<region-tree-choose |
|||
@on-change="handleSelectRegion" |
|||
ref="regionTree" |
|||
></region-tree-choose> |
|||
</FormItem> |
|||
</Col> |
|||
<Col span="12"> |
|||
<FormItem label="返佣金额" prop="rebateAmount"> |
|||
<Input v-model="form.rebateAmount" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="12"> |
|||
<FormItem label="当次缴纳" prop="depoNum"> |
|||
<Input v-model="form.depoNum" /> |
|||
</FormItem> |
|||
</Col> |
|||
<Col span="12"> |
|||
<FormItem label="押金余额" prop="depoBal"> |
|||
<Input v-model="form.depoBal" :disabled="true"/> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="大巴收费标准说明"> |
|||
<Input type="textarea" v-model="form.remark" :rows="4" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
</Form> |
|||
</div> |
|||
<div class="drawer-footer br" v-show="type != '0'"> |
|||
<Button type="primary" :loading="submitLoading" @click="submit" |
|||
>提交</Button |
|||
> |
|||
<Button @click="visible = false">取消</Button> |
|||
</div> |
|||
</Drawer> |
|||
</div> |
|||
<div class="company-edit"> |
|||
<!-- Drawer抽屉 --> |
|||
<Drawer :title="title" v-model="visible" width="500" draggable :mask-closable="type == '0'"> |
|||
<div :style="{ maxHeight: maxHeight }" class="drawer-content"> |
|||
<div class="drawer-header"> |
|||
<div style="margin-right: 16px">优惠券配置</div> |
|||
</div> |
|||
<Form label-colon v-show="type != '2'"> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="优惠券名称"> |
|||
{{ form.companyName }} |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
</Form> |
|||
<Form ref="form" :model="form" :rules="formValidate" label-position="top"> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="优惠券名称" prop="companyName"> |
|||
<Input v-model="form.companyName" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="12"> |
|||
<FormItem label="库存" prop="companyTel"> |
|||
<Input v-model="form.companyTel" /> |
|||
</FormItem> |
|||
</Col> |
|||
<Col span="12"> |
|||
<FormItem label="适用范围" prop="companyAddress"> |
|||
<Select ref="dep" @on-change="checkStatus" clearable="true"> |
|||
<Option v-for="(item, i) in dictData" :key="i" :value="item.value">{{ |
|||
item.title |
|||
}}</Option> |
|||
</Select> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="优惠金额"> |
|||
<Input></Input> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="使用门槛"> |
|||
<RadioGroup v-model="menkan" vertical> |
|||
<Radio label="buxian">不限制</Radio> |
|||
<Radio label="manjian">满<Input style="width: 50px;"></Input>元可使用</Radio> |
|||
</RadioGroup> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="用户限制"> |
|||
<RadioGroup v-model="xianzhi" vertical> |
|||
<Radio label="meibangding">不限制</Radio> |
|||
<Radio label="bangding">绑定手机号用户</Radio> |
|||
</RadioGroup> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="有效期"> |
|||
<RadioGroup v-model="youxiao" vertical> |
|||
<Radio label="guding">固定日期</Radio> |
|||
<DatePicker v-if="youxiao == 'guding'" type="daterange" split-panels placeholder="选择起始时间" style="width: 200px"></DatePicker> |
|||
<Radio label="xianqi">领券后<Input style="width: 50px;"></Input>天有效</Radio> |
|||
</RadioGroup> |
|||
|
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="活动互斥选择"> |
|||
<Checkbox v-model="single">不与折扣同享</Checkbox> |
|||
<Checkbox v-model="single">不与满减活动同享</Checkbox> |
|||
<Checkbox v-model="single">不与满赠同享</Checkbox> |
|||
<Checkbox v-model="single">不与满额免配送费同享</Checkbox> |
|||
<Checkbox v-model="single">不与新用户立减活动同享</Checkbox> |
|||
<Checkbox v-model="single">不与配送费优惠活动同享</Checkbox> |
|||
<Checkbox v-model="single">不与会员/店铺红包券同享</Checkbox> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row :gutter="32"> |
|||
<Col span="24"> |
|||
<FormItem label="配送方式"> |
|||
<Checkbox v-model="single">平台配送</Checkbox> |
|||
<Checkbox v-model="single">商家配送</Checkbox> |
|||
<Checkbox v-model="single">到店自取</Checkbox> |
|||
<Checkbox v-model="single">到店消费</Checkbox> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
</Form> |
|||
</div> |
|||
<div class="drawer-footer br" v-show="type != '0'"> |
|||
<Button type="primary" :loading="submitLoading" @click="submit">提交</Button> |
|||
<Button @click="visible = false">取消</Button> |
|||
</div> |
|||
</Drawer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { addLogiticsCompany, editLogiticsCompany } from "@/api/app"; |
|||
import dict from "@/views/my-components/hiver/dict"; |
|||
import uploadPicInput from "@/views/my-components/hiver/upload-pic-input"; |
|||
import regionTreeChoose from "@/views/my-components/hiver/region-tree-choose"; |
|||
export default { |
|||
name: "company", |
|||
components: { |
|||
dict, |
|||
uploadPicInput, |
|||
regionTreeChoose |
|||
}, |
|||
props: { |
|||
value: { |
|||
type: Boolean, |
|||
default: false, |
|||
}, |
|||
data: { |
|||
type: Object, |
|||
}, |
|||
type: { |
|||
type: String, |
|||
default: "0", |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
roleList: [], |
|||
visible: this.value, |
|||
title: "", |
|||
data:[], |
|||
passColor: "", |
|||
submitLoading: false, |
|||
maxHeight: 510, |
|||
form: { |
|||
companyAddress: [], |
|||
companyStreet: '', |
|||
}, |
|||
formValidate: { |
|||
// 表单验证规则 |
|||
companyName: [ |
|||
{ required: true, message: "请输入大巴名称", trigger: "change" }, |
|||
], |
|||
contacts: [ |
|||
{ required: true, message: "请输入联系人", trigger: "change" }, |
|||
], |
|||
mobile: [ |
|||
{ required: true, message: "请输入手机号", trigger: "change" }, |
|||
], |
|||
}, |
|||
}; |
|||
}, |
|||
methods: { |
|||
init() { |
|||
import { |
|||
addLogiticsCompany, |
|||
editLogiticsCompany |
|||
} from "@/api/app"; |
|||
import dict from "@/views/my-components/hiver/dict"; |
|||
import uploadPicInput from "@/views/my-components/hiver/upload-pic-input"; |
|||
import regionTreeChoose from "@/views/my-components/hiver/region-tree-choose"; |
|||
export default { |
|||
name: "company", |
|||
components: { |
|||
dict, |
|||
uploadPicInput, |
|||
regionTreeChoose |
|||
}, |
|||
props: { |
|||
value: { |
|||
type: Boolean, |
|||
default: false, |
|||
}, |
|||
data: { |
|||
type: Object, |
|||
}, |
|||
type: { |
|||
type: String, |
|||
default: "0", |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
menkan:'', |
|||
xianzhi:'', |
|||
youxiao:'', |
|||
dictData: [{ |
|||
title: "全部", |
|||
value: "" |
|||
}, { |
|||
title: "配送", |
|||
value: 0 |
|||
}, { |
|||
title: "快递跑腿", |
|||
value: 1 |
|||
}, { |
|||
title: "拼团", |
|||
value: 2 |
|||
}], |
|||
roleList: [], |
|||
visible: this.value, |
|||
title: "", |
|||
data: [], |
|||
passColor: "", |
|||
submitLoading: false, |
|||
maxHeight: 510, |
|||
form: { |
|||
companyAddress: [], |
|||
companyStreet: '', |
|||
}, |
|||
formValidate: { |
|||
// 表单验证规则 |
|||
companyName: [{ |
|||
required: true, |
|||
message: "请输入优惠券名称", |
|||
trigger: "change" |
|||
}, ], |
|||
contacts: [{ |
|||
required: true, |
|||
message: "请输入联系人", |
|||
trigger: "change" |
|||
}, ], |
|||
mobile: [{ |
|||
required: true, |
|||
message: "请输入手机号", |
|||
trigger: "change" |
|||
}, ], |
|||
}, |
|||
}; |
|||
}, |
|||
methods: { |
|||
init() { |
|||
|
|||
}, |
|||
changePass(v, grade, strength) { |
|||
this.form.password = strength; |
|||
}, |
|||
submit() { |
|||
}, |
|||
changePass(v, grade, strength) { |
|||
this.form.password = strength; |
|||
}, |
|||
submit() { |
|||
|
|||
this.$refs.form.validate((valid) => { |
|||
if (valid) { |
|||
if (this.type == "1") { |
|||
// 编辑 |
|||
this.submitLoading = true; |
|||
editLogiticsCompany(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.$emit("on-submit", true); |
|||
this.visible = false; |
|||
} |
|||
}); |
|||
} else { |
|||
// 添加 |
|||
this.submitLoading = true; |
|||
addLogiticsCompany(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.$emit("on-submit", true); |
|||
this.visible = false; |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
handleSelectRegion(v) { |
|||
this.form.region = v; |
|||
}, |
|||
setCurrentValue(value) { |
|||
if (value === this.visible) { |
|||
return; |
|||
} |
|||
if (this.type == "1") { |
|||
this.title = "编辑大巴信息"; |
|||
this.maxHeight = |
|||
Number(document.documentElement.clientHeight - 121) + "px"; |
|||
} else if (this.type == "2") { |
|||
this.title = "添大巴"; |
|||
this.maxHeight = |
|||
Number(document.documentElement.clientHeight - 121) + "px"; |
|||
} else { |
|||
this.title = "大巴详情"; |
|||
this.maxHeight = "100%"; |
|||
} |
|||
// 清空数据 |
|||
this.$refs.form.resetFields(); |
|||
if (this.type == "0" || this.type == "1") { |
|||
// 回显数据 |
|||
let data = this.data; |
|||
// 地址 |
|||
if (data.companyAddress) { |
|||
data.companyAddress = data.companyAddress.split(","); |
|||
} else { |
|||
data.companyAddress = []; |
|||
} |
|||
// 商圈 |
|||
this.$refs.regionTree.setData(data.region, data.regionTitle); |
|||
// 回显 |
|||
this.form = data; |
|||
} else { |
|||
// 添加 |
|||
this.form = { |
|||
companyAddress: [], |
|||
signCompany: "5", |
|||
}; |
|||
} |
|||
this.visible = value; |
|||
}, |
|||
}, |
|||
watch: { |
|||
value(val) { |
|||
this.setCurrentValue(val); |
|||
}, |
|||
visible(value) { |
|||
this.$emit("input", value); |
|||
}, |
|||
}, |
|||
mounted() { |
|||
this.init(); |
|||
}, |
|||
}; |
|||
this.$refs.form.validate((valid) => { |
|||
if (valid) { |
|||
if (this.type == "1") { |
|||
// 编辑 |
|||
this.submitLoading = true; |
|||
editLogiticsCompany(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.$emit("on-submit", true); |
|||
this.visible = false; |
|||
} |
|||
}); |
|||
} else { |
|||
// 添加 |
|||
this.submitLoading = true; |
|||
addLogiticsCompany(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.$emit("on-submit", true); |
|||
this.visible = false; |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
handleSelectRegion(v) { |
|||
this.form.region = v; |
|||
}, |
|||
setCurrentValue(value) { |
|||
if (value === this.visible) { |
|||
return; |
|||
} |
|||
if (this.type == "1") { |
|||
this.title = "编辑优惠券信息"; |
|||
this.maxHeight = |
|||
Number(document.documentElement.clientHeight - 121) + "px"; |
|||
} else if (this.type == "2") { |
|||
this.title = "新增优惠券"; |
|||
this.maxHeight = |
|||
Number(document.documentElement.clientHeight - 121) + "px"; |
|||
} else { |
|||
this.title = "优惠券详情"; |
|||
this.maxHeight = "100%"; |
|||
} |
|||
// 清空数据 |
|||
this.$refs.form.resetFields(); |
|||
if (this.type == "0" || this.type == "1") { |
|||
// 回显数据 |
|||
let data = this.data; |
|||
// 地址 |
|||
if (data.companyAddress) { |
|||
data.companyAddress = data.companyAddress.split(","); |
|||
} else { |
|||
data.companyAddress = []; |
|||
} |
|||
// 商圈 |
|||
this.$refs.regionTree.setData(data.region, data.regionTitle); |
|||
// 回显 |
|||
this.form = data; |
|||
} else { |
|||
// 添加 |
|||
this.form = { |
|||
companyAddress: [], |
|||
signCompany: "5", |
|||
}; |
|||
} |
|||
this.visible = value; |
|||
}, |
|||
}, |
|||
watch: { |
|||
value(val) { |
|||
this.setCurrentValue(val); |
|||
}, |
|||
visible(value) { |
|||
this.$emit("input", value); |
|||
}, |
|||
}, |
|||
mounted() { |
|||
this.init(); |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="less"> |
|||
@import "@/styles/drawer-common.less"; |
|||
</style> |
|||
|
|||
@import "@/styles/drawer-common.less"; |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,164 @@ |
|||
<template> |
|||
<div class="search"> |
|||
<div class='waiceng' style="margin-top: 20px;"> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">核对编号：0005</div> |
|||
<div style="flex:1;padding-left:10px;">物流编号：12604030938</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">订单编号：126040314565364</div> |
|||
<div style="flex:1;padding-left:10px;">物流订单生成时间：2026-04-03 14:56:09</div> |
|||
</div> |
|||
</div> |
|||
<div class="title">商家信息</div> |
|||
<div class='waiceng'> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">名称：麽麽蜜呀（明珠早市馆西3号门）</div> |
|||
<div style="flex:1;padding-left:10px;">联系方式：13231710122</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">地址：河北省沧州市运河区明珠商贸城早市馆西3号门底商A2-1031</div> |
|||
<div style="flex:1;padding-left:10px;">发货时间：15:13</div> |
|||
</div> |
|||
</div> |
|||
<div class="title">用户信息</div> |
|||
<div class='waiceng'> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">鲁</div> |
|||
<div style="flex:1;padding-left:10px;">联系方式：15145128710</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">地址：明珠国际商贸城早市馆5楼北天井3道进来思羽家</div> |
|||
<div style="flex:1;padding-left:10px;">要求送达时间：15:21</div> |
|||
</div> |
|||
</div> |
|||
<div class="title">商品信息</div> |
|||
<div class='waiceng' style="text-align: center;"> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">商品名称</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">规格</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">数量</div> |
|||
<div style="flex:1;padding-left:10px;">总价</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">百香多芒</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">少冰+正常糖</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">1</div> |
|||
<div style="flex:1;padding-left:10px;">¥7.00</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">超级百香果</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">少冰+正常糖</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">1</div> |
|||
<div style="flex:1;padding-left:10px;">¥14.00</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">餐盒费</div> |
|||
<div style="width:25%;padding-left:10px;">¥0.00</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">配送费</div> |
|||
<div style="width:25%;padding-left:10px;">¥1.50</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">总计</div> |
|||
<div style="width:25%;padding-left:10px;">¥1.50</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">抵用券金额</div> |
|||
<div style="width:25%;padding-left:10px;">¥1.50</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">活动优惠金额</div> |
|||
<div style="width:25%;padding-left:10px;">¥1.50</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">实付金额</div> |
|||
<div style="width:25%;padding-left:10px;">¥1.50</div> |
|||
</div> |
|||
</div> |
|||
<div class="title">配送流程</div> |
|||
<div class='waiceng' style="text-align: center;"> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">状态</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">时间</div> |
|||
<div style="flex:1;padding-left:10px;">角色</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">用户下单</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">2026-04-03 14:56:09</div> |
|||
<div style="flex:1;padding-left:10px;"></div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">商家接单</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">2026-04-03 14:56:09</div> |
|||
<div style="flex:1;padding-left:10px;">麽麽蜜呀</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">配送员接单</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">2026-04-03 14:56:09</div> |
|||
<div style="flex:1;padding-left:10px;">张宝芹</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">已到店</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">2026-04-03 14:56:09</div> |
|||
<div style="flex:1;padding-left:10px;">张宝芹</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">配送员已取货</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">2026-04-03 14:56:09</div> |
|||
<div style="flex:1;padding-left:10px;">张宝芹</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">配送员已送达</div> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">2026-04-03 14:56:09</div> |
|||
<div style="flex:1;padding-left:10px;">张宝芹</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">送单时长</div> |
|||
<div style="width: 33%;padding-left:10px;">23分钟</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">订单总计时</div> |
|||
<div style="width: 33%;padding-left:10px;">0时23分</div> |
|||
</div> |
|||
<div class="nei1"> |
|||
<div style="flex:1;padding-left:10px;border-right:1px solid #eee;">超时</div> |
|||
<div style="width: 33%;padding-left:10px;">--</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "logisticsAddress", |
|||
data() { |
|||
return { |
|||
orderData:{} |
|||
}; |
|||
}, |
|||
methods: { |
|||
initRecharge(data) { |
|||
//data是父组件弹窗传递过来的值，我们可以打印看看 |
|||
console.log(data); |
|||
this.orderData = data |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style lang="less"> |
|||
//@import "@/styles/table-common.less"; |
|||
.nei1{ |
|||
display: flex; |
|||
border:1px solid #eee; |
|||
height: 30px; |
|||
line-height: 30px; |
|||
} |
|||
.title{ |
|||
height: 40px; |
|||
line-height: 40px; |
|||
font-size: 14px; |
|||
font-weight: 700; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,166 @@ |
|||
<template> |
|||
<div class="search"> |
|||
<div style="display: flex;"> |
|||
<div class="waiceng"> |
|||
<div class="title">订单信息</div> |
|||
<div>订单编号：{{orderData.numberCode}}</div> |
|||
<div>支付订单编号：{{'ORDER'+orderData.id}}</div> |
|||
</div> |
|||
<div class="waiceng"> |
|||
<div class="title">用户信息</div> |
|||
<div>收货人：<span class="blue-color">{{orderData.receiverName}}</span></div> |
|||
<div>收货电话：<span class="blue-color">{{orderData.receiverPhone}}</span></div> |
|||
<div>收货地址：<span class="blue-color">{{orderData.receiverAddress}}</span></div> |
|||
<div>要求送达时间：<span class="blue-color">？？2026/04/07 09:31:00</span></div> |
|||
</div> |
|||
<div class="waiceng"> |
|||
<div class="title">店铺信息</div> |
|||
<div>店铺名称：<span class="blue-color">{{orderData.shopName}}</span></div> |
|||
<div>店铺电话：<span class="blue-color">{{orderData.shopPhone}}</span></div> |
|||
<div>配送方式： <span class="blue-color">{{orderData.deliveryType == 1?'配送':'不配送'}}</span></div> |
|||
</div> |
|||
<div class="waiceng"> |
|||
<div class="title">其他信息</div> |
|||
<div>配送员：<span class="blue-color">张宝芹</span></div> |
|||
<div>配送员电话：<span class="blue-color">15832720108</span></div> |
|||
<div>备注：<span class="blue-color">{{orderData.remark}}</span></div> |
|||
</div> |
|||
</div> |
|||
<div style="display: flex;"> |
|||
<div class="waiceng" style="width: 70%;"> |
|||
<div class="title">商品信息</div> |
|||
<div class="box" v-for="(item,index) in orderData.goodsList" :key="index"> |
|||
<div style="flex:1;">{{item.productName}}</div> |
|||
<div class="price"> X{{item.quantity}}</div> |
|||
<div class="price">¥{{item.price}}</div> |
|||
</div> |
|||
<div class="box"> |
|||
<div style="flex:1;">餐盒费</div> |
|||
<div class="price">¥{{orderData.packageFee}}</div> |
|||
</div> |
|||
<div class="box"> |
|||
<div style="flex:1;">配送费</div> |
|||
<div class="price">¥{{orderData.deliveryFee}}</div> |
|||
</div> |
|||
<div class="zong">活动优惠：<span style="color:red;">¥0</span> 下单返佣：<span style="color:red;">¥0</span> |
|||
合计：<span style="color:#11cd6e;">¥{{orderData.totalAmount}}</span></div> |
|||
<div class="zong">流水金额：<span class="blue-color">¥24</span> </div> |
|||
<div class="zong">商家预计收入：<span class="blue-color">¥20.16</span> </div> |
|||
</div> |
|||
<div class="waiceng" style="width: 30%;background: #eee;padding: 0;"> |
|||
<div style="background: #fff;padding: 10px;margin-bottom: 10px;border-radius: 10px;"> |
|||
<div class="title">物流信息</div> |
|||
<div class="text">用户提交订单时间：{{orderData.createTime | formatDateTime }}</div> |
|||
<div class="text">用户完成支付时间：2026/04/07 09:06:41</div> |
|||
<div class="text">商家接单时间：2026/04/07 09:06:41</div> |
|||
<div class="text">配送员已接单：2026/04/07 09:06:44</div> |
|||
</div> |
|||
<div style="background: #fff;padding: 10px;border-radius: 10px;"> |
|||
<div class="title">运营订单备注</div> |
|||
<textarea name="" id="" cols="30" rows="10" style="width: 100%;border: 1px solid #eee;"></textarea> |
|||
<div class='btn' @tap="returnOrder">退款</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
returnOrder, |
|||
} from "@/api/index"; |
|||
export default { |
|||
name: "logisticsAddress", |
|||
data() { |
|||
return { |
|||
orderData: {} |
|||
}; |
|||
}, |
|||
filters: { |
|||
formatDateTime(isoString) { |
|||
if (!isoString) return '' |
|||
const date = new Date(isoString) |
|||
const year = date.getFullYear() |
|||
const month = String(date.getMonth() + 1).padStart(2, '0') |
|||
const day = String(date.getDate()).padStart(2, '0') |
|||
const hours = String(date.getHours()).padStart(2, '0') |
|||
const minutes = String(date.getMinutes()).padStart(2, '0') |
|||
const seconds = String(date.getSeconds()).padStart(2, '0') |
|||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}` |
|||
} |
|||
}, |
|||
methods: { |
|||
initRecharge(data) { |
|||
console.log('111112222', data); |
|||
this.orderData = data |
|||
}, |
|||
returnOrder(){ |
|||
returnOrder({ |
|||
orderId:orderData.id, |
|||
userId:orderData.userId |
|||
}).then((res) => { |
|||
this.loading = false; |
|||
if (res.success) { |
|||
this.$Message.success("取消订单成功"); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style lang="less"> |
|||
.search { |
|||
background: #eee; |
|||
} |
|||
|
|||
.title { |
|||
font-weight: 700; |
|||
font-size: 15px; |
|||
} |
|||
|
|||
.waiceng { |
|||
background: #fff; |
|||
border-radius: 10px; |
|||
margin: 5px; |
|||
padding: 10px; |
|||
} |
|||
|
|||
.btn { |
|||
width: 75px; |
|||
height: 30px; |
|||
background: #4487fe; |
|||
font-size: 14px; |
|||
color: #fff; |
|||
border-radius: 7px; |
|||
text-align: center; |
|||
line-height: 30px; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
.zong { |
|||
text-align: right; |
|||
height: 40px; |
|||
line-height: 40px; |
|||
} |
|||
|
|||
.box { |
|||
display: flex; |
|||
border-bottom: 1px solid #eee; |
|||
line-height: 30px; |
|||
height: 30px px; |
|||
} |
|||
|
|||
.text { |
|||
font-weight: bold; |
|||
color: #777; |
|||
} |
|||
|
|||
.price { |
|||
flex: 1; |
|||
text-align: right |
|||
} |
|||
|
|||
.blue-color { |
|||
color: #056dae; |
|||
} |
|||
</style> |
|||
@ -1,356 +1,311 @@ |
|||
<template> |
|||
<div class="search"> |
|||
<Card> |
|||
<Row v-show="openSearch" @keydown.enter.native="handleSearch"> |
|||
<Form ref="searchForm" :model="searchForm" inline :label-width="70"> |
|||
<FormItem label="充值编号" prop="rechargeId"> |
|||
<Input |
|||
type="text" |
|||
v-model="searchForm.name" |
|||
placeholder="请输入充值编号" |
|||
clearable |
|||
style="width: 200px" |
|||
/> |
|||
</FormItem> |
|||
<FormItem label="被充值人名称" prop="rechargeName"> |
|||
<Input |
|||
type="text" |
|||
v-model="searchForm.rechargeName" |
|||
placeholder="被充值人名称" |
|||
clearable |
|||
style="width: 200px" |
|||
/> |
|||
</FormItem> |
|||
<span v-if="drop"> |
|||
<FormItem label="被充值人编号" prop="rechargeWorkerId"> |
|||
<dict dict="workerStatus" v-model="searchForm.workerStatus" style="width: 200px" /> |
|||
</FormItem> |
|||
<FormItem label="充值时间"> |
|||
<DatePicker |
|||
:options="options" |
|||
v-model="selectDate" |
|||
type="daterange" |
|||
format="yyyy-MM-dd" |
|||
clearable |
|||
@on-change="selectDateRange" |
|||
placeholder="选择起始时间" |
|||
style="width: 200px" |
|||
></DatePicker> |
|||
</FormItem> |
|||
</span> |
|||
<FormItem style="margin-left: -35px" class="br"> |
|||
<Button @click="handleSearch" type="primary" icon="ios-search" |
|||
>搜索</Button |
|||
> |
|||
<Button @click="handleReset">重置</Button> |
|||
</FormItem> |
|||
</Form> |
|||
</Row> |
|||
<Row align="middle" justify="space-between" class="operation"> |
|||
<div class="icons"> |
|||
<Tooltip content="刷新" placement="top" transfer> |
|||
<Icon |
|||
type="md-refresh" |
|||
size="18" |
|||
class="item" |
|||
@click="getDataList" |
|||
/> |
|||
</Tooltip> |
|||
<Tooltip |
|||
:content="openSearch ? '关闭搜索' : '开启搜索'" |
|||
placement="top" |
|||
transfer |
|||
> |
|||
<Icon |
|||
type="ios-search" |
|||
size="18" |
|||
class="item tip" |
|||
@click="openSearch = !openSearch" |
|||
/> |
|||
</Tooltip> |
|||
<Tooltip |
|||
:content="openTip ? '关闭提示' : '开启提示'" |
|||
placement="top" |
|||
transfer |
|||
> |
|||
<Icon |
|||
type="md-bulb" |
|||
size="18" |
|||
class="item tip" |
|||
@click="openTip = !openTip" |
|||
/> |
|||
</Tooltip> |
|||
<Tooltip content="表格密度" placement="top" transfer> |
|||
<Dropdown @on-click="changeTableSize" trigger="click"> |
|||
<Icon type="md-list" size="18" class="item" /> |
|||
<DropdownMenu slot="list"> |
|||
<DropdownItem :selected="tableSize == 'default'" name="default" |
|||
>默认</DropdownItem |
|||
> |
|||
<DropdownItem :selected="tableSize == 'large'" name="large" |
|||
>宽松</DropdownItem |
|||
> |
|||
<DropdownItem :selected="tableSize == 'small'" name="small" |
|||
>紧密</DropdownItem |
|||
> |
|||
</DropdownMenu> |
|||
</Dropdown> |
|||
</Tooltip> |
|||
<Tooltip content="导出数据" placement="top" transfer> |
|||
<Icon |
|||
type="md-download" |
|||
size="18" |
|||
class="item" |
|||
@click="exportData" |
|||
/> |
|||
</Tooltip> |
|||
</div> |
|||
</Row> |
|||
<Alert show-icon v-show="openTip"> |
|||
已选择 |
|||
<span class="select-count">{{ selectList.length }}</span> 项 |
|||
<a class="select-clear" @click="clearSelectAll">清空</a> |
|||
</Alert> |
|||
<Table |
|||
:loading="loading" |
|||
border |
|||
:columns="columns" |
|||
:data="data" |
|||
:size="tableSize" |
|||
ref="table" |
|||
sortable="custom" |
|||
@on-sort-change="changeSort" |
|||
@on-selection-change="changeSelect" |
|||
></Table> |
|||
<Row type="flex" justify="end" class="page"> |
|||
<Page |
|||
:current="searchForm.pageNumber" |
|||
:total="total" |
|||
:page-size="searchForm.pageSize" |
|||
@on-change="changePage" |
|||
@on-page-size-change="changePageSize" |
|||
:page-size-opts="[10, 20, 50]" |
|||
size="small" |
|||
show-total |
|||
show-elevator |
|||
show-sizer |
|||
></Page> |
|||
</Row> |
|||
</Card> |
|||
</div> |
|||
<div class="search"> |
|||
<Card> |
|||
<Row v-show="openSearch" @keydown.enter.native="handleSearch"> |
|||
<Form ref="searchForm" :model="searchForm" inline :label-width="70"> |
|||
<FormItem label="商家名" prop="rechargeId"> |
|||
<Input type="text" v-model="searchForm.name" placeholder="请输入商家名" clearable |
|||
style="width: 200px" /> |
|||
</FormItem> |
|||
<FormItem label="状态" prop="rechargeName"> |
|||
<Input type="text" v-model="searchForm.rechargeName" placeholder="状态" clearable |
|||
style="width: 200px" /> |
|||
</FormItem> |
|||
<FormItem style="margin-left: -35px" class="br"> |
|||
<Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button> |
|||
<Button @click="handleReset">重置</Button> |
|||
</FormItem> |
|||
</Form> |
|||
</Row> |
|||
<Row align="middle" justify="space-between" class="operation"> |
|||
<div class="icons"> |
|||
<Tooltip content="刷新" placement="top" transfer> |
|||
<Icon type="md-refresh" size="18" class="item" @click="getDataList" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openSearch ? '关闭搜索' : '开启搜索'" placement="top" transfer> |
|||
<Icon type="ios-search" size="18" class="item tip" @click="openSearch = !openSearch" /> |
|||
</Tooltip> |
|||
<Tooltip :content="openTip ? '关闭提示' : '开启提示'" placement="top" transfer> |
|||
<Icon type="md-bulb" size="18" class="item tip" @click="openTip = !openTip" /> |
|||
</Tooltip> |
|||
<Tooltip content="表格密度" placement="top" transfer> |
|||
<Dropdown @on-click="changeTableSize" trigger="click"> |
|||
<Icon type="md-list" size="18" class="item" /> |
|||
<DropdownMenu slot="list"> |
|||
<DropdownItem :selected="tableSize == 'default'" name="default">默认</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'large'" name="large">宽松</DropdownItem> |
|||
<DropdownItem :selected="tableSize == 'small'" name="small">紧密</DropdownItem> |
|||
</DropdownMenu> |
|||
</Dropdown> |
|||
</Tooltip> |
|||
</div> |
|||
</Row> |
|||
<Alert show-icon v-show="openTip"> |
|||
已选择 |
|||
<span class="select-count">{{ selectList.length }}</span> 项 |
|||
<a class="select-clear" @click="clearSelectAll">清空</a> |
|||
</Alert> |
|||
<Table :loading="loading" border :columns="columns" :data="data" :size="tableSize" ref="table" |
|||
sortable="custom" @on-sort-change="changeSort" @on-selection-change="changeSelect"></Table> |
|||
<Row type="flex" justify="end" class="page"> |
|||
<Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" |
|||
@on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" |
|||
size="small" show-total show-elevator show-sizer></Page> |
|||
</Row> |
|||
</Card> |
|||
<!-- 订单详情 --> |
|||
<Modal :title="订单详情" v-model="Visiable" :mask-closable="false" :scrollabele="true" :width="1000"> |
|||
<logistics-address v-if="Visiable" ref="dialog"></logistics-address> |
|||
<div slot="footer" v-show="Visiable"> |
|||
<Button type="text" @click="Visiable = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
getWorkerRechargeRecord |
|||
} from "@/api/index"; |
|||
import uploadPicInput from "@/views/my-components/hiver/upload-pic-input"; |
|||
import { shortcuts } from "@/libs/shortcuts"; |
|||
export default { |
|||
name: "recharge", |
|||
components: { |
|||
uploadPicInput, |
|||
}, |
|||
data() { |
|||
return { |
|||
tableSize: "default", |
|||
openSearch: true, // 显示搜索 |
|||
openTip: true, // 显示提示 |
|||
loading: true, // 表单加载状态 |
|||
modalType: 0, // 添加或编辑标识 |
|||
modalVisible: false, // 添加或编辑显示 |
|||
modalTitle: "", // 添加或编辑标题 |
|||
searchForm: { |
|||
// 搜索框初始化对象 |
|||
pageNumber: 1, // 当前页数 |
|||
pageSize: 10, // 页面大小 |
|||
sort: "createTime", // 默认排序字段 |
|||
order: "desc", // 默认排序方式 |
|||
startDate: "", // 起始时间 |
|||
endDate: "", // 终止时间 |
|||
}, |
|||
selectDate: null, |
|||
options: { |
|||
shortcuts: shortcuts, |
|||
}, |
|||
form: { |
|||
// 添加或编辑表单对象初始化数据 |
|||
name: "", |
|||
logo: "", |
|||
clientSecret: "", |
|||
homeUri: "", |
|||
redirectUri: "", |
|||
autoApprove: false, |
|||
}, |
|||
submitLoading: false, // 添加或编辑提交状态 |
|||
selectList: [], // 多选数据 |
|||
columns: [ |
|||
{ |
|||
type: "selection", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
type: "index", |
|||
width: 60, |
|||
align: "center", |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "充值编号", |
|||
key: "rechargeId", |
|||
minWidth: 125, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "被充值人名称", |
|||
key: "rechargeName", |
|||
minWidth: 125, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "被充值人编号", |
|||
key: "rechargeWorkerId", |
|||
minWidth: 125, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "充值金额", |
|||
key: "rechargeNum", |
|||
minWidth: 125, |
|||
sortable: true, |
|||
fixed: "left", |
|||
}, |
|||
{ |
|||
title: "充值时间", |
|||
key: "createTime", |
|||
width: 170, |
|||
sortable: true, |
|||
sortType: "desc", |
|||
}, |
|||
], |
|||
data: [], // 表单数据 |
|||
total: 0, // 表单数据总数 |
|||
rechargeWorkerId: "", |
|||
}; |
|||
}, |
|||
methods: { |
|||
init() { |
|||
this.getDataList(); |
|||
}, |
|||
changePage(v) { |
|||
this.searchForm.pageNumber = v; |
|||
this.getDataList(); |
|||
this.clearSelectAll(); |
|||
}, |
|||
changePageSize(v) { |
|||
this.searchForm.pageSize = v; |
|||
this.getDataList(); |
|||
}, |
|||
handleSearch() { |
|||
this.searchForm.pageNumber = 1; |
|||
this.searchForm.pageSize = 10; |
|||
this.getDataList(); |
|||
}, |
|||
handleReset() { |
|||
this.$refs.searchForm.resetFields(); |
|||
this.searchForm.pageNumber = 1; |
|||
this.searchForm.pageSize = 10; |
|||
this.selectDate = null; |
|||
this.searchForm.startDate = ""; |
|||
this.searchForm.endDate = ""; |
|||
// 重新加载数据 |
|||
this.getDataList(); |
|||
}, |
|||
changeSort(e) { |
|||
this.searchForm.sort = e.key; |
|||
this.searchForm.order = e.order; |
|||
if (e.order === "normal") { |
|||
this.searchForm.order = ""; |
|||
} |
|||
this.getDataList(); |
|||
}, |
|||
clearSelectAll() { |
|||
this.$refs.table.selectAll(false); |
|||
}, |
|||
changeSelect(e) { |
|||
this.selectList = e; |
|||
}, |
|||
selectDateRange(v) { |
|||
if (v) { |
|||
this.searchForm.startDate = v[0]; |
|||
this.searchForm.endDate = v[1]; |
|||
} |
|||
}, |
|||
changeTableSize(v) { |
|||
this.tableSize = v; |
|||
}, |
|||
exportData() { |
|||
this.$refs.table.exportCsv({ |
|||
filename: "数据", |
|||
}); |
|||
}, |
|||
generateSecret() { |
|||
getSecretKey().then((res) => { |
|||
if (res.success) { |
|||
this.form.clientSecret = res.result; |
|||
} |
|||
}); |
|||
}, |
|||
getDataList() { |
|||
this.loading = true; |
|||
// 带多条件搜索参数获取表单数据 请自行修改接口 |
|||
getWorkerRechargeRecord(this.rechargeWorkerId).then((res) => { |
|||
this.loading = false; |
|||
if (res.success) { |
|||
this.data = res.result.content; |
|||
this.total = res.result.totalElements; |
|||
if (this.data.length == 0 && this.searchForm.pageNumber > 1) { |
|||
this.searchForm.pageNumber -= 1; |
|||
this.getDataList(); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
handleSubmit() { |
|||
this.$refs.form.validate((valid) => { |
|||
if (valid) { |
|||
this.submitLoading = true; |
|||
if (this.modalType === 0) { |
|||
// 添加 避免编辑后传入id等数据 记得删除 |
|||
delete this.form.id; |
|||
addClient(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.getDataList(); |
|||
this.modalVisible = false; |
|||
} |
|||
}); |
|||
} else { |
|||
// 编辑 |
|||
updateClient(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.getDataList(); |
|||
this.modalVisible = false; |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
}, |
|||
mounted() { |
|||
this.init(); |
|||
}, |
|||
}; |
|||
import { |
|||
getWorkerRechargeRecord |
|||
} from "@/api/index"; |
|||
import uploadPicInput from "@/views/my-components/hiver/upload-pic-input"; |
|||
import { |
|||
shortcuts |
|||
} from "@/libs/shortcuts"; |
|||
import logisticsAddress from "@/views/sys/order-manage/logisticsAddress"; |
|||
export default { |
|||
name: "recharge", |
|||
components: { |
|||
uploadPicInput, |
|||
logisticsAddress, |
|||
}, |
|||
data() { |
|||
return { |
|||
Visiable: false, |
|||
tableSize: "default", |
|||
openSearch: true, // 显示搜索 |
|||
openTip: true, // 显示提示 |
|||
loading: true, // 表单加载状态 |
|||
modalType: 0, // 添加或编辑标识 |
|||
modalVisible: false, // 添加或编辑显示 |
|||
modalTitle: "", // 添加或编辑标题 |
|||
searchForm: { |
|||
// 搜索框初始化对象 |
|||
pageNumber: 1, // 当前页数 |
|||
pageSize: 10, // 页面大小 |
|||
sort: "createTime", // 默认排序字段 |
|||
order: "desc", // 默认排序方式 |
|||
startDate: "", // 起始时间 |
|||
endDate: "", // 终止时间 |
|||
}, |
|||
selectDate: null, |
|||
options: { |
|||
shortcuts: shortcuts, |
|||
}, |
|||
form: { |
|||
// 添加或编辑表单对象初始化数据 |
|||
name: "", |
|||
logo: "", |
|||
clientSecret: "", |
|||
homeUri: "", |
|||
redirectUri: "", |
|||
autoApprove: false, |
|||
}, |
|||
submitLoading: false, // 添加或编辑提交状态 |
|||
selectList: [], // 多选数据 |
|||
columns: [{ |
|||
type: "index", |
|||
width: 60, |
|||
align: "center", |
|||
}, |
|||
{ |
|||
title: "拼团编号", |
|||
key: "rechargeId", |
|||
align: "center", |
|||
}, |
|||
{ |
|||
title: "商家名", |
|||
key: "rechargeName", |
|||
align: "center", |
|||
}, |
|||
{ |
|||
title: "成团时间", |
|||
key: "rechargeWorkerId", |
|||
align: "center", |
|||
}, |
|||
{ |
|||
title: "几人团", |
|||
key: "rechargeNum", |
|||
align: "center", |
|||
}, |
|||
{ |
|||
title: "状态", |
|||
key: "createTime", |
|||
align: "center", |
|||
}, |
|||
{ |
|||
title: "操作", |
|||
key: "action", |
|||
width: 200, |
|||
align: "center", |
|||
fixed: "right", |
|||
render: (h, params) => { |
|||
return h("div", [ |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.edit(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"查看详情" |
|||
), |
|||
h("Divider", { |
|||
props: { |
|||
type: "vertical", |
|||
}, |
|||
}), |
|||
h( |
|||
"a", { |
|||
on: { |
|||
click: () => { |
|||
this.edit(params.row); |
|||
}, |
|||
}, |
|||
}, |
|||
"查看订单" |
|||
), |
|||
]); |
|||
}, |
|||
}, |
|||
], |
|||
data: [], // 表单数据 |
|||
total: 0, // 表单数据总数 |
|||
rechargeWorkerId: "", |
|||
}; |
|||
}, |
|||
methods: { |
|||
init() { |
|||
this.getDataList(); |
|||
}, |
|||
changePage(v) { |
|||
this.searchForm.pageNumber = v; |
|||
this.getDataList(); |
|||
this.clearSelectAll(); |
|||
}, |
|||
edit(v){ |
|||
|
|||
this.Visiable = true; |
|||
}, |
|||
changePageSize(v) { |
|||
this.searchForm.pageSize = v; |
|||
this.getDataList(); |
|||
}, |
|||
handleSearch() { |
|||
this.searchForm.pageNumber = 1; |
|||
this.searchForm.pageSize = 10; |
|||
this.getDataList(); |
|||
}, |
|||
handleReset() { |
|||
this.$refs.searchForm.resetFields(); |
|||
this.searchForm.pageNumber = 1; |
|||
this.searchForm.pageSize = 10; |
|||
this.selectDate = null; |
|||
this.searchForm.startDate = ""; |
|||
this.searchForm.endDate = ""; |
|||
// 重新加载数据 |
|||
this.getDataList(); |
|||
}, |
|||
changeSort(e) { |
|||
this.searchForm.sort = e.key; |
|||
this.searchForm.order = e.order; |
|||
if (e.order === "normal") { |
|||
this.searchForm.order = ""; |
|||
} |
|||
this.getDataList(); |
|||
}, |
|||
clearSelectAll() { |
|||
this.$refs.table.selectAll(false); |
|||
}, |
|||
changeSelect(e) { |
|||
this.selectList = e; |
|||
}, |
|||
selectDateRange(v) { |
|||
if (v) { |
|||
this.searchForm.startDate = v[0]; |
|||
this.searchForm.endDate = v[1]; |
|||
} |
|||
}, |
|||
changeTableSize(v) { |
|||
this.tableSize = v; |
|||
}, |
|||
exportData() { |
|||
this.$refs.table.exportCsv({ |
|||
filename: "数据", |
|||
}); |
|||
}, |
|||
generateSecret() { |
|||
getSecretKey().then((res) => { |
|||
if (res.success) { |
|||
this.form.clientSecret = res.result; |
|||
} |
|||
}); |
|||
}, |
|||
getDataList() { |
|||
this.loading = true; |
|||
// 带多条件搜索参数获取表单数据 请自行修改接口 |
|||
getWorkerRechargeRecord(this.rechargeWorkerId).then((res) => { |
|||
this.loading = false; |
|||
if (res.success) { |
|||
this.data = res.result.content; |
|||
this.total = res.result.totalElements; |
|||
if (this.data.length == 0 && this.searchForm.pageNumber > 1) { |
|||
this.searchForm.pageNumber -= 1; |
|||
this.getDataList(); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
handleSubmit() { |
|||
this.$refs.form.validate((valid) => { |
|||
if (valid) { |
|||
this.submitLoading = true; |
|||
if (this.modalType === 0) { |
|||
// 添加 避免编辑后传入id等数据 记得删除 |
|||
delete this.form.id; |
|||
addClient(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.getDataList(); |
|||
this.modalVisible = false; |
|||
} |
|||
}); |
|||
} else { |
|||
// 编辑 |
|||
updateClient(this.form).then((res) => { |
|||
this.submitLoading = false; |
|||
if (res.success) { |
|||
this.$Message.success("操作成功"); |
|||
this.getDataList(); |
|||
this.modalVisible = false; |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
}, |
|||
mounted() { |
|||
this.init(); |
|||
}, |
|||
}; |
|||
</script> |
|||
<style lang="less"> |
|||
@import "@/styles/table-common.less"; |
|||
@import "@/styles/table-common.less"; |
|||
</style> |
|||
@ -0,0 +1,166 @@ |
|||
<template> |
|||
<div class="search"> |
|||
<div style="display: flex;"> |
|||
<div class="waiceng"> |
|||
<div class="title">订单信息</div> |
|||
<div>订单编号：{{orderData.numberCode}}</div> |
|||
<div>支付订单编号：{{'ORDER'+orderData.id}}</div> |
|||
</div> |
|||
<div class="waiceng"> |
|||
<div class="title">用户信息</div> |
|||
<div>收货人：<span class="blue-color">{{orderData.receiverName}}</span></div> |
|||
<div>收货电话：<span class="blue-color">{{orderData.receiverPhone}}</span></div> |
|||
<div>收货地址：<span class="blue-color">{{orderData.receiverAddress}}</span></div> |
|||
<div>要求送达时间：<span class="blue-color">？？2026/04/07 09:31:00</span></div> |
|||
</div> |
|||
<div class="waiceng"> |
|||
<div class="title">店铺信息</div> |
|||
<div>店铺名称：<span class="blue-color">{{orderData.shopName}}</span></div> |
|||
<div>店铺电话：<span class="blue-color">{{orderData.shopPhone}}</span></div> |
|||
<div>配送方式： <span class="blue-color">{{orderData.deliveryType == 1?'配送':'不配送'}}</span></div> |
|||
</div> |
|||
<div class="waiceng"> |
|||
<div class="title">其他信息</div> |
|||
<div>配送员：<span class="blue-color">张宝芹</span></div> |
|||
<div>配送员电话：<span class="blue-color">15832720108</span></div> |
|||
<div>备注：<span class="blue-color">{{orderData.remark}}</span></div> |
|||
</div> |
|||
</div> |
|||
<div style="display: flex;"> |
|||
<div class="waiceng" style="width: 70%;"> |
|||
<div class="title">商品信息</div> |
|||
<div class="box" v-for="(item,index) in orderData.goodsList" :key="index"> |
|||
<div style="flex:1;">{{item.productName}}</div> |
|||
<div class="price"> X{{item.quantity}}</div> |
|||
<div class="price">¥{{item.price}}</div> |
|||
</div> |
|||
<div class="box"> |
|||
<div style="flex:1;">餐盒费</div> |
|||
<div class="price">¥{{orderData.packageFee}}</div> |
|||
</div> |
|||
<div class="box"> |
|||
<div style="flex:1;">配送费</div> |
|||
<div class="price">¥{{orderData.deliveryFee}}</div> |
|||
</div> |
|||
<div class="zong">活动优惠：<span style="color:red;">¥0</span> 下单返佣：<span style="color:red;">¥0</span> |
|||
合计：<span style="color:#11cd6e;">¥{{orderData.totalAmount}}</span></div> |
|||
<div class="zong">流水金额：<span class="blue-color">¥24</span> </div> |
|||
<div class="zong">商家预计收入：<span class="blue-color">¥20.16</span> </div> |
|||
</div> |
|||
<div class="waiceng" style="width: 30%;background: #eee;padding: 0;"> |
|||
<div style="background: #fff;padding: 10px;margin-bottom: 10px;border-radius: 10px;"> |
|||
<div class="title">物流信息</div> |
|||
<div class="text">用户提交订单时间：{{orderData.createTime | formatDateTime }}</div> |
|||
<div class="text">用户完成支付时间：2026/04/07 09:06:41</div> |
|||
<div class="text">商家接单时间：2026/04/07 09:06:41</div> |
|||
<div class="text">配送员已接单：2026/04/07 09:06:44</div> |
|||
</div> |
|||
<div style="background: #fff;padding: 10px;border-radius: 10px;"> |
|||
<div class="title">运营订单备注</div> |
|||
<textarea name="" id="" cols="30" rows="10" style="width: 100%;border: 1px solid #eee;"></textarea> |
|||
<div class='btn' @tap="returnOrder">退款</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
returnOrder, |
|||
} from "@/api/index"; |
|||
export default { |
|||
name: "logisticsAddress", |
|||
data() { |
|||
return { |
|||
orderData: {} |
|||
}; |
|||
}, |
|||
filters: { |
|||
formatDateTime(isoString) { |
|||
if (!isoString) return '' |
|||
const date = new Date(isoString) |
|||
const year = date.getFullYear() |
|||
const month = String(date.getMonth() + 1).padStart(2, '0') |
|||
const day = String(date.getDate()).padStart(2, '0') |
|||
const hours = String(date.getHours()).padStart(2, '0') |
|||
const minutes = String(date.getMinutes()).padStart(2, '0') |
|||
const seconds = String(date.getSeconds()).padStart(2, '0') |
|||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}` |
|||
} |
|||
}, |
|||
methods: { |
|||
initRecharge(data) { |
|||
console.log('111112222', data); |
|||
this.orderData = data |
|||
}, |
|||
returnOrder(){ |
|||
returnOrder({ |
|||
orderId:orderData.id, |
|||
userId:orderData.userId |
|||
}).then((res) => { |
|||
this.loading = false; |
|||
if (res.success) { |
|||
this.$Message.success("取消订单成功"); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style lang="less"> |
|||
.search { |
|||
background: #eee; |
|||
} |
|||
|
|||
.title { |
|||
font-weight: 700; |
|||
font-size: 15px; |
|||
} |
|||
|
|||
.waiceng { |
|||
background: #fff; |
|||
border-radius: 10px; |
|||
margin: 5px; |
|||
padding: 10px; |
|||
} |
|||
|
|||
.btn { |
|||
width: 75px; |
|||
height: 30px; |
|||
background: #4487fe; |
|||
font-size: 14px; |
|||
color: #fff; |
|||
border-radius: 7px; |
|||
text-align: center; |
|||
line-height: 30px; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
.zong { |
|||
text-align: right; |
|||
height: 40px; |
|||
line-height: 40px; |
|||
} |
|||
|
|||
.box { |
|||
display: flex; |
|||
border-bottom: 1px solid #eee; |
|||
line-height: 30px; |
|||
height: 30px px; |
|||
} |
|||
|
|||
.text { |
|||
font-weight: bold; |
|||
color: #777; |
|||
} |
|||
|
|||
.price { |
|||
flex: 1; |
|||
text-align: right |
|||
} |
|||
|
|||
.blue-color { |
|||
color: #056dae; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue