HS_MZAP/src/views/activityMan/selfMeetingReport/selfMeetingInfo.vue

<template>
  <van-nav-bar
    fixed
    title="私设聚会点"
    left-text=""
    left-arrow
    @click-left="onClickLeft"
  />
  <van-loading size="16px" v-if="isLoading">加载中...</van-loading>
  <div class="main" v-if="!isLoading">
    <div class="banner">
      <h2>扎实提升“三力”</h2>
      <h2>深入推进“三化”</h2>
      <h2>坚持“三个思维”</h2>
    </div>
    <div class="info">
      <p>地点:{{ inputForm.placeSelectName }}</p>
      <p>详细地点:{{ inputForm.placeDel }}</p>
      <p>频次:{{ inputForm.frequency }}</p>
      <p>时间：{{ inputForm.partyTime }}</p>
      <p>相关人：{{ inputForm.relatedPersons.name }}</p>
      <p>内容：{{ inputForm.content }}</p>
    </div>
    <van-button type="primary" class="btn-sub">审核</van-button>
  </div>
</template>
    
    <script>
import { ref } from "vue";
import { useRoute } from "vue-router";
import PrivatePartyPointService from "@/api/privateparty/PrivatePartyPointService";
import UserManage from "@/api/user/UserManage";
export default {
  setup() {
    const onClickLeft = () => {
      history.back();
    };
    // 加载
    let isLoading = ref(true);
    // 异常人员信息
    let inputForm = ref({
      id: "",
      place: "320900",
      placeSelectName: "盐城市",
      placeSelectType3: "320900",
      placeSelectType4: "",
      placeSelectType5: "",
      placeSelectType6: "",
      placeDel: "",
      frequency: "",
      partyTime: "",
      relatedPersons: {
        id: "",
        name: "",
      },
      content: "",
      state: "0",
      assessment: "0",
    });
    // 获取信息
    let route = useRoute();
    new PrivatePartyPointService().queryById(route.query.id).then((data) => {
      inputForm.value = data;
      let ids = data.relatedPersons.id.split(",");
      inputForm.value.relatedPersons.name = "";
      ids.forEach((item) => {
        new UserManage().queryById(item).then((data) => {
          inputForm.value.relatedPersons.name += data.name + ",";
        });
      });
      isLoading.value = false;
    });
    return {
      onClickLeft,
      inputForm,
      isLoading,
    };
  },
};
</script>
    
<style lang="less">
.main {
  background: #fff;
  position: relative;
  top: 40px;
}
.banner {
  background-color: #36a7f3;
  padding: 20px 50px 40px 50px;
  color: #fff;
  h2 {
    &:nth-child(1) {
      margin-top: 0px;
      text-align: left;
    }
    &:nth-child(2) {
      text-align: center;
    }
    &:nth-child(3) {
      text-align: right;
    }
  }
}
.info {
  position: relative;
  width: 86vw;
  // height: 120px;
  margin: 10px auto;
  padding: 10px;
  background: #fff;
  border-radius: 20px;
  top: -50px;
  font-size: 14px;
}
.btn-sub {
  width: 90%;
  border-radius: 20px;
  margin-left: 5%;
}
.van-loading {
  text-align: center;
  margin-top: 80px;
}
</style>