czg_team/cashier_admin_app
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first

Browse Source
This commit is contained in:
YeMingfei666
2024-09-10 10:49:08 +08:00
parent b5fd06b800
commit dd4f5938da
6391 changed files with 722800 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

315
pageRed/list/search.vue Normal file
View File

@@ -0,0 +1,315 @@
<template>
<JeepayBackground>
<view class="input-wrapper">
<view class="input-main">
<uni-easyinput class='jeepay-search' :inputBorder="false" :placeholder="vdata.pageObject.searchPlaceholder"
v-model="vdata.searchVal" @focus="focus" @confirm="searchFunc">
<template #prefixIcon><image src="@/static/iconImg/icon-search.svg" class="input-icon" @tap="vdata.searchVal=''" /></template>
</uni-easyinput>
<button type="text" @click="searchFunc()">搜索</button>
<!-- <button v-show="!vdata.isSearch" type="text" @click="searchFunc">取消</button> -->
</view>
</view>
<JeepayTableList ref="tableRef" :reqTableDataFunc="reqTableDataFunc" :searchData="vdata.searchData" :initData="false">
<template #tableBody="{ record }">
<PayOrderRender v-if="vdata.pageType == 'payOrder'" :record="record" />
<MchAppRender v-if="vdata.pageType == 'mchApp'" :record="record" />
<WxmpUserRender v-if="vdata.pageType == 'wxmpUser'" :record="record" />
<MchApplymentRender v-if="vdata.pageType == 'mchApplyment'" :record="record" />
<MchStoreRender v-if="vdata.pageType == 'mchStore'" :record="record" />
<SysUserRender v-if="vdata.pageType == 'sysUser'" :record="record" />
<AppConfigRender v-if="vdata.pageType == 'payPassage'" :record="record" :configAppId="vdata.pageOptions.appId" />
<MemberRender v-if="vdata.pageType == 'member'" :record="record" />
<MemberRechargeRecordRender v-if="vdata.pageType == 'memberRechargeRecord'" :record="record" />
<MemberAccountHistoryRender v-if="vdata.pageType == 'memberAccountHistory'" :record="record" />
<!-- 设备的三个类型的搜索 -->
<DeviceCommonsRender v-if="vdata.pageType == 'qrc'" type="qrc" :record="record" />
<DeviceCommonsRender v-if="vdata.pageType == 'storeTerminal'" type="storeTerminal" :record="record" />
<DeviceCommonsRender v-if="vdata.pageType == 'device'" type="device" :record="record" />
<DeviceCommonsRender v-if="vdata.pageType == 'face'" type="face" :record="record" />
<FaceCardRender v-if="vdata.pageType == 'faceImgAd'" v-bind="record" />
<!-- 数据渲染: 动态组件： 微信小程序不支持 -->
<!-- <component ref="recordRenderComponentRef" :is="vdata.pageObject.component" :record="record" /> -->
</template>
</JeepayTableList>
</JeepayBackground>
</template>
<script setup>
import { reactive, ref, onMounted, nextTick } from 'vue';
import emit from '@/commons/utils/emit.js';
import go from '@/commons/utils/go.js';
import {
reqLoad,
API_URL_PAY_ORDER_LIST,
API_URL_MCH_APP_LIST,
API_URL_WXMP_USER_LIST,
API_URL_MCH_APPLYMENT_LIST,
API_URL_MCH_STORE_LIST,
API_URL_SYS_USER_LIST,
API_URL_PAY_PASSAGE_LIST,
API_URL_SYS_CODE_LIST,
API_URL_SYS_DEVICE_LIST,
API_URL_SYS_TERMINALS,
API_URI_PAY_AD_LIST,
API_URL_MEMBERS,
API_URL_MEMBER_RECHARGE_RECORDS,
API_URL_MEMBER_ACCOUNT_HISTORY
} from '@/http/apiManager.js';
import { onLoad, onUnload, onReachBottom } from '@dcloudio/uni-app';
import PayOrderRender from './render/PayOrderRender.vue';
import MchAppRender from './render/MchAppRender.vue';
import WxmpUserRender from './render/WxmpUserRender.vue';
import MchApplymentRender from './render/MchApplymentRender.vue';
import MchStoreRender from './render/MchStoreRender.vue';
import SysUserRender from './render/SysUserRender.vue';
import AppConfigRender from './render/AppConfigRender.vue';
import DeviceCommonsRender from './render/DeviceCommonsRender.vue';
import FaceCardRender from './render/FaceCardRender.vue';
import MemberRender from './render/MemberRender.vue';
import MemberRechargeRecordRender from './render/MemberRechargeRecordRender.vue';
import MemberAccountHistoryRender from './render/MemberAccountHistoryRender.vue';
onReachBottom(() => {});
const tableRef = ref();
const recordRenderComponentRef = ref(); // 数据渲染组件
// 定义所有的页面类型
const pageTypeMap = {
payOrder: {
// 支付订单列表
component: PayOrderRender, // 渲染组件
searchUrl: API_URL_PAY_ORDER_LIST,
searchField: 'unionOrderId', // 搜索字段
searchPlaceholder: '支付订单号、商户单号' // 显示名称
},
mchApp: {
// 商户应用
component: MchAppRender, // 渲染组件
searchUrl: API_URL_MCH_APP_LIST,
searchField: 'unionSearchId', // 搜索字段
searchPlaceholder: '应用APPID、名称' // 显示名称
},
wxmpUser: {
// 通知人管理
component: WxmpUserRender, // 渲染组件
searchUrl: API_URL_WXMP_USER_LIST,
searchField: 'nickname', // 搜索字段
searchPlaceholder: '昵称' // 显示名称
},
mchApplyment: {
// 进件
component: MchApplymentRender, // 渲染组件
searchUrl: API_URL_MCH_APPLYMENT_LIST,
searchField: 'unionSearchId', // 搜索字段
searchPlaceholder: '进件单号' // 显示名称
},
mchStore: {
// 门店
component: MchStoreRender, // 渲染组件
searchUrl: API_URL_MCH_STORE_LIST,
searchField: 'unionStoreInfo', // 搜索字段
searchPlaceholder: '门店名称、ID' // 显示名称
},
sysUser: {
// 用户管理
component: SysUserRender, // 渲染组件
searchUrl: API_URL_SYS_USER_LIST,
searchField: 'realname', // 搜索字段
searchPlaceholder: '姓名' // 显示名称
},
payPassage: {
// 支付通道配置
component: AppConfigRender, // 渲染组件
searchUrl: API_URL_PAY_PASSAGE_LIST,
searchField: 'wayCode', // 搜索字段
searchPlaceholder: '支付方式代码' // 显示名称
},
qrc: {
searchUrl: API_URL_SYS_CODE_LIST,
searchField: 'appSearchData',
searchPlaceholder: '搜索码牌名称，编号'
},
device: {
searchUrl: API_URL_SYS_DEVICE_LIST,
searchField: 'appSearchData',
searchPlaceholder: '搜索设备名称、编号'
},
storeTerminal: {
searchUrl: API_URL_SYS_TERMINALS,
searchField: 'trmName',
searchPlaceholder: '搜索辅助终端名称'
},
face: {
searchUrl: API_URL_SYS_DEVICE_LIST,
searchField: 'appSearchData',
searchPlaceholder: '搜索设备名称、编号'
},
faceImgAd:{
searchUrl: API_URI_PAY_AD_LIST,
searchField: 'title',
searchPlaceholder: '搜索广告标题'
},
// 会员管理
member: {
component: MemberRender, // 渲染组件
searchUrl: API_URL_MEMBERS,
searchField: 'unionQueryParam',
searchPlaceholder: '搜索手机号、会员名称'
},
// 会员充值记录
memberRechargeRecord: {
component: MemberRechargeRecordRender, // 渲染组件
searchUrl: API_URL_MEMBER_RECHARGE_RECORDS,
searchField: 'unionQueryParam',
searchPlaceholder: '搜索订单号、手机号、会员名称'
},
// 会员账户流水
memberAccountHistory: {
component: MemberAccountHistoryRender, // 渲染组件
searchUrl: API_URL_MEMBER_ACCOUNT_HISTORY,
searchField: 'unionQueryParam',
searchPlaceholder: '搜索充值单号、手机号、会员名称'
}
};
onLoad(option => {
vdata.pageOptions = option;
vdata.pageType = option.type;
vdata.pageObject = pageTypeMap[option.type];
// 特殊处理
if (vdata.pageType == 'payPassage') {
vdata.searchData.appId = option.appId;
}
// 特殊处理
if (vdata.pageType == 'device') {
vdata.searchData.deviceType = option.deviceType;
}
// 特殊处理
if (vdata.pageType == 'sysUser') { // 不查询普通用户。
vdata.searchData.isNotHasType2 = 1;
}
});
// 监听 更新事件
onUnload(() => uni.$off(emit.ENAME_REF_SEARCH_PAGE));
uni.$on(emit.ENAME_REF_SEARCH_PAGE, function(data) {
searchFunc();
});
const vdata = reactive({
pageOptions: {}, // 页面参数
pageType: '', // 页面类型
pageObject: {}, // 页面对象
searchVal: '', // 搜索值
searchData: {} ,// 搜索内容
});
// 请求
function reqTableDataFunc(params) {
return reqLoad.list(vdata.pageObject.searchUrl, params);
}
// 点击搜索事件
async function searchFunc(val) {
if(!vdata.searchVal.trim()) return;
vdata.searchData[vdata.pageObject.searchField] = vdata.searchVal;
tableRef.value.refTable(true); // 刷新列表页
}
const focus = () => {
vdata.isSearch = false
}
</script>
<style lang="scss" scoped>
.input-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 30rpx;
padding-top: 22rpx;
height: 110rpx;
background-color: $J-bg-ff;
.input-main {
flex: 1;
display: flex;
align-items: center;
height: 70rpx;
image {
padding: 22rpx;
width: 26rpx;
height: 26rpx;
}
input {
flex: 1;
font-size: 27rpx;
}
::v-deep uni-button {
font-size: 32rpx;
color: rgba(29,121,253,1);
background: rgba(255,255,255,1);
}
::v-deep.uni-easyinput {
.uni-easyinput__content {
background-color: $J-bg-f5 !important;
border-radius: $J-b-r12;
.uni-easyinput__content-input {
padding-left: 0 !important;
.uni-input-input {
border-radius: $J-b-r12 !important;
overflow: hidden !important;
}
}
.uni-input-placeholder {
font-size: 27rpx;
}
.uni-icons {
color: rgba(230,230,230,1) !important;
}
}
}
}
}
.input-icon{
position: relative;
z-index: 10;
}
.search-button{
position: absolute;
right: 0;
background-color: transparent !important;
color: transparent !important;
}
</style>