源文件

jeepay-ui-uapp-agent/pageWork/merchantManagement/merchantManagement.vue

@@ -0,0 +1,101 @@
+<template>
+  <view class="mch-wrapper bgF2">
+    <view class="mch-header">
+      <JHeaderTitle title="商户管理" bgColor="#f2f2f2" />
+      <JSearchInput
+        @search="searchList"
+        place="搜索商户名、用户号、联系人手机号"
+        @resetSearch="searchList"
+        ref="search"
+      ></JSearchInput>
+    </view>
+    <block v-for="(v, i) in useDataResult.dataList" :key="v.agentNo">
+      <JPreview
+        :title="v.mchName"
+        :qrcId="v.mchNo"
+        :img="imgList[v.state]"
+        :spot="v.state === 1 ? '#7737FE':'#B2B2B2'"
+        :status="v.state === 1 ? '已启用' : '已禁用'"
+        :isLast="useDataResult.dataList.length - 1 == i"
+        @tap="toDetail(v.mchNo)"
+      ></JPreview>
+    </block>
+    <jeepayListNull :isShow="true" :list="useDataResult.dataList.length" />
+    <view class="button-block"></view>
+    <view class="mch-footers">
+      <JButton pd="30rpx 30rpx 50rpx 30rpx" pdTop="0" @HandleTouch="createMch">创建商户</JButton>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, reactive, watch, onMounted } from "vue"
+import { onBackPress, onShow } from "@dcloudio/uni-app"
+import { $getMerList } from "@/http/apiManager.js"
+import useGetList from "@/hooks/useList.js"
+import JButton from "@/components/newComponents/JButton/JButton.vue"
+import JHeaderTitle from "@/components/newComponents/JHeaderTitle/JHeaderTitle.vue"
+import JSearchInput from "@/components/newComponents/JSearchInput/JSearchInput.vue"
+import JPreview from "@/components/newComponents/JPreview/JPreview.vue"
+import jeepayListNull from "@/components/jeepayListNull/jeepayListNull"
+
+const { useDataResult, getList } = useGetList({
+  requestFun: $getMerList,
+})
+
+// 获取搜索组件暴露出来的数据
+const search = ref()
+onBackPress(() => {
+  if (search.value.searchText != "") {
+    search.value.searchText = ""
+    list(search.value.searchText)
+    return true
+  } else {
+    return false
+  }
+})
+
+// 下拉 加载数据
+
+// 搜索回调
+const searchList = (data) => {
+  if (data === "reset") data = ""
+  getList({ unionMchInfo: data })
+}
+const imgList = reactive(["/static/navImg/disable-shangdian.svg", "/static/navImg/nav-shangdian.svg"])
+// 跳转创建商户
+const createMch = () => {
+  uni.navigateTo({
+    url: "./addMch",
+  })
+}
+function toDetail(mchNo) {
+  uni.navigateTo({
+    url: "./merchantDetail?mchNo=" + mchNo,
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.mch-wrapper {
+  width: 100%;
+  min-height: 100vh;
+  .mch-header {
+    position: sticky;
+    top: 0;
+    z-index: 100;
+    background-color: #f2f2f2;
+  }
+  .button-block {
+    height: 210rpx;
+  }
+  .mch-footers {
+    position: fixed;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    backdrop-filter: blur(30px);
+    border-top: 1px solid rgba($color: #000000, $alpha: 0.1);
+  }
+}
+</style>