HS_MZAP/src/views/activityMan/differentbelievers/ReligiousPeopleReportInfo.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.abnormalName }}</p>
      <p>人员身份证号:{{ inputForm.abnormalIdcar }}</p>
      <p>
        性别:
        <span v-if="inputForm.sex == 1">男</span>
        <span v-if="inputForm.sex == 2">女</span>
      </p>
      <p>手机号:{{ inputForm.abnormalPhone }}</p>
      <p>籍贯:{{ inputForm.nativePlace }}</p>
      <p>现居地:{{ inputForm.currentResidence }}</p>
      <p>现居地详情:{{ inputForm.currentResidenceDetail }}</p>
      <p>异常行为:{{ inputForm.abnormalBehavior }}</p>
    </div>
    <van-button
      v-if="inputForm.assessment == 0"
      type="primary"
      class="btn-sub"
      @click="update"
      >审核</van-button
    >
  </div>
</template>
      
      <script>
import { ref } from "vue";
import { useRoute } from "vue-router";
import ReligiousPeopleReportService from "@/api/differentbelievers/ReligiousPeopleReportService";
export default {
  setup() {
    const onClickLeft = () => {
      history.back();
    };
    // 加载
    let isLoading = ref(true);
    // 异常人员信息
    let inputForm = ref({
      id: "",
      abnormalName: "",
      abnormalIdcar: "",
      sex: "",
      abnormalPhone: "",
      nativePlace: "",
      currentResidence: "",
      currentResidenceDetail: "",
      abnormalBehavior: "",
      state: "0",
      assessment: "0",
      currentResidenceId: "",
      currentResidenceLevel1: "",
      currentResidenceLevel2: "",
      currentResidenceLevel3: "",
      currentResidenceLevel4: "",
      currentResidenceLevel5: "",
      currentResidenceLevel6: "",
    });
    // 获取信息
    let route = useRoute();
    new ReligiousPeopleReportService()
      .queryById(route.query.id)
      .then((data) => {
        inputForm.value = data;
        isLoading.value = false;
      });
    // 审核通过
    const update = () => {
      isLoading.value = true;
      inputForm.value.assessment = 1;
      new ReligiousPeopleReportService().save(inputForm.value).then((res) => {
        console.log(res);
        onClickLeft();
        isLoading.value = false;
      });
    };
    return {
      onClickLeft,
      inputForm,
      isLoading,
      update,
    };
  },
};
</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>