131 lines
4.7 KiB
Vue
131 lines
4.7 KiB
Vue
<script setup lang="ts">
|
||
import { ref, reactive, onMounted, nextTick } from "vue"
|
||
import { onLoad, onShow } from "@dcloudio/uni-app"
|
||
|
||
import { merchantApi } from "@@/api"
|
||
import * as hooks from "@@/hooks"
|
||
import * as router from "@@/router"
|
||
import { filePath } from "@@/utils/file"
|
||
import zTabs from "@@/components/other/z-tabs/z-tabs.vue"
|
||
import { SERVICE_IMAGE } from "@@/constant/index"
|
||
|
||
const crudLayoutRef = ref<any>(null)
|
||
const pageRef = ref<any>(null)
|
||
const state = reactive<any>({
|
||
pa: {
|
||
pagesize: 10,
|
||
type: "2",
|
||
name: "",
|
||
catgoryId: null,
|
||
},
|
||
tabs: [{ id: null, name: "全部", disabled: false }],
|
||
})
|
||
const pageHook = hooks.usePage(pageRef, merchantApi.page, null, "data.records")
|
||
|
||
const query = (page: number, pagesize: number) => {
|
||
pageHook.startPage(page, pagesize, false, state.pa)
|
||
}
|
||
|
||
onLoad(async () => {
|
||
|
||
try {
|
||
const res: any = await merchantApi.selectCatgory({ current: 1, size: 99999 })
|
||
if (res.code == 0) {
|
||
state.tabs = state.tabs.concat(res.data)
|
||
} else {
|
||
state.tabs = [{ id: null, name: "全部", disabled: false }]
|
||
}
|
||
} catch (error: any) {
|
||
uni.showToast({ title: error, icon: "none" })
|
||
}
|
||
})
|
||
onShow(() => {
|
||
pageRef.value && pageRef.value.reload(false)
|
||
})
|
||
|
||
const search = () => {
|
||
pageRef.value && pageRef.value.reload(true)
|
||
}
|
||
onMounted(() => {
|
||
nextTick(() => {
|
||
crudLayoutRef.value?.checkVerifyDevice?.()
|
||
})
|
||
})
|
||
|
||
const doTab = (e: any) => {
|
||
const target = state.tabs[e]
|
||
state.pa.catgoryId = target.id
|
||
pageRef.value.reload(true)
|
||
}
|
||
|
||
const toDetail = async (v: any) => {
|
||
const isLogin = await hooks.useCheckLogin()
|
||
if (isLogin) {
|
||
if (v.supType && v.supType == "10") return router.jump("/pages/merchant/brandDetail", { parentId: v.id })
|
||
if (v.supType && v.supType == "20") return router.jump("/pages/merchant/detail", { id: v.id })
|
||
if (v.supType && v.supType == "50") return router.jump("/pages/merchant/brandDetail", { parentId: v.id })
|
||
uni.showToast({ title: "合作商家类型未知", icon: "none" })
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<crud-layout title="合作商家" :bg="filePath(SERVICE_IMAGE.blueBg)" ref="crudLayoutRef">
|
||
<z-paging ref="pageRef" height="100%" :fixed="false" v-model="pageHook.list" :default-page-size="10"
|
||
safe-area-inset-bottom :loading-more-enabled="true" :show-scrollbar="false" @query="query"
|
||
:auto-clean-list-when-reload="false" :auto-scroll-to-top-when-reload="false" @scroll="pageHook.scroll">
|
||
<template #top>
|
||
<view class="h-30rpx" />
|
||
<view class="flex w-full border-4rpx border-solid border-#0779fd rounded-14rpx p-r-10rpx">
|
||
<tm-input class="flex-1" v-model="state.pa.name" type="text" height="72" minHeight="72"
|
||
fontSize="28" :showClear="true" :focus="false" placeholder="请输入商家名称" width="100%"
|
||
:focus-highlight="false" color="#ECF4F9">
|
||
<template v-slot:rightIcon>
|
||
<tm-button class="mr-8rpx px-24rpx py-26rpx text-30rpx!" size="xs" @click="search">
|
||
搜索
|
||
</tm-button>
|
||
</template>
|
||
</tm-input>
|
||
</view>
|
||
<view class="bg-white rounded-16rpx px-20rpx my-20rpx">
|
||
<z-tabs :list="state.tabs" @change="doTab" />
|
||
</view>
|
||
</template>
|
||
|
||
<view class="flex-row card p-20rpx m-b-20rpx" v-for="(v, i) in pageHook.list" :key="i" @tap="toDetail(v)">
|
||
<image class="w-180rpx h-180rpx rounded-12rpx my-auto" :src="filePath(v.logoPic)" mode="aspectFill" />
|
||
<view class="flex-1 flex-col m-l-20rpx">
|
||
<view class="sub-text-34">
|
||
<text class="mr-16rpx">{{ v.name }}</text>
|
||
<!-- <tm-tag v-if="v.supType == '10' && Number(v.mchCount) > 0" size="xs" skin="thin">共{{ v.mchCount }}家</tm-tag> -->
|
||
</view>
|
||
<view class="m-t-10rpx">
|
||
<view class="flex justify-between items-center">
|
||
<view class="flex-1">
|
||
<view v-if="v.phone" class="flex items-center">
|
||
<image class="w-24rpx h-24rpx" src="@/static/page/phone.svg" />
|
||
<view class="second-text-28 ml-8rpx">{{ v.phone }}</view>
|
||
</view>
|
||
</view>
|
||
<tm-tag class="max-w-160rpx" size="xs">{{ v.deptName.length > 5 ? v.deptName.substring(0, 5)
|
||
+ "..." :
|
||
v.deptName }}</tm-tag>
|
||
</view>
|
||
<view class="second-text-24">
|
||
<view v-if="v.jobTime != ',,'" class="second-text-28">营业时间：</view>
|
||
<view>{{ v.jobTime?.split(",")[0] ? "早：" + v.jobTime?.split(",")[0] : "" }}</view>
|
||
<view>{{ v.jobTime?.split(",")[1] ? "中：" + v.jobTime?.split(",")[1] : "" }}</view>
|
||
<view>{{ v.jobTime?.split(",")[2] ? "晚：" + v.jobTime?.split(",")[2] : "" }}</view>
|
||
</view>
|
||
<view v-if="v.addressDes" class="second-text-28">
|
||
<image class="w-24rpx h-24rpx" src="@/static/page/address.svg" />
|
||
<text class="ml-8rpx">地址:</text>
|
||
<text class="m-l-10rpx">{{ v.addressDes }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</z-paging>
|
||
</crud-layout>
|
||
</template>
|