<template>
  <div class="wrapper">
    <NavHeader color="#0687D2" title="健康管理服务政策申报" @back="$router.go(-1)" />
    <van-form class="form" @submit="onSubmit" ref="form">
      <van-field
        v-model="form.address"
        :disabled="type === 'view'"
        autosize
        label="地址"
        required
        placeholder="请填写详细地址"
        type="textarea"
        :rules="[{ required: true, message: '请填写详细地址' }]"
      />
      <van-field
        v-model="form.remarks"
        :disabled="type === 'view'"
        autosize
        label="备注"
        type="textarea"
        placeholder="请填写备注"
      />
    </van-form>
    <van-button v-if="type === 'add'" block color="#0687D2" @click="$refs.form.submit()"
      >提交</van-button
    >
    <van-button v-if="type === 'edit'" block color="#0687D2" @click="$refs.form.submit()"
      >修改</van-button
    >
  </div>
</template>

<script>
import NavHeader from "@/components/NavHeader";
import Vue from "vue";
import { Form, Field, Button } from "vant";
import { mattersHealthyAdd, mattersHealthyUpdate, mattersGet } from "@/api/policy";

Vue.use(Form).use(Field).use(Button);

export default {
  components: { NavHeader },
  data() {
    return {
      type: "",
      code: "",
      userInfo: {},
      form: {
        address: "",
        remarks: "",
        departmentCode: "",
        guideId: "",
        talentCode: "",
        name: "",
        phone: "",
        userId: "",
      },
    };
  },
  methods: {
    init() {
      this.$toast.loading({
        duration: 0, // 持续展示 toast
        forbidClick: true,
        message: "加载中...",
      });
      mattersGet({ appId: 1234, code: this.code, matterType: 1 }).then((res) => {
        this.$toast.clear();
        this.form.address = res.address;
        this.form.remarks = res.remarks;
      });
    },
    onSubmit() {
      this.$toast.loading({
        duration: 0, // 持续展示 toast
        forbidClick: true,
        message: "加载中...",
      });
      if (this.type === "add") {
        mattersHealthyAdd({ appId: 1234, matterType: 1, ...this.form }).then((res) => {
          this.$toast.clear();
          this.$toast(res);
          setTimeout(() => {
            this.$router.go(-1);
          }, 500);
        });
      } else if (this.type === "edit") {
        mattersHealthyUpdate({
          appId: 1234,
          code: this.code,
          address: this.form.address,
          remarks: this.form.remarks,
          name: this.form.name,
          phone: this.form.phone,
        }).then((res) => {
          this.$toast.clear();
          this.$toast(res);
          setTimeout(() => {
            this.$router.go(-1);
          }, 500);
        });
      }
    },
  },
  created() {
    let res = sessionStorage.getItem("ZJCD-UserInfo");
    this.userInfo = JSON.parse(res) || {};
    this.form.departmentCode = this.$route.query.departmentCode;
    this.form.guideId = this.$route.query.guideId;
    this.form.talentCode = this.$route.query.talentCode;
    this.form.name = this.userInfo.realName;
    this.form.phone = this.userInfo.mobileNo;
    this.form.userId = this.userInfo.userId;
    this.code = this.$route.query.code;
    this.type = this.$route.query.type;
    if (this.code) {
      this.init();
    }
  },
};
</script>

<style lang="stylus" scoped>
.wrapper {
  .form {
    height calc(100vh - 173px)
    overflow-y: auto;
  }
}
</style>
