cashier_admin_app/pageDevice/staffManage/staffManage.vue

110 lines
2.6 KiB
Vue

<template>
<view class="page-wrapper">
<JeepayCustomNavbar title="成员管理" backCtrl="back" />
<view class="sta-input" @tap="go.toSearchPage('sysUser')">
<view class="input-main">
<image src="/static/iconImg/icon-search.svg" mode="scaleToFill" />
搜索成员姓名
</view>
<!-- <image class="icon-more" src="/static/iconImg/icon-more.svg" mode="scaleToFill" /> -->
</view>
<JeepayTableList ref="jeepayTableListRef" :reqTableDataFunc="reqTableDataFunc">
<template #tableBody="{ record }">
<SysUserRender :record="record" />
</template>
</JeepayTableList>
<view class="footer-wrapper">
<view class="footer-button footer-button-style">
<button hover-class="hover-button" hover-stay-time="150" class="flex-center" @tap="createStaff">创建</button>
</view>
</view>
</view>
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
</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 emit from '@/commons/utils/emit.js';
import { reqLoad, API_URL_SYS_USER_LIST } from '@/http/apiManager.js';
import SysUserRender from '@/pages/list/render/SysUserRender.vue';
const jeepayTableListRef = ref();
const jeepayPopupConfirmRef = ref();
onReachBottom(() => {});
// // 监听 更新事件
onUnload(() => uni.$off(emit.ENAME_REF_SYS_USER_LIST));
uni.$on(emit.ENAME_REF_SYS_USER_LIST, function (data) {
jeepayTableListRef.value.refTable(true);
});
// 请求
function reqTableDataFunc(params) {
// 不查询普通用户
params.isNotHasType2 = 1;
return reqLoad.list(API_URL_SYS_USER_LIST, params);
}
// 创建员工
const createStaff = () => {
go.to('PAGES_USER_EDIT');
};
</script>
<style lang="scss" scoped>
.sta-input {
display: flex;
align-items: center;
padding: 0 30rpx;
height: 110rpx;
background-color: $J-bg-ff;
.input-main {
flex: 1;
display: flex;
align-items: center;
height: 70rpx;
background-color: $J-bg-f5;
border-radius: $J-b-r12;
color: rgba(0, 0, 0, 0.35);
font-size: 27rpx;
font-weight: 400;
image {
padding: 22rpx;
width: 26rpx;
height: 26rpx;
}
}
.icon-more {
margin-left: 30rpx;
width: 70rpx;
height: 70rpx;
}
}
.footer-wrapper {
height: 170rpx;
background-color: transparent;
.footer-button {
position: fixed;
left: 0;
right: 0;
bottom: 0;
padding: 30rpx;
button {
height: 110rpx;
font-size: 33rpx;
font-weight: 500;
color: $J-color-tff;
border-radius: 20rpx;
background: $jeepay-bg-primary;
}
.hover-button {
opacity: 0.5;
}
}
}
</style>