新增桌台管理
This commit is contained in:
parent
640e3bb941
commit
259aec07cd
59
src/App.vue
59
src/App.vue
|
|
@ -10,7 +10,7 @@ export default {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style lang="scss">
|
||||
.tips {
|
||||
color: #999;
|
||||
}
|
||||
|
|
@ -33,4 +33,61 @@ export default {
|
|||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.shop_type_box {
|
||||
display: flex;
|
||||
|
||||
.item {
|
||||
$borderColor: #1890FF;
|
||||
margin-right: 14px;
|
||||
border: 1px solid #ececec;
|
||||
border-radius: 4px;
|
||||
padding: 6px 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
border-color: $borderColor;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border-color: $borderColor;
|
||||
|
||||
.active_dot {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.active_dot {
|
||||
$size: 26px;
|
||||
background-color: $borderColor;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: $size;
|
||||
height: $size;
|
||||
clip-path: polygon(100% 0, 0 0, 100% 100%);
|
||||
display: none;
|
||||
justify-content: flex-end;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.s_title {
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.intro {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -131,4 +131,16 @@ export function tbProductStockOperateDetail(id) {
|
|||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 操作出库/入库
|
||||
* @returns
|
||||
*/
|
||||
export function tbProductStockOperateOutAndOn(data) {
|
||||
return request({
|
||||
url: `/api/tbProductStockOperate/outAndOn`,
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,64 @@
|
|||
// 桌台管理
|
||||
import request from '@/utils/request'
|
||||
|
||||
/**
|
||||
* 台桌列表
|
||||
* @returns
|
||||
*/
|
||||
export function tbShopTableGet(params) {
|
||||
return request({
|
||||
url: `/api/tbShopTable`,
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 区域
|
||||
* @returns
|
||||
*/
|
||||
export function tbShopAreaGet(params) {
|
||||
return request({
|
||||
url: `/api/tbShopArea`,
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 增加区域
|
||||
* @returns
|
||||
*/
|
||||
export function tbShopArea(data, method) {
|
||||
return request({
|
||||
url: `/api/tbShopArea`,
|
||||
method: method,
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除区域
|
||||
* @returns
|
||||
*/
|
||||
export function tbShopAreaDelete(data) {
|
||||
return request({
|
||||
url: `/api/tbShopArea`,
|
||||
method: 'DELETE',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 增加台桌
|
||||
* @returns
|
||||
*/
|
||||
export function tbShopTable(data, method) {
|
||||
return request({
|
||||
url: `/api/tbShopTable`,
|
||||
method: method,
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -20,7 +20,11 @@
|
|||
<el-table-column label="商品信息">
|
||||
<template v-slot="scope">
|
||||
<div class="shop_info">
|
||||
<el-image :sr="scope.row.coverImg" style="width: 30px;height: 30px;"></el-image>
|
||||
<el-image :src="scope.row.coverImg" style="width: 30px;height: 30px;">
|
||||
<div class="img_error" slot="error">
|
||||
<i class="icon el-icon-document-delete"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
<span>{{ scope.row.name }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -125,7 +129,6 @@ export default {
|
|||
}
|
||||
},
|
||||
show(goods) {
|
||||
console.log('show-goods===', goods)
|
||||
this.dialogVisible = true
|
||||
if (goods && goods.length) {
|
||||
this.goods = goods
|
||||
|
|
@ -6,7 +6,7 @@ const state = {
|
|||
withoutAnimation: false
|
||||
},
|
||||
device: 'desktop',
|
||||
size: Cookies.get('size') || 'Default'
|
||||
size: Cookies.get('size') || 'default'
|
||||
}
|
||||
|
||||
const mutations = {
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
<el-table-column label="备注" prop="remark"></el-table-column>
|
||||
<el-table-column label="操作人" prop="status">
|
||||
<template v-slot="scope">
|
||||
{{ scope.row.operatorSnap.name }}
|
||||
{{ scope.row.operatorSnap.account }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" prop="updatedAt">
|
||||
|
|
@ -32,10 +32,13 @@
|
|||
{{ dayjs(scope.row.stockTime).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="80">
|
||||
<el-table-column label="操作" width="120">
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" size="mini" @click="$refs.operatingDetail.show(scope.row.id)">
|
||||
查看详情
|
||||
详情
|
||||
</el-button>
|
||||
<el-button type="text" size="mini" @click="$refs.operatingDetail.show(scope.row.id)">
|
||||
作废
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,274 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<el-form ref="queryForm" :model="queryForm" :rules="queryRules" label-position="left" label-width="80px">
|
||||
<el-form-item label="出库类型">
|
||||
<div class="shop_type_box">
|
||||
<div class="item" v-for="(item, index) in shopTypes" :key="index"
|
||||
:class="{ active: shopTypesActive == index }" @click="changeTypeEnum(index)">
|
||||
<div class="s_title">{{ item.label }}</div>
|
||||
<div class="active_dot">
|
||||
<i class="el-icon-check"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-row>
|
||||
<el-col :span="8" v-if="shopTypes[shopTypesActive].value == 'purveyor'">
|
||||
<el-form-item label="供应商" prop="purveyorId">
|
||||
<el-select v-model="queryForm.purveyorId" placeholder="请选择供应商" style="width: 220px;">
|
||||
<el-option :label="item.purveyorName" :value="item.id" v-for="item in purveyorList"
|
||||
:key="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="入库时间" prop="time">
|
||||
<el-date-picker v-model="queryForm.time" type="date" format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd" placeholder="选择日期" style="width: 220px;">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="shopTypes[shopTypesActive].value == 'purveyor'">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="应收金额">
|
||||
<el-input v-model="queryForm.totalAmount" placeholder="请输入应收金额"
|
||||
style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="实收金额">
|
||||
<el-input v-model="queryForm.paidAmount" placeholder="请输入实收金额" style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="shopTypes[shopTypesActive].value == 'purveyor'">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="付款时间">
|
||||
<el-date-picker v-model="queryForm.paidAt" type="date" format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd" placeholder="选择日期" style="width: 220px;">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="批号">
|
||||
<el-input v-model="queryForm.batchNumber" placeholder="请输入批号" style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="queryForm.remark" placeholder="请输入备注" style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="$refs.shopList.show(tableData.list)">选择商品</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-button type="primary" plain>
|
||||
共{{ tableData.list.length }}种商品，金额合计<span style="color: red;">￥{{ queryForm.totalAmount }}</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-table :data="tableData.list">
|
||||
<el-table-column type="index" width="50"></el-table-column>
|
||||
<el-table-column label="商品名称" prop="name">
|
||||
<template v-slot="scope">
|
||||
<div class="name_wrap">
|
||||
<span class="name">{{ scope.row.name }}</span>
|
||||
<el-tag type="info" v-if="scope.row.specSnap" size="mini">{{ scope.row.specSnap }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="进价">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.guidePrice" :min="0" controls-position="right"
|
||||
@change="e => scope.row.totalAmount = e * scope.row.number"></el-input-number>
|
||||
<div class="tips">成本价￥{{ scope.row.costPrice }}/{{ scope.row.unitName }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="数量">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.number" :min="0" controls-position="right"
|
||||
@change="e => scope.row.totalAmount = e * scope.row.guidePrice"></el-input-number>
|
||||
<div class="tips">入库前：{{ scope.row.stockNumber }}{{ scope.row.unitName }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="小计">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.totalAmount" :min="0"
|
||||
controls-position="right"></el-input-number>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="变动后剩余库存">
|
||||
<template v-slot="scope">
|
||||
{{ scope.row.stockNumber + scope.row.number }}{{ scope.row.unitName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="80">
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" @click="tableData.list.splice(scope.$index, 1)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="primary" @click="submitHandle" :loading="queryFormLoading">确定</el-button>
|
||||
</div>
|
||||
<shopList ref="shopList" @success="selectShop" />
|
||||
<el-dialog :visible.sync="showResult" :show-close="false" :close-on-press-escape="false"
|
||||
:close-on-click-modal="false">
|
||||
<el-result icon="success" title="出库提交成功" :subTitle="`共操作${tableData.list.length}件商品`">
|
||||
<template slot="extra">
|
||||
<el-button type="primary" size="medium" @click="resetHandle">创建新的出库单</el-button>
|
||||
<router-link to="/invoicing/operating_record">
|
||||
<el-button size="medium">历史提交</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-result>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dayjs from 'dayjs'
|
||||
import shopList from '@/components/shopList'
|
||||
import { tbShopPurveyorGet, tbProductStockOperateOutAndOn } from '@/api/invoicing'
|
||||
export default {
|
||||
components: {
|
||||
shopList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
shopTypesActive: 0,
|
||||
shopTypes: [
|
||||
{
|
||||
label: '供应商入库',
|
||||
value: 'purveyor'
|
||||
},
|
||||
{
|
||||
label: '其他入库',
|
||||
value: 'purchase'
|
||||
}
|
||||
],
|
||||
resetForm: '',
|
||||
queryFormLoading: false,
|
||||
queryForm: {
|
||||
batchNumber: '',
|
||||
list: [],
|
||||
paidAmount: 0,
|
||||
paidAt: '',
|
||||
purveyorId: '',
|
||||
purveyorName: '',
|
||||
remark: '',
|
||||
time: dayjs().format('YYYY-MM-DD'),
|
||||
totalAmount: 0,
|
||||
type: 'reject',
|
||||
shopId: localStorage.getItem('shopId')
|
||||
},
|
||||
queryRules: {
|
||||
purveyorId: [
|
||||
{
|
||||
required: true,
|
||||
message: ' ',
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
time: [
|
||||
{
|
||||
required: true,
|
||||
message: ' ',
|
||||
trigger: 'change'
|
||||
}
|
||||
]
|
||||
},
|
||||
purveyorList: [],
|
||||
tableData: {
|
||||
list: []
|
||||
},
|
||||
showResult: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.resetForm = { ...this.queryForm }
|
||||
this.tbShopPurveyorGet()
|
||||
},
|
||||
methods: {
|
||||
// 提交
|
||||
submitHandle() {
|
||||
this.$refs.queryForm.validate(async valid => {
|
||||
if (valid) {
|
||||
try {
|
||||
this.queryFormLoading = true
|
||||
this.queryForm.list = this.tableData.list
|
||||
await tbProductStockOperateOutAndOn(this.queryForm)
|
||||
this.queryFormLoading = false
|
||||
this.showResult = true
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.queryFormLoading = false
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择商品
|
||||
selectShop(res) {
|
||||
let arr = []
|
||||
res.forEach(item => {
|
||||
item.skuList.forEach(i => {
|
||||
arr.push({
|
||||
name: item.name,
|
||||
unitName: item.unitName,
|
||||
productId: item.id,
|
||||
number: 0,
|
||||
totalAmount: '',
|
||||
...i
|
||||
})
|
||||
})
|
||||
})
|
||||
console.log(arr)
|
||||
this.tableData.list = arr
|
||||
},
|
||||
// 初始化
|
||||
resetHandle() {
|
||||
this.showResult = false
|
||||
this.queryForm = { ...this.resetForm }
|
||||
this.tableData.list = []
|
||||
},
|
||||
// 切换类型
|
||||
changeTypeEnum(index) {
|
||||
this.shopTypesActive = index
|
||||
this.queryForm.type = this.shopTypes[index].value
|
||||
},
|
||||
// 获取供应商列表
|
||||
async tbShopPurveyorGet() {
|
||||
try {
|
||||
const res = await tbShopPurveyorGet({
|
||||
shopId: localStorage.getItem('shopId'),
|
||||
page: 0,
|
||||
size: 100
|
||||
})
|
||||
this.purveyorList = res.content
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.name_wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.name {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,274 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<el-form ref="queryForm" :model="queryForm" :rules="queryRules" label-position="left" label-width="80px">
|
||||
<el-form-item label="出库类型">
|
||||
<div class="shop_type_box">
|
||||
<div class="item" v-for="(item, index) in shopTypes" :key="index"
|
||||
:class="{ active: shopTypesActive == index }" @click="changeTypeEnum(index)">
|
||||
<div class="s_title">{{ item.label }}</div>
|
||||
<div class="active_dot">
|
||||
<i class="el-icon-check"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-row>
|
||||
<el-col :span="8" v-if="shopTypes[shopTypesActive].value == 'reject'">
|
||||
<el-form-item label="供应商" prop="purveyorId">
|
||||
<el-select v-model="queryForm.purveyorId" placeholder="请选择供应商" style="width: 220px;">
|
||||
<el-option :label="item.purveyorName" :value="item.id" v-for="item in purveyorList"
|
||||
:key="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="出库时间" prop="time">
|
||||
<el-date-picker v-model="queryForm.time" type="date" format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd" placeholder="选择日期" style="width: 220px;">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="shopTypes[shopTypesActive].value == 'reject'">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="应收金额">
|
||||
<el-input v-model="queryForm.totalAmount" placeholder="请输入应收金额"
|
||||
style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="实收金额">
|
||||
<el-input v-model="queryForm.paidAmount" placeholder="请输入实收金额" style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="shopTypes[shopTypesActive].value == 'reject'">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="付款时间">
|
||||
<el-date-picker v-model="queryForm.paidAt" type="date" format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd" placeholder="选择日期" style="width: 220px;">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="批号">
|
||||
<el-input v-model="queryForm.batchNumber" placeholder="请输入批号" style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="queryForm.remark" placeholder="请输入备注" style="width: 220px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="$refs.shopList.show(tableData.list)">选择商品</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-button type="primary" plain>
|
||||
共{{ tableData.list.length }}种商品，金额合计<span style="color: red;">￥{{ queryForm.totalAmount }}</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-table :data="tableData.list">
|
||||
<el-table-column type="index" width="50"></el-table-column>
|
||||
<el-table-column label="商品名称" prop="name">
|
||||
<template v-slot="scope">
|
||||
<div class="name_wrap">
|
||||
<span class="name">{{ scope.row.name }}</span>
|
||||
<el-tag type="info" v-if="scope.row.specSnap" size="mini">{{ scope.row.specSnap }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="进价">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.guidePrice" :min="0" controls-position="right"
|
||||
@change="e => scope.row.totalAmount = e * scope.row.number"></el-input-number>
|
||||
<div class="tips">成本价￥{{ scope.row.costPrice }}/{{ scope.row.unitName }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="数量">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.number" :min="0" controls-position="right"
|
||||
@change="e => scope.row.totalAmount = e * scope.row.guidePrice"></el-input-number>
|
||||
<div class="tips">出库前：{{ scope.row.stockNumber }}{{ scope.row.unitName }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="小计">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.totalAmount" :min="0"
|
||||
controls-position="right"></el-input-number>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="变动后剩余库存">
|
||||
<template v-slot="scope">
|
||||
{{ scope.row.stockNumber - scope.row.number }}{{ scope.row.unitName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="80">
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" @click="tableData.list.splice(scope.$index, 1)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="primary" @click="submitHandle" :loading="queryFormLoading">确定</el-button>
|
||||
</div>
|
||||
<shopList ref="shopList" @success="selectShop" />
|
||||
<el-dialog :visible.sync="showResult" :show-close="false" :close-on-press-escape="false"
|
||||
:close-on-click-modal="false">
|
||||
<el-result icon="success" title="出库提交成功" :subTitle="`共操作${tableData.list.length}件商品`">
|
||||
<template slot="extra">
|
||||
<el-button type="primary" size="medium" @click="resetHandle">创建新的出库单</el-button>
|
||||
<router-link to="/invoicing/operating_record">
|
||||
<el-button size="medium">历史提交</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-result>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dayjs from 'dayjs'
|
||||
import shopList from '@/components/shopList'
|
||||
import { tbShopPurveyorGet, tbProductStockOperateOutAndOn } from '@/api/invoicing'
|
||||
export default {
|
||||
components: {
|
||||
shopList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
shopTypesActive: 0,
|
||||
shopTypes: [
|
||||
{
|
||||
label: '供应商退货',
|
||||
value: 'reject'
|
||||
},
|
||||
{
|
||||
label: '其他出库',
|
||||
value: 'other-out'
|
||||
}
|
||||
],
|
||||
resetForm: '',
|
||||
queryFormLoading: false,
|
||||
queryForm: {
|
||||
batchNumber: '',
|
||||
list: [],
|
||||
paidAmount: 0,
|
||||
paidAt: '',
|
||||
purveyorId: '',
|
||||
purveyorName: '',
|
||||
remark: '',
|
||||
time: dayjs().format('YYYY-MM-DD'),
|
||||
totalAmount: 0,
|
||||
type: 'reject',
|
||||
shopId: localStorage.getItem('shopId')
|
||||
},
|
||||
queryRules: {
|
||||
purveyorId: [
|
||||
{
|
||||
required: true,
|
||||
message: ' ',
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
time: [
|
||||
{
|
||||
required: true,
|
||||
message: ' ',
|
||||
trigger: 'change'
|
||||
}
|
||||
]
|
||||
},
|
||||
purveyorList: [],
|
||||
tableData: {
|
||||
list: []
|
||||
},
|
||||
showResult: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.resetForm = { ...this.queryForm }
|
||||
this.tbShopPurveyorGet()
|
||||
},
|
||||
methods: {
|
||||
// 提交
|
||||
submitHandle() {
|
||||
this.$refs.queryForm.validate(async valid => {
|
||||
if (valid) {
|
||||
try {
|
||||
this.queryFormLoading = true
|
||||
this.queryForm.list = this.tableData.list
|
||||
await tbProductStockOperateOutAndOn(this.queryForm)
|
||||
this.queryFormLoading = false
|
||||
this.showResult = true
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.queryFormLoading = false
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择商品
|
||||
selectShop(res) {
|
||||
let arr = []
|
||||
res.forEach(item => {
|
||||
item.skuList.forEach(i => {
|
||||
arr.push({
|
||||
name: item.name,
|
||||
unitName: item.unitName,
|
||||
productId: item.id,
|
||||
number: 0,
|
||||
totalAmount: '',
|
||||
...i
|
||||
})
|
||||
})
|
||||
})
|
||||
console.log(arr)
|
||||
this.tableData.list = arr
|
||||
},
|
||||
// 初始化
|
||||
resetHandle() {
|
||||
this.showResult = false
|
||||
this.queryForm = { ...this.resetForm }
|
||||
this.tableData.list = []
|
||||
},
|
||||
// 切换类型
|
||||
changeTypeEnum(index) {
|
||||
this.shopTypesActive = index
|
||||
this.queryForm.type = this.shopTypes[index].value
|
||||
},
|
||||
// 获取供应商列表
|
||||
async tbShopPurveyorGet() {
|
||||
try {
|
||||
const res = await tbShopPurveyorGet({
|
||||
shopId: localStorage.getItem('shopId'),
|
||||
page: 0,
|
||||
size: 100
|
||||
})
|
||||
this.purveyorList = res.content
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.name_wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.name {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<div class="filter_wrap">
|
||||
<el-input v-model="query.name" size="small" clearable placeholder="供应商" @keyup.enter.native="getTableData"
|
||||
<el-input v-model="query.name" clearable placeholder="供应商" @keyup.enter.native="getTableData"
|
||||
style="width: 200px;" />
|
||||
<el-select v-model="query.type" placeholder="付款状态">
|
||||
<el-option :label="item.label" :value="item.value" v-for="item in types" :key="item.id"></el-option>
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@
|
|||
<el-table-column label="备注" prop="remark"></el-table-column>
|
||||
<el-table-column label="付款时间" prop="updatedAt">
|
||||
<template v-slot="scope">
|
||||
{{ dayjs(scope.row.paidAt).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
{{ scope.row.paidAt && dayjs(scope.row.paidAt).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="80">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,136 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<div class="filter_wrap">
|
||||
<el-input v-model="query.name" clearable placeholder="供应商" @keyup.enter.native="getTableData"
|
||||
style="width: 200px;" />
|
||||
<el-select v-model="query.type" placeholder="付款状态">
|
||||
<el-option :label="item.label" :value="item.value" v-for="item in types" :key="item.id"></el-option>
|
||||
</el-select>
|
||||
<el-button type="primary" @click="getTableData">查询</el-button>
|
||||
<el-button @click="resetHandle">重置</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-table :data="tableData.list" v-loading="tableData.loading">
|
||||
<el-table-column label="供应商" prop="purveyorName"></el-table-column>
|
||||
<el-table-column label="剩余付款金额" prop="waitAmount">
|
||||
<template v-slot="scope">
|
||||
<span class="num" v-if="scope.row.waitAmount > 0">￥{{ scope.row.waitAmount }}</span>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="待付款笔数" prop="waitCount">
|
||||
<template v-slot="scope">
|
||||
<template v-if="scope.row.waitCount > 0">
|
||||
有<span class="count">{{ scope.row.waitCount }}笔</span>未付
|
||||
</template>
|
||||
<template v-else>-</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" prop="type">
|
||||
<template v-slot="scope">
|
||||
<el-tag :type="scope.row.type == 0 ? 'warning' : 'success'">
|
||||
{{ scope.row.type == 0 ? '待支付' : '已完结' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="上笔进货日期" prop="lastTransactAt">
|
||||
<template v-slot="scope">
|
||||
{{ dayjs(scope.row.lastTransactAt).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="80">
|
||||
<template v-slot="scope">
|
||||
<router-link :to="{ name: 'purchase_detail', query: { purveyorId: scope.row.purveyorId } }">
|
||||
<el-button type="text" size="mini">查看详情</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
|
||||
@current-change="paginationChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dayjs from 'dayjs'
|
||||
import { tbShopPurveyorTransactGet, dictDetail } from '@/api/invoicing'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dayjs,
|
||||
types: [],
|
||||
query: {
|
||||
name: '',
|
||||
type: ''
|
||||
},
|
||||
tableData: {
|
||||
page: 0,
|
||||
size: 10,
|
||||
total: 0,
|
||||
sort: 'id',
|
||||
loading: false,
|
||||
list: []
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.dictDetail()
|
||||
this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
async getTableData() {
|
||||
this.tableData.loading = true
|
||||
try {
|
||||
const res = await tbShopPurveyorTransactGet({
|
||||
page: this.tableData.page,
|
||||
size: this.tableData.size,
|
||||
sort: this.tableData.sort,
|
||||
purveyorName: this.query.name,
|
||||
status: this.query.type,
|
||||
type: 'reject',
|
||||
shopId: localStorage.getItem('shopId')
|
||||
})
|
||||
this.tableData.loading = false
|
||||
this.tableData.list = res.content
|
||||
this.tableData.total = res.totalElements
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 重置查询
|
||||
resetHandle() {
|
||||
this.query.name = ''
|
||||
this.query.type = ''
|
||||
this.tableData.page = 0;
|
||||
this.getTableData()
|
||||
},
|
||||
// 分页回调
|
||||
paginationChange(e) {
|
||||
this.tableData.page = e - 1
|
||||
this.getTableData()
|
||||
},
|
||||
async dictDetail() {
|
||||
const { content } = await dictDetail({
|
||||
dictName: 'purveyor_transact_status',
|
||||
size: 100,
|
||||
page: 0
|
||||
})
|
||||
this.types = content
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.num {
|
||||
color: #F56C6C;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.count {
|
||||
color: #409EFF;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -192,7 +192,7 @@
|
|||
import { tbShopUnit, tbShopCategoryGet, tbProductPost, tbProductSpecGet, tbProductGetDetail, tbProductPut } from "@/api/shop";
|
||||
import addUnit from './components/addUnit'
|
||||
import addClassify from './components/addClassify'
|
||||
import shopList from './components/shopList'
|
||||
import shopList from '@/components/shopList'
|
||||
import uploadImg from '@/components/uploadImg'
|
||||
import settings from '@/settings'
|
||||
export default {
|
||||
|
|
@ -556,63 +556,6 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.shop_type_box {
|
||||
display: flex;
|
||||
|
||||
.item {
|
||||
$borderColor: #1890FF;
|
||||
margin-right: 14px;
|
||||
border: 1px solid #ececec;
|
||||
border-radius: 4px;
|
||||
padding: 6px 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
border-color: $borderColor;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border-color: $borderColor;
|
||||
|
||||
.active_dot {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.active_dot {
|
||||
$size: 26px;
|
||||
background-color: $borderColor;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: $size;
|
||||
height: $size;
|
||||
clip-path: polygon(100% 0, 0 0, 100% 100%);
|
||||
display: none;
|
||||
justify-content: flex-end;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.s_title {
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.intro {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shop_list {
|
||||
.item {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
|
||||
<script>
|
||||
import { tbProductGroupPost, tbProductGroupPut, productListGet } from '@/api/shop'
|
||||
import shopList from './shopList'
|
||||
import shopList from '@/components/shopList'
|
||||
export default {
|
||||
components: {
|
||||
shopList
|
||||
|
|
|
|||
|
|
@ -0,0 +1,73 @@
|
|||
<template>
|
||||
<el-dialog :title="form.id ? '编辑区域' : '添加区域'" :visible.sync="dialogVisible" @close="reset">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
|
||||
<el-form-item label="区域名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入区域名称"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmitHandle">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tbShopArea } from '@/api/table'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
form: {
|
||||
id: '',
|
||||
name: ''
|
||||
},
|
||||
rules: {
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入区域名称',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSubmitHandle() {
|
||||
this.$refs.form.validate(async valid => {
|
||||
if (valid) {
|
||||
try {
|
||||
let res = await tbShopArea({
|
||||
...this.form,
|
||||
shopId: localStorage.getItem('shopId')
|
||||
}, this.form.id ? 'put' : 'post')
|
||||
this.$emit('success', res)
|
||||
this.close()
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: `${this.form.id ? '编辑' : '添加'}成功`,
|
||||
type: 'success'
|
||||
});
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
show(obj) {
|
||||
this.dialogVisible = true
|
||||
if (obj && obj.id) {
|
||||
this.form = JSON.parse(JSON.stringify(obj))
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.dialogVisible = false
|
||||
},
|
||||
reset() {
|
||||
this.form.id = ''
|
||||
this.form.name = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,117 @@
|
|||
<template>
|
||||
<el-dialog :title="form.id ? '编辑台桌' : '添加台桌'" :visible.sync="dialogVisible" @close="reset">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
|
||||
<el-form-item label="选择区域" prop="areaId">
|
||||
<el-select v-model="form.areaId" placeholder="请选择区域">
|
||||
<el-option :label="item.name" :value="item.id" v-for="item in areaList" :key="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="台桌名称">
|
||||
<el-input v-model="form.name" placeholder="请输入台桌名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="客座数">
|
||||
<el-input-number v-model="form.maxCapacity" :min="0" controls-position="right"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="网络预定开关">
|
||||
<el-switch v-model="form.isPredate" :active-value="1" :inactive-value="2"></el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="form.type">
|
||||
<el-radio-button :label="0">低消</el-radio-button>
|
||||
<el-radio-button :label="2">计时</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="最低消费" v-if="form.type == 0">
|
||||
<el-input-number v-model="form.amount" :min="0" controls-position="right"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="每小时收费" v-if="form.type == 2">
|
||||
<el-input-number v-model="form.perhour" :min="0" controls-position="right"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmitHandle">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tbShopTable, tbShopAreaGet } from '@/api/table'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
form: {
|
||||
id: '',
|
||||
name: '',
|
||||
areaId: '',
|
||||
maxCapacity: 0,
|
||||
isPredate: 1,
|
||||
type: 2,
|
||||
perhour: 0,
|
||||
amount: 0
|
||||
},
|
||||
rules: {
|
||||
areaId: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择区域',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
},
|
||||
areaList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.tbShopAreaGet()
|
||||
},
|
||||
methods: {
|
||||
onSubmitHandle() {
|
||||
this.$refs.form.validate(async valid => {
|
||||
if (valid) {
|
||||
try {
|
||||
let res = await tbShopTable({
|
||||
...this.form,
|
||||
shopId: localStorage.getItem('shopId')
|
||||
}, this.form.id ? 'put' : 'post')
|
||||
this.$emit('success', res)
|
||||
this.close()
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: `${this.form.id ? '编辑' : '添加'}成功`,
|
||||
type: 'success'
|
||||
});
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
show(obj) {
|
||||
this.dialogVisible = true
|
||||
if (obj && obj.id) {
|
||||
this.form = JSON.parse(JSON.stringify(obj))
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.dialogVisible = false
|
||||
},
|
||||
reset() {
|
||||
this.form.id = ''
|
||||
this.form.name = ''
|
||||
},
|
||||
// 获取区域
|
||||
async tbShopAreaGet() {
|
||||
try {
|
||||
const { content } = await tbShopAreaGet({
|
||||
shopId: localStorage.getItem('shopId')
|
||||
})
|
||||
this.areaList = content
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,209 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<el-tabs v-model="tabVlaue" type="card" @tab-click="tabClick">
|
||||
<el-tab-pane label="全部" name=""></el-tab-pane>
|
||||
<el-tab-pane v-for="item in tabs" :key="item.id" :label="item.name" :name="`${item.id}`">
|
||||
<div slot="label">
|
||||
{{ item.name }}
|
||||
<i class="icon el-icon-edit" @click.stop="$refs.addEara.show(item)"></i>
|
||||
<el-popconfirm title="确定删除吗？" @confirm="delHandle([item.id])">
|
||||
<i class="icon el-icon-delete" slot="reference" @click.stop=""></i>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="head-container">
|
||||
<div class="filter_wrap">
|
||||
<el-button icon="el-icon-plus" @click="$refs.addEara.show()">添加区域</el-button>
|
||||
<el-button type="primary" icon="el-icon-plus" @click="$refs.addTable.show()">添加台桌</el-button>
|
||||
<el-button type="primary" icon="el-icon-download">下载台桌码</el-button>
|
||||
<el-button type="primary" icon="el-icon-download">下载店铺码</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<div class="table_list">
|
||||
<div class="item" v-for="item in tableList" :key="item.id">
|
||||
<div class="top">
|
||||
<div class="row row1">
|
||||
<span>0001</span>
|
||||
<div class="state">
|
||||
<span class="dot"></span>
|
||||
开台中
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<el-tag type="success" size="mini">低消</el-tag>
|
||||
<el-tag size="mini">可预约</el-tag>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span class="tips">客座次数：5人</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btm">
|
||||
<div class="btm_item">
|
||||
<i class="i el-icon-edit"></i>
|
||||
</div>
|
||||
<div class="btm_item">
|
||||
<i class="i el-icon-edit"></i>
|
||||
</div>
|
||||
<div class="btm_item">
|
||||
<i class="i el-icon-delete"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<addEara ref="addEara" @success="tbShopAreaGet" />
|
||||
<addTable ref="addTable" @success="tbShopTableGet" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import addEara from './components/addEara'
|
||||
import addTable from './components/addTable'
|
||||
import { tbShopTableGet, tbShopAreaGet, tbShopAreaDelete } from '@/api/table'
|
||||
export default {
|
||||
components: {
|
||||
addEara,
|
||||
addTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabVlaue: '',
|
||||
tabs: [],
|
||||
tableList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.tbShopAreaGet()
|
||||
},
|
||||
methods: {
|
||||
tabClick() {
|
||||
this.tbShopTableGet()
|
||||
},
|
||||
// 删除区域
|
||||
async delHandle(ids) {
|
||||
try {
|
||||
await tbShopAreaDelete(ids)
|
||||
this.tabVlaue = ''
|
||||
this.tbShopAreaGet()
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
// 台桌列表
|
||||
async tbShopTableGet() {
|
||||
try {
|
||||
const { content } = await tbShopTableGet({
|
||||
shopId: localStorage.getItem('shopId'),
|
||||
areaId: this.tabVlaue
|
||||
})
|
||||
this.tableList = content
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
// 获取区域
|
||||
async tbShopAreaGet() {
|
||||
try {
|
||||
const { content } = await tbShopAreaGet({
|
||||
shopId: localStorage.getItem('shopId')
|
||||
})
|
||||
this.tabs = content
|
||||
this.tbShopTableGet()
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-tabs {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.icon {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.table_list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20px;
|
||||
|
||||
.item {
|
||||
border: 1px solid #ddd;
|
||||
|
||||
.top {
|
||||
padding: 20px;
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
|
||||
.tips {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-top: 14px;
|
||||
}
|
||||
|
||||
&.row1 {
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
|
||||
.state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 40px;
|
||||
|
||||
.dot {
|
||||
$size: 6px;
|
||||
background-color: #67C23A;
|
||||
width: $size;
|
||||
height: $size;
|
||||
border-radius: 50%;
|
||||
margin-right: $size;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btm {
|
||||
border-top: 1px solid #ddd;
|
||||
background-color: #efefef;
|
||||
display: flex;
|
||||
|
||||
.btm_item {
|
||||
flex: 1;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
|
||||
&:nth-child(1),
|
||||
&:nth-child(2) {
|
||||
&::before {
|
||||
content: '';
|
||||
height: 50%;
|
||||
border-right: 1px solid #ddd;
|
||||
position: absolute;
|
||||
top: 25%;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.i {
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue