源文件

jeepay-ui-uapp-agent/pages/statistics/components/AgentCard.vue

@@ -0,0 +1,76 @@
+<template>
+  <view class="agent-wrapper" :style="{ padding: pd }">
+    <view class="agent-left">
+      <image :src="userImg" mode="scaleToFill" />
+      <view class="agent-info single-text-beyond" :style="{ color: nameColor, fontWeight: nameWeight }">
+        {{ name }}
+        <view :style="{ color: textColor }">{{ agentNo }}</view>
+      </view>
+    </view>
+    <image :src="arrowImg" mode="scaleToFill" />
+  </view>
+</template>
+
+<script setup>
+const props = defineProps({
+  userImg: {
+    type: String,
+    default: "/static/iconImg/user-white.svg",
+  },
+  arrowImg: {
+    type: String,
+    default: "/static/iconImg/right-arrow.svg",
+  },
+  name: {
+    type: String,
+  },
+  agentNo: {
+    type: String,
+  },
+  pd: {
+    type: String,
+  },
+  textColor: {
+    type: String,
+  },
+  nameColor: {
+    type: String,
+  },
+  nameWeight: {
+    type: String,
+  },
+})
+</script>
+
+<style lang="scss" scoped>
+.agent-wrapper {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  box-sizing: border-box;
+  .agent-left {
+    display: flex;
+    align-items: center;
+    image {
+      width: 82rpx;
+      height: 82rpx;
+      margin-right: 20rpx;
+    }
+    .agent-info {
+      width: 400rpx;
+      font-size: 28rpx;
+      color: #fff;
+      view {
+        margin-top: 10rpx;
+        font-size: 23rpx;
+        color: rgba(255, 255, 255, 0.6);
+      }
+    }
+  }
+  image {
+    width: 40rpx;
+    height: 40rpx;
+  }
+}
+</style>

jeepay-ui-uapp-agent/pages/statistics/components/AgentList.vue

@@ -0,0 +1,121 @@
+<template>
+  <JPopup ref="popup" @onClose="onClose">
+    <view class="list-wrapper">
+      <view class="list-header">
+        <view class="list-title">
+          <image src="/static/iconImg/left-black.svg" mode="scaleToFill" @tap="popup.close()" />
+          单个子代理商
+        </view>
+        <JSearchInput bgColor="#fff" wrapPd="0" @search="getAgentList" @resetSearch="resetSearch"></JSearchInput>
+      </view>
+      <scroll-view class="list-main" scroll-y @scrolltolower="getList">
+        <block v-for="v in list" :key="v.text">
+          <JLine v-bind="v" :isSelect="v.text === agentNo.text" @tap="selected(v)"></JLine>
+        </block>
+        <jeepayListNull :isShow="true" :list="list.length"></jeepayListNull>
+      </scroll-view>
+      <view class="list-footer">
+        <JButton size="max" pdTop="0" @HandleTouch="confirm">确认</JButton>
+      </view>
+    </view>
+  </JPopup>
+</template>
+
+<script setup>
+import { onMounted, reactive, ref } from "vue"
+import { $getAgentList } from "@/http/apiManager.js"
+import JPopup from "@/components/newComponents/JPopup/JPopup"
+import JLine from "@/components/newComponents/JLine/JLine"
+import JSearchInput from "@/components/newComponents/JSearchInput/JSearchInput"
+import JButton from "@/components/newComponents/JButton/JButton"
+import jeepayListNull from "@/components/jeepayListNull/jeepayListNull"
+onMounted(() => {
+  getAgentList("")
+})
+const emits = defineEmits(["confirm"])
+const searchInfo = ref({
+  pageNumber: 1,
+  pageSize: 10,
+})
+let flag = true
+const list = ref([])
+const agentNo = ref({})
+const popup = ref()
+const open = (val) => {
+  if (val) agentNo.value.text = val.agentNo
+  uni.hideTabBar()
+  popup.value.open()
+}
+const close = () => {
+  popup.value.close()
+}
+const getAgentList = (val) => {
+  if (val) {
+    list.value = []
+    searchInfo.value.unionAgentInfo = val
+  }
+  $getAgentList(searchInfo.value).then(({ bizData }) => {
+    const { records } = bizData
+    if (records.length <= 0) flag = false
+    records.forEach((v) => {
+      let obj = {
+        iconOn: "/static/navImg/nav-dailishang.svg",
+        iconClose: "/static/navImg/user-close.svg",
+        ml: "30rpx",
+        pd: "32rpx 32rpx 32rpx 0",
+      }
+      obj.name = v.agentName
+      obj.text = v.agentNo
+      list.value.push(obj)
+    })
+  })
+}
+const getList = () => {
+  if (!flag) return
+  searchInfo.value.pageNumber++
+  getAgentList()
+}
+const resetSearch = () => {
+  list.value = []
+  searchInfo.value.unionAgentInfo = ""
+  searchInfo.value.pageNumber = 1
+  searchInfo.value.pageSize = 10
+  getAgentList()
+}
+const selected = (v) => {
+  agentNo.value = JSON.parse(JSON.stringify(v))
+}
+const confirm = () => {
+  emits("confirm", agentNo.value)
+}
+defineExpose({ open, close })
+</script>
+
+<style lang="scss" scoped>
+.list-wrapper {
+  padding-top: 30rpx;
+  background-color: #ece8f0;
+  border-radius: 32rpx 32rpx 0 0;
+  .list-header {
+    padding: 0 30rpx 30rpx 30rpx;
+    .list-title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 30rpx;
+      image {
+        width: 50rpx;
+        height: 50rpx;
+        margin-right: 20rpx;
+      }
+    }
+  }
+  .list-main {
+    height: 500rpx;
+    background-color: #fff;
+  }
+  .list-footer {
+    padding: 30rpx 0 50rpx 0;
+    background-color: #fff;
+  }
+}
+</style>

jeepay-ui-uapp-agent/pages/statistics/components/SCard.vue

@@ -0,0 +1,67 @@
+<template>
+  <view class="s-card-wrapper" :class="{ isBorder: isBorder != undefined }">
+    <view class="s-card-title">{{ title }}</view>
+    <view class="tips" v-if="tips">{{ tips }}</view>
+    <view class="s-card-main">
+      <block v-for="(v, i) in list" :key="i">
+        <view class="s-card-item">
+          <view>{{ v.text }}</view>
+          {{ v.content }}
+        </view>
+      </block>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const props = defineProps({
+  list: {
+    type: Array,
+    default: () => [],
+  },
+  title: {
+    type: String,
+  },
+  tips: { type: String },
+  isBorder: { type: String },
+})
+</script>
+
+<style lang="scss" scoped>
+.s-card-wrapper {
+  margin-left: 70rpx;
+  margin-bottom: 50rpx;
+  border-bottom: 1rpx solid #e7e7e7;
+  .s-card-title {
+    font-size: 30rpx;
+    font-weight: 700;
+    margin-bottom: 50rpx;
+  }
+  .tips {
+    margin-bottom: 30rpx;
+    transform: translateY(-30rpx);
+    font-size: 24rpx;
+    color: #666;
+  }
+  .s-card-main {
+    display: flex;
+    flex-wrap: wrap;
+    .s-card-item {
+      flex: 0 0 50%;
+      font-size: 33rpx;
+      // font-weight: 700;
+      color: #7737fe;
+      margin-bottom: 50rpx;
+      view {
+        margin-bottom: 18rpx;
+        font-size: 25rpx;
+        font-weight: 500;
+        color: #8c8c8c;
+      }
+    }
+  }
+}
+.isBorder {
+  border: none;
+}
+</style>

jeepay-ui-uapp-agent/pages/statistics/components/SelectAgent.vue

@@ -0,0 +1,91 @@
+<template>
+  <JPopup ref="popup" @onClose="onClose">
+    <JMainCard pd="0" wrapPd=" 0 30rpx ">
+      <block v-for="(v, i) in list" :key="i">
+        <JLine :name="v.name" :isSelect="v.text == index" :isBorder="true" @tap="agentChange(v)"></JLine>
+      </block>
+      <view class="search-agent" @tap="emits('oneAgent')">
+        <JInput name="选择代理商" :image="true" :isBorder="true" v-if="!index || index == 'onlyOne'">
+          <image src="/static/iconImg/icon-right-jiantou.svg" mode="scaleToFill" />
+        </JInput>
+        <AgentCard v-else v-bind="childrenAgent" pd="30rpx"></AgentCard>
+      </view>
+    </JMainCard>
+
+    <JButton pd="30rpx 30rpx 50rpx 30rpx" bgColor="#f2f2f2" color="#000" pdTop="0" @HandleTouch="popup.close()"
+      >取消</JButton
+    >
+  </JPopup>
+</template>
+<script setup>
+import { reactive, ref } from "vue"
+import JPopup from "@/components/newComponents/JPopup/JPopup"
+import JMainCard from "@/components/newComponents/JMainCard/JMainCard"
+import JLine from "@/components/newComponents/JLine/JLine"
+import JInput from "@/components/newComponents/JInput/JInput"
+import JButton from "@/components/newComponents/JButton/JButton"
+import AgentCard from "./AgentCard.vue"
+const emits = defineEmits(["selected", "oneAgent"])
+const list = reactive([
+  {
+    name: "我与全部子代理商",
+    text: "",
+  },
+  {
+    name: "仅我自己",
+    text: "onlyOne",
+  },
+  {
+    name: "单个子代理商",
+    text: "one",
+  },
+])
+const index = ref("")
+const popup = ref()
+const childrenAgent = ref({
+  userImg: "/static/iconImg/user-theme.svg",
+  nameColor: "#000",
+  textColor: "#8C8C8C",
+  nameWeight: "700",
+})
+const open = (val) => {
+  if (val.agentNo && val.agentNo != "onlyOne") {
+    childrenAgent.value.name = val.name
+    childrenAgent.value.agentNo = val.agentNo
+    index.value = "one"
+  } else {
+    index.value = val.agentNo
+  }
+  uni.hideTabBar()
+  popup.value.open()
+}
+const onClose = () => {
+  uni.showTabBar()
+}
+const close = () => {
+  onClose()
+  popup.value.close()
+}
+const agentChange = (val) => {
+  if (val.text != "one") {
+    index.value = val.text
+    emits("selected", val)
+    close()
+  } else {
+    emits("oneAgent")
+  }
+}
+defineExpose({ open, close })
+</script>
+
+<style lang="scss" scoped>
+.search-agent {
+  margin: 0 30rpx 30rpx 30rpx;
+  border-radius: 10rpx;
+  background-color: #f2f2f2;
+  image {
+    width: 40rpx;
+    height: 40rpx;
+  }
+}
+</style>