usky-web-mobile/src/pages/business/mhxf/xunJian/plan/components/drawer.vue

<template>
  <u-popup :show="scanBool" @close="close" @open="open" mode="bottom" :data-theme="'theme-' + proxy.$settingStore.themeColor.name">
    <template #default>
      <view class="mb15 mt15">
        <h4 style="font-size: 16px; color: #149eff; text-align: center; margin-bottom: 10px">请选择计划</h4>
        <view style="font-size: 12px; color: #b7b7b7; text-align: center"> 当前地点存在于多个计划,请选择目标计划 </view>
      </view>
      <scroll-view scroll-y class="pl15 pr15" style="height: calc(100vh - 30rem)">
        <view v-for="(scan, index) in scanArray" :key="index">
          <view style="display: flex; font-size: 15px; height: 50px; line-height: 50px">
            <view style="margin-right: 15px">
              <img src="@/static/images/xunjian/plan-scan-drawer.png" alt="" />
            </view>
            <view>{{ scan.planName }} </view>
            <view style="margin: auto"></view>
            <view style="margin: auto 0">
              <u-button type="primary" shape="circle" style="height: 25px; font-size: 13px" @click="reportClick(scan.siteId, scan.id)"> 上报 </u-button>
            </view>
          </view>

          <view style="border-bottom: 1.5px #dad7d7 solid"></view>
        </view>
      </scroll-view>
    </template>
  </u-popup>
</template>

<script setup>
import { onLoad, onShow } from "@dcloudio/uni-app";
import { ref, onMounted, inject, shallowRef, watchEffect } from "vue";
import { publicStores, xunJianStores } from "@/store/modules/index";

const xunJianStore = xunJianStores(); //全局变量值Store

const props = defineProps({
  scanArray: {
    type: Object,
    default: null,
  },
  scanBool: {
    type: Boolean,
    default: null,
  },
});
const emit = defineEmits(["scanClose"]);

const scanArray = ref(props.scanArray);
const scanBool = ref(false);

/**
 * @巡检上报
 * @按钮点击事件
 */
function reportClick(siteId, planSonId) {
  xunJianStore.contentArray = {};
  xunJianStore.siteNubmber = undefined;
  xunJianStore.siteId = siteId;
  xunJianStore.planSonId = planSonId;

  uni.navigateTo({
    url: "/pages/business/mhxf/xunJian/plan/components/siteDetails",
  });
}

/**
 * @开启抽屉时执行
 */
function open() {}

/**
 * @关闭抽屉时执行
 */
function close() {
  scanBool.value = false;
  emit("scanClose", false);
}

/**
 * @监听器
 */
watchEffect((fn, options) => {
  scanBool.value = props.scanBool;
});

onLoad((options) => {});

onMounted(() => {});
</script>