cashier_app/pages/shopSetUp/shopList.vue

162 lines
3.5 KiB
Vue

<template>
<view class="page-wrapper">
<view class="shopList">
<view class="tip">选择你要登录的门店</view>
<view class="shopList_item" @tap="createStore(item)" v-for="(item,index) in vdata.shopList" :key="index">
<view class="shopList_item_top">
<view class="shopList_item_top_left">
<text class="sort">{{index+1}}</text>
<up-avatar class="fileImg" :src="vdata.coverImg?vdata.coverImg:''"></up-avatar>
<view class="shopList_item_top_left_info">
<text class="shopName">双屿</text>
<text class="phone">15333333333</text>
</view>
</view>
<up-icon name="arrow-right" color="#999999" size="15"></up-icon>
</view>
<view class="shopList_item_bom">
<viwe class="shopList_item_bom_i">
<text class="name">今日实收</text>
<text class="num">0.00</text>
</viwe>
<viwe class="shopList_item_bom_i">
<text class="name">今日实收</text>
<text class="num">0.00</text>
</viwe>
<viwe class="shopList_item_bom_i">
<text class="name">今日实收</text>
<text class="num">0.00</text>
</viwe>
</view>
</view>
</view>
</view>
</template>
<script setup>
import { nextTick, reactive, ref } from 'vue';
import { onReachBottom, onShow, onUnload } from '@dcloudio/uni-app';
import go from '@/commons/utils/go.js';
// import { getShopList } from '@/http/api/shop.js'
const vdata = reactive({
shopList:[
{name: 1},
{name: 2},
]
});
onShow(() => {
// getshopList()
})
let getshopList = () => {
// getShopList().then((res) => {
// console.log(res)
// })
}
let createStore = () => {
go.back(1)
};
</script>
<style lang="scss" scoped>
.page-wrapper {
min-height: calc(100vh - 90rpx);
.shopList{
padding: 32rpx 28rpx;
box-sizing: border-box;
.tip{
width: 100%;
text-align: center;
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-bottom: 32rpx;
}
.shopList_item{
background-color: #fff;
border-radius: 12rpx;
padding: 32rpx 24rpx;
box-sizing: border-box;
display: flex;
flex-direction: column;
margin-bottom: 32rpx;
.shopList_item_top{
display: flex;
align-items: center;
justify-content: space-between;
.shopList_item_top_left{
display: flex;
align-items: center;
.sort{
margin-right: 28rpx;
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-left: 12rpx;
}
.fileImg{
width: 72rpx!important;
height: 72rpx!important;
margin-right: 24rpx;
::v-deep .u-avatar__image{
width: 72rpx!important;
height: 72rpx!important;
}
}
.shopList_item_top_left_info{
display: flex;
flex-direction: column;
.shopName{
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
.phone{
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 8rpx;
}
}
}
}
.shopList_item_bom{
display: flex;
align-items: center;
justify-content: space-between;
background: #F9F9F9;
border-radius: 12rpx;
padding: 32rpx 0 ;
box-sizing: border-box;
margin-top: 24rpx;
.shopList_item_bom_i{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.name{
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-bottom: 5rpx;
}
.num{
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
}
}
}
}
}
</style>