170 lines
4.5 KiB
Vue
170 lines
4.5 KiB
Vue
<template>
|
|
<el-card>
|
|
<el-row :gutter="20" class="header">
|
|
<el-col :span="7">
|
|
<el-input placeholder="请输入商家昵称..." clearable v-model="formPage.businessName"></el-input>
|
|
</el-col>
|
|
<el-button type="button" :icon="Search" @click="initBusinessList">搜索</el-button>
|
|
|
|
</el-row>
|
|
<el-table :data="tableData" stripe style="width: 100%;" showOverflowTooltip>
|
|
<el-table-column prop="id" label="#ID" width="80" fixed="fixed" />
|
|
<el-table-column prop="businessName" label="商家昵称" width="200" />
|
|
<el-table-column prop="businessAvatar" label="头像" width="150" >
|
|
<template v-slot="scope">
|
|
<el-popover
|
|
placement="right-start"
|
|
:width="200"
|
|
trigger="hover"
|
|
:content="scope.row.businessAvatar"
|
|
>
|
|
<template #reference>
|
|
<img :src="scope.row.businessAvatar" width="50" height="50"/>
|
|
</template>
|
|
</el-popover>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="businessPhone" label="电话号码" width="120" />
|
|
|
|
<el-table-column prop="storeStatus" label="店铺状态" width="80">
|
|
<template v-slot="scope">
|
|
<div v-if="scope.row.storeStatus===0" style="color: red">
|
|
休业
|
|
</div>
|
|
<div style="color: lawngreen" v-else>
|
|
营业
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="createTime" label="注册日期" width="200"/>
|
|
<el-table-column prop="updateTime" label="最后登录日期" width="200"/>
|
|
<el-table-column prop="action" fixed="right" label="操作" min-width="200" >
|
|
<template v-slot="scope" >
|
|
<el-button type="success" size="small" @click="handleRouter(scope.row)" >
|
|
商品管理
|
|
</el-button>
|
|
<el-button type="success" size="small" @click="handleRouter2(scope.row)" >
|
|
商品分类
|
|
</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
<el-pagination
|
|
v-model:currentPage="formPage.current"
|
|
v-model:page-size="formPage.pageSize"
|
|
:page-sizes="[10, 20, 30, 40,50]"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
:total="total"
|
|
@size-change="handleSizeChange"
|
|
@current-change="handleCurrentChange"
|
|
/>
|
|
</el-card>
|
|
|
|
</template>
|
|
<script setup>
|
|
import {Search,DocumentAdd,Edit} from '@element-plus/icons-vue'
|
|
import {ref, watch} from 'vue'
|
|
import axios from "@/util/axios";
|
|
|
|
|
|
import {useRouter} from "vue-router"
|
|
|
|
|
|
|
|
const router=useRouter();
|
|
|
|
|
|
const handleRouter=(temp)=>{
|
|
//console.log(temp.id)
|
|
router.push({path:'/product',query:{product: JSON.stringify(temp)}})
|
|
}
|
|
const handleRouter2=(temp)=>{
|
|
console.log(temp.id)
|
|
router.push({path:'/productCategory',query:{product: JSON.stringify(temp)}})
|
|
}
|
|
|
|
|
|
const formPage=ref({
|
|
businessName:'',
|
|
current:1,
|
|
pageSize:10
|
|
})
|
|
|
|
|
|
const total=ref(0)
|
|
const tableData =ref([])
|
|
|
|
|
|
// const handleCollapse=async (temp)=>{
|
|
// console.log(temp)
|
|
// const res=await axios.post("business/list");
|
|
// RCollapse.value.splice(0,RCollapse.value.length);
|
|
// LCollapse.value.splice(0,LCollapse.value.length);
|
|
// // console.log(res.data.data.records)
|
|
// tableData.value=res.data.data;
|
|
// tableData.value.forEach(item => {
|
|
// if(item.state){
|
|
// RCollapse.value.push(item)
|
|
// }
|
|
// else{
|
|
// LCollapse.value.push(item)
|
|
// }
|
|
//
|
|
// });
|
|
// // console.log("RCollapse"+RCollapse.value);
|
|
// // console.log("LCollapse"+LCollapse.value);
|
|
// if (temp){
|
|
// tableData.value=RCollapse.value
|
|
// total.value=Number(RCollapse.value.length);
|
|
// }else {
|
|
// tableData.value=LCollapse.value
|
|
// total.value=Number(LCollapse.value.length);
|
|
// }
|
|
//
|
|
// }
|
|
const initBusinessList=async()=>{
|
|
// console.log(formPage.value)
|
|
const res=await axios.post("business/list/page",formPage.value);
|
|
// console.log(res.data.data.records)
|
|
|
|
tableData.value=res.data.data.records;
|
|
tableData.value.map(item=>{
|
|
if(item.state==0)
|
|
{
|
|
item.push()
|
|
}
|
|
|
|
})
|
|
total.value=Number(res.data.data.total);
|
|
|
|
}
|
|
|
|
|
|
|
|
initBusinessList();
|
|
const handleSizeChange = (pageSize) => {
|
|
formPage.value.current=1;
|
|
formPage.value.pageSize=pageSize;
|
|
initBusinessList();
|
|
}
|
|
const handleCurrentChange = (pageNum) => {
|
|
formPage.value.current=pageNum;
|
|
initBusinessList();
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.header{
|
|
padding-bottom: 16px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
.el-pagination{
|
|
padding-top: 15px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
|
|
</style> |