You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

188 lines
73 KiB

3 years ago
<template>
<div style="padding: 0 20px">
<div ref="lxHeader">
<lx-header icon="md-apps" text="订单管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<slot>
<div style="display: flex;justify-content: flex-start;flex-wrap: wrap;">
<Select class="select" style="width:200px;margin-right: 10px;" :clearable="true" placeholder="选择订单状态">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Select class="select" style="width:200px;margin-right: 10px;" :clearable="true" placeholder="选择子订单状态">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Select class="select" style="width:200px;margin-right: 10px;" :clearable="true" placeholder="选择商家">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Select class="select" style="width:200px;margin-right: 10px;" :clearable="true" placeholder="选择类型">
<OptionGroup label="Hot Cities">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</OptionGroup>
<OptionGroup label="Other Cities">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</OptionGroup>
</Select>
<Input class="select" style="width: 200px; margin-right: 10px" placeholder="关键字搜索" />
<Button class="select" type="primary">查询</Button>
<Button class="select" type="primary" style="margin-left: 10px">新增订单</Button>
</div>
</slot>
</lx-header>
</div>
3 years ago
<xy-table :list="list" :table-item="table">
3 years ago
<template v-slot:btns>
<el-table-column fixed="right" label="操作" width="200" header-align="center">
<template slot-scope="scope">
<Button icon="ios-chatbubbles-outline" type="primary" style="margin-left: 10px;margin-bottom: 6px;" size="small" ghost>跟进</Button>
3 years ago
<Button v-show="scope.row.state_name == ''" icon="ios-paper-plane-outline" type="primary" style="margin-left: 10px;margin-bottom: 6px;" size="small" ghost>分发</Button>
3 years ago
<Button v-show="scope.row.state_name == ''" icon="ios-close" type="primary" style="margin-left: 10px;margin-bottom: 6px;" size="small" ghost>取消</Button>
<Button v-show="scope.row.state_name == ''" icon="ios-redo" type="primary" style="margin-left: 10px;margin-bottom: 6px;" size="small" ghost>收回</Button>
<Button icon="ios-clipboard-outline" type="primary" style="margin-left: 10px;margin-bottom: 6px;" size="small" ghost>日志</Button>
</template>
</el-table-column>
</template>
3 years ago
</xy-table>
3 years ago
<div style="display: flex;justify-content: flex-end;">
<Page :total="5" show-elevator />
</div>
</div>
</template>
<script>
import {parseTime} from "@/utils"
export default {
data() {
return {
list:JSON.parse('{"total":1882,"rows":[{"id":1915,"order_id":2096,"product_type_id":2,"product_id":93,"original_price":null,"price":"0.00","commission":null,"sharing":"0.00","quantity":1,"created_at":"2022-07-11T06:24:42.000000Z","updated_at":"2022-07-11T06:35:40.000000Z","deleted_at":null,"state":"accepted","merchant_id":3,"assigned_serial":null,"assign_id":1257,"admin_actions":{"follow":"\u8ddf\u8fdb"},"order_name":"\u3010\u5e78\u5b55\u7eaa\u30119.9\u5b55\u5987\u7167\u793c\u5305","paid_at":"2022-07-11 14:24:51","bookable_name":"\u5355\u54c1","order_quantity":1,"order_total":"9.90","order_items_count":1,"order_state":"ongoing","order_state_name":"\u8fdb\u884c\u4e2d","member":{"id":3315,"name":"\u6f58\u9732\u9732","phone":"15850128876","due_date":"2022-10-18","hospital":"\u82cf\u5927\u9644\u4e00\u9662","wechat":null,"wechat_nickname":"\u9884\u9632\u4e3a\u4e3b","address":null,"source":null,"user_source":null,"wechat_openid":"oEgEM0fGyGV9nRX4UvZflx4WjuCc","wechat_unionid":null,"visit_count":null,"last_login_time":null,"lon":null,"lat":null,"province":null,"city":null,"area":"\u59d1\u82cf\u533a","operating":null,"ip":null,"machine":null,"pid":108,"site_id":null,"created_at":"2022-07-11T06:17:34.000000Z","updated_at":"2022-07-11T06:24:51.000000Z","deleted_at":null,"password":null,"promotion":1,"promotion_type":null,"promotion_id":null,"avatar":"https:\\/\\/thirdwx.qlogo.cn\\/mmopen\\/vi_32\\/Q0j4TwGTfTKympFiaDsiaBrnOwuN7sa18GSUxoXicG4LvVeIyMaXKmDicOYGrBUI15icB9BJgafm5Wr4UkjvJibujYjA\\/132"},"memberPromotion":{"id":108,"name":null,"phone":"18550182209","due_date":null,"hospital":null,"wechat":null,"wechat_nickname":"[\u798f]\u6444\u5f71\u798f\u5229\u5b98","address":null,"source":null,"user_source":null,"wechat_openid":"oEgEM0SPOOZIhMqH8XVeFcI-V-cY","wechat_unionid":null,"visit_count":null,"last_login_time":null,"lon":null,"lat":null,"province":null,"city":null,"area":null,"operating":null,"ip":null,"machine":null,"pid":null,"site_id":null,"created_at":"2021-12-09T02:29:57.000000Z","updated_at":"2022-06-28T06:56:58.000000Z","deleted_at":null,"password":null,"promotion":null,"promotion_type":null,"promotion_id":null,"avatar":"https:\\/\\/thirdwx.qlogo.cn\\/mmopen\\/vi_32\\/eOTYKficzdFickdTb7iazzPAFqIVicibDdhQoXWskMmjAdfjnuup86xKScGCc69cR9StD65XC3ADRdyibDPGSYt6up1w\\/132"},"state_name":"已发布","product_type":{"id":2,"pid":1,"name":"\u5b55\u5987\u7167","sortnumber":"0","created_at":"2021-07-25T01:24:27.000000Z","updated_at":"2021-08-30T02:47:11.000000Z","deleted_at":null},"product":{"id":93,"product_type_id":2,"product_type_pid":1,"merchant_id":3,"shop_ids":null,"name":"\u3010\u5e78\u5b55\u7eaa\u30119.9\u5b55\u5987\u7167\u793c\u5305","price":"9.90","original_price":"499.00","content":"<p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013686834320.png\\" title=\\"1650013686834320.png\\" alt=\\"1 .png\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013731171833.png\\" title=\\"1650013731171833.png\\" alt=\\"2 .png\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013745127104.jpeg\\" title=\\"1650013745127104.jpeg\\" alt=\\"3 .jpeg\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013756283499.jpeg\\" title=\\"1650013756283499.jpeg\\" alt=\\"4 .jpeg\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013766492864.jpeg\\" title=\\"1650013766492864.jpeg\\" alt=\\"5 .jpeg\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013777685004.jpeg\\" title=\\"1650013777685004.jpeg\\" alt=\\"6.jpeg\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013786975197.jpeg\\" title=\\"1650013786975197.jpeg\\" alt=\\"7. .jpeg\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013796987326.jpeg\\" title=\\"1650013796987326.jpeg\\" alt=\\"8 .jpeg\\"\\/><\\/p><p><img src=\\"\\/ueditor\\/php\\/upload\\/image\\/20220415\\/1650013806224939.jpeg\\" title=\\"1650013806224939.jpeg\\" alt=\\"9 .jpeg\\"\\/><\\/p>","state":"active","created_at":"
table:[
{
prop: "order_name",
label:"订单名称",
width:220
},
{
prop:'bookable_name',
label:"订购类型",
width:110
},
{
prop:"order_total",
label:"金额",
width: 100,
formatter:(cell,data,value,index)=>{
return `${value}`
}
},
{
prop:"created_at",
label:"下单时间",
width: 220,
formatter:(cell,data,value,index)=>{
return parseTime(new Date(value),"{y}-{m}-{d} {h}:{i}:{s}")
}
},
{
prop:"paid_at",
label:"支付时间",
width: 220
},
{
prop:"updated_at",
label:"更新时间",
width: 220,
formatter:(cell,data,value,index)=>{
return parseTime(new Date(value),"{y}-{m}-{d} {h}:{i}:{s}")
}
},
{
prop:"memberPromotion.name",
label:"推广渠道",
width: 110
},
{
label:"用户信息",
Fprop:'member',
multiHd:[
{
prop:"name",
label:"姓名",
width:110
},
3 years ago
{
label:"头像",
width:80,
customFn:(row)=>{
return (<div style={{display:'flex',alignItems:'center',justifyContent:'center'}}><el-avatar src={row.member.avatar}></el-avatar></div>)
}
},
3 years ago
{
prop:"wechat_nickname",
label:"昵称",
width: 150
},
{
prop:"phone",
label:"联系电话",
width: 190
},
{
prop:"area",
label:"区域",
width: 110
},
{
prop:"due_date",
label:"预产期",
width: 150
}
],
},
{
label:'订单明细',
multiHd: [
{
prop:"product_type.name",
label:"产品类型",
width: 200
},
{
prop:"merchant.name",
label:"服务商家",
width: 220
},
{
prop:"state_name",
label:"状态",
width: 140
}
]
}
],
cityList: [
{
value: 'New York',
label: 'New York'
},
{
value: 'London',
label: 'London'
}
],
}
},
methods: {}
}
</script>
<style scoped lang="scss">
@media screen and (max-width: 1300px){
.select{
margin-bottom: 6px;
}
}
3 years ago
3 years ago
</style>