176 lines
3.6 KiB
Vue
176 lines
3.6 KiB
Vue
<template>
|
|
<ul class="liststyle">
|
|
<li v-for="item in datas.list " :key="item.id">
|
|
<view class="">
|
|
<view class="">
|
|
<span style="font-size: 28rpx;color: #333333; ">{{item.name}} </span>
|
|
<span style="font-size: 24rpx;color: #999; ">{{item.code}}</span>
|
|
</view>
|
|
<view class="" style="font-size: 24rpx;color: #666666;">
|
|
{{item.account}}
|
|
</view>
|
|
</view>
|
|
<view class="">
|
|
<view style="display: flex;justify-content: center;align-items: center;">
|
|
<span style="font-size: 28rpx;color: #999999;">是否启用</span>
|
|
<up-switch :activeValue="1" :inactiveValue="0" v-model="item.status" size="18"
|
|
@change="switch2Change($event,item)"></up-switch>
|
|
</view>
|
|
<view class="df">
|
|
<up-button size="small" style="border-radius: 28rpx 28rpx 28rpx 28rpx;"
|
|
@tap="datas.show = true;datas.rolesId=item.id" text="删除"></up-button>
|
|
<up-button type="primary" plain size="small"
|
|
style="border-radius: 28rpx 28rpx 28rpx 28rpx;margin-left: 16rpx;" @tap="toUrl(item)"
|
|
text="编辑"></up-button>
|
|
</view>
|
|
</view>
|
|
</li>
|
|
<li style="background-color: rgba(0,0,0,0);"></li>
|
|
</ul>
|
|
<view v-if="datas.list.length==0" style="text-align: center;">
|
|
<image src="./bg.png" style="width: 325rpx;height: 335rpx;" mode=""></image>
|
|
<view style="font-size: 28rpx;color: #999;">暂无员工</view>
|
|
</view>
|
|
<view class="bottomBotton" @tap="toUrl">
|
|
添加员工
|
|
</view>
|
|
<!-- 删除确认框 -->
|
|
<up-modal :show="datas.show" contentTextAlign="center" showCancelButton @confirm='delTableHandle'
|
|
@cancel='datas.show=false' content='是否确认删除？'></up-modal>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
reactive,
|
|
ref,
|
|
watch,
|
|
onMounted
|
|
} from 'vue';
|
|
import {
|
|
onShow
|
|
} from '@dcloudio/uni-app';
|
|
import go from '@/commons/utils/go.js';
|
|
import {
|
|
rolesGet,
|
|
shopStaffDelete,
|
|
updateStatus
|
|
} from "@/http/yskApi/requestAll.js"
|
|
let datas = reactive({
|
|
list: [],
|
|
show: false,
|
|
// 删除员工id
|
|
rolesId: ""
|
|
})
|
|
onShow(() => {
|
|
getList()
|
|
})
|
|
|
|
function delTableHandle() {
|
|
shopStaffDelete(
|
|
[datas.rolesId]
|
|
)
|
|
datas.show = false
|
|
setTimeout(() => {
|
|
getList()
|
|
}, 500)
|
|
}
|
|
|
|
function toUrl(d) {
|
|
if (d.id) {
|
|
go.to('PAGES_ADD_STAFF', {
|
|
type: '',
|
|
id: d.id
|
|
})
|
|
} else {
|
|
go.to('PAGES_ADD_STAFF', {
|
|
type: 'add',
|
|
})
|
|
}
|
|
}
|
|
|
|
function switch2Change(e, d) {
|
|
updateStatus({
|
|
id: d.id,
|
|
status: e
|
|
}).then(res => {
|
|
setTimeout(() => {
|
|
getList()
|
|
}, 500)
|
|
})
|
|
}
|
|
|
|
function getList() {
|
|
rolesGet({
|
|
shopId: uni.getStorageSync("shopId"),
|
|
page: 0,
|
|
size: 100
|
|
}).then((res) => {
|
|
datas.list = res.content
|
|
})
|
|
}
|
|
</script>
|
|
<style>
|
|
page {
|
|
background-color: #f9f9f9;
|
|
}
|
|
</style>
|
|
<style lang="less" scoped>
|
|
// * {
|
|
// padding: 0;
|
|
// margin: 0;
|
|
// text-decoration: none;
|
|
// outline: none;
|
|
// }
|
|
|
|
|
|
|
|
ul,
|
|
li {
|
|
list-style: none;
|
|
}
|
|
|
|
.liststyle {
|
|
>li {
|
|
// width: 694rpx;
|
|
height: 192rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
|
padding: 0 16rpx;
|
|
margin: 32rpx 16rpx;
|
|
|
|
>view {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
height: 96rpx;
|
|
|
|
}
|
|
|
|
>view:first-child {
|
|
border-bottom: 2rpx solid #E5E5E5;
|
|
}
|
|
}
|
|
}
|
|
|
|
.bottomBotton {
|
|
width: 530rpx;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
text-align: center;
|
|
background: #318AFE;
|
|
border-radius: 56rpx 56rpx 56rpx 56rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 500;
|
|
font-size: 32rpx;
|
|
color: #FFFFFF;
|
|
position: fixed;
|
|
bottom: 20rpx;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
|
|
.df {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
</style> |