<script setup>
import { showSuccessToast, showFailToast } from "vant";
import { user } from "~/store";
const router = useRouter();
const { currentRoute } = useRouter();
let loading = $ref(false);
const route = currentRoute.value;
 let user_role_id=user.value.user_role_id
let ruleForm = $ref({
  user_avatar: "",
  user_realname: "",
  user_phone: "",
  gender: "",
  ue_jbxx_ju_bm: "",
  ue_jbxx_ju_zw: "",
  user_grade_num: "",
  user_grade_name: "",
  user_class_num: "",
  user_class_name: "",
  sm_id: "",
  sm_name: "",
  ue_jbxx_tea_rzxx: "",
  school:""
});
const notShow = ref(false);
const showGender = ref(false);
const showPhoto = ref(false);
const genderActions = [
  { name: "男", value: "1" },
  { name: "女", value: "2" },
];
const onGenderSelect = (item) => {
  showGender.value = false;
  ruleForm.gender = item.name;
};
const uploaderValue1 = ref(null);
const uploaderValue2 = ref(null);
const fileList = ref([]);
const actionsPhoto = [
  { name: "本地相册上传", value: "1" },
  { name: "拍照", value: "2" },
  { name: "删除头像", value: "3", color: "#E63333" },
];
const onSelectPhoto = (item) => {
  showPhoto.value = false;
  if (item.value == "1") {
    uploaderValue1.value.chooseFile()
  } else if (item.value == "2") {
    uploaderValue2.value.chooseFile()
  } else {
    if(user_role_id!="76"){
   ruleForm.user_avatar =
      "https://openapi.bozedu.net/template/default/static/img/avatar_teacher_big.png";
    }else{
      ruleForm.user_avatar =
      "https://openapi.bozedu.net/template/default/static/img/avatar_student_big.png";
    }
  }
};
// 文件读取后的处理函数
const afterRead = (fileList) => {
  const { file } = fileList;
  REQUEST.upload({
    url: "/upload/main/file",
    data: {
     filedata: file,
     urltype:"1",
     token:"2578JNWoda14HIszfo1XMxMCnciaz453i1vqe5oD2wIJF0sz49N5WVB2hSQTyKCyeq1UO8hYLQV9FbBH1Ba6U7sQAtiF7WI"
    },
  }).then((res) => {
    if (res.code == "1") {
      ruleForm.user_avatar = res.data.url;
    } else {
      return showFailToast(res.msg)
    }
  });
};

const onClickLeft = () => history.back();
const onCancel = () => {
  showPhoto.value = false;
  showGender.value = false;
};
//学校列表
let tableSchoolData = $ref([]);
const initSchoolData = async (data) => {
  loading = true;
  let res = await request({
    url: "/school/main/index",
    data: { limit: 10000},
  });
  if (res.code == 1) {
    tableSchoolData = res.data.page_data;
    loading = false;
  }
};
//年级列表
let tableGradeData = $ref([]);
const initGradeData = async (data) => {
  loading = true;
  let res = await request({
    url: "/txwx/jcxxgl_zyflgl_nj/index",
    data: { limit: 100 },
  });
  if (res.code == 1) {
    tableGradeData = res.data.page_data;
    loading = false;
  }
};
//班级列表
let tableClassData = $ref([]);
const initClassData = async (data) => {
  loading = true;
  let res = await request({
    url: "/txwx/jcxxgl_zyflgl_bj/index",
    data: { limit: 100 },
  });
  if (res.code == 1) {
    tableClassData = res.data.page_data;
    loading = false;
  }
};
let detailData = $ref({});
const handleDetail = async (data) => {
  if (user_role_id == "76") {
    await initGradeData();
    await initClassData();
  }
    await initSchoolData();
 
  loading = true;
  let res = await request({
    url: "/user/main/user_info",
    data: {
      user_id: user.value.user_id,
    },
  });
  if (res.code === "1") {
    detailData = res.data;
    ruleForm.user_avatar = detailData.user_avatar;
    ruleForm.user_realname = detailData.user_realname;
    ruleForm.gender = detailData.gender == "1" ? "男" : "女";
    ruleForm.user_grade_num = detailData.user_grade_num;
    ruleForm.sm_id = detailData.sm_id=="0"?'': detailData.sm_id;
    tableSchoolData.map((item) => {
      if (ruleForm.sm_id == item.id) {
        ruleForm.school = item.sm_name;
      }
    });
    tableGradeData.map((item) => {
      if (ruleForm.user_grade_num == item.tjzn_id) {
        ruleForm.user_grade_name = item.tjzn_njmc;
      }
    });
    ruleForm.user_class_num = detailData.user_class_num;
    tableClassData.map((item) => {
      if (ruleForm.user_class_num == item.tjzb_id) {
        ruleForm.user_class_name = item.tjzb_bjmc;
      }
    });
    ruleForm.user_phone = detailData.user_phone;
    ruleForm.ue_jbxx_ju_bm = detailData.ext.ue_jbxx_ju_bm;
    ruleForm.ue_jbxx_ju_zw = detailData.ext.ue_jbxx_ju_zw;
    ruleForm.ue_jbxx_tea_rzxx = detailData.ext.ue_jbxx_tea_rzxx;

    if (
      detailData.ext.ue_jbxx_tea_rzxx != "" &&
      detailData.ext.ue_jbxx_tea_rzxx != undefined &&
      detailData.ext.ue_jbxx_tea_rzxx != null
    ) {
      let rzInfo = JSON.parse(detailData.ext.ue_jbxx_tea_rzxx);
      let arr1 = [];
      if (rzInfo) {
        rzInfo.map((val) => {
          arr1.push(val.grade_name, val.class_name, val.xueke_name);
        });
      }
      ruleForm.ue_jbxx_tea_rzxx = arr1.join(" ");
    }
    loading = false;
  }
};
handleDetail();

const onClickRight = async () => {
  if (ruleForm.user_avatar == "") {
    ruleForm.user_avatar =
      "https://openapi.bozedu.net/template/default/static/img/avatar_student_big.png";
  }
  request({
    url: "/user/main/edit",
    data: {
      user_id: user.value.user_id,
      user_main: {
        user_avatar: ruleForm.user_avatar,
        gender: ruleForm.gender == "男" ? "1" : "2",
        user_phone: ruleForm.user_phone,
        ue_jbxx_ju_bm: ruleForm.ue_jbxx_ju_bm,
        ue_jbxx_ju_zw: ruleForm.ue_jbxx_ju_zw,
      },
    },
  }).then((res) => {
    if (res.code == 1) {
      showSuccessToast("操作成功");
      handleDetail();
    } else {
      showFailToast(res.msg);
    }
  });
};
</script>

<template>
  <div class="flex-col h-full overflow-hidden" v-cloak>
    <van-nav-bar
      title="个人资料"
      left-arrow
      right-text="保存"
      @click-left="onClickLeft"
      @click-right="onClickRight"
    >
      <template #left>
        <van-icon name="arrow-left" color="#323233" size="20px"></van-icon>
      </template>
    </van-nav-bar>
    <van-loading size="24px" vertical v-if="loading">加载中...</van-loading>
    <van-form v-else>
      <van-cell title="头像" @click="showPhoto = true">
        <template #right-icon>
          <img class="w-32px h-32px rounded-1/2" :src="ruleForm.user_avatar" />
        </template>
      </van-cell>
      <van-action-sheet
        v-model:show="showPhoto"
        title="选择照片"
        :actions="actionsPhoto"
        @select="onSelectPhoto"
        cancel-text="取消"
        close-on-click-action
        @cancel="onCancel"
      />
      <van-uploader v-show="notShow" ref="uploaderValue1" v-model="fileList" :after-read="afterRead"  reupload  >
      </van-uploader>
       <van-uploader v-show="notShow" ref="uploaderValue2" v-model="fileList" capture="camera"  :after-read="afterRead" reupload  >
      </van-uploader>
      <van-cell
        is-link
        title="性别"
        :value="ruleForm.gender"
        @click="showGender = true"
      />
      <van-action-sheet
        v-model:show="showGender"
        title="选择性别"
        :actions="genderActions"
        @select="onGenderSelect"
        cancel-text="取消"
        close-on-click-action
        @cancel="onCancel"
      />
      <van-field
        v-model="ruleForm.user_realname"
        label="姓名"
        input-align="right"
        disabled
      />
      <van-field
        v-if="user_role_id != '76'"
        v-model="ruleForm.user_phone"
        label="手机号码"
        input-align="right"
      />
     
      <van-field
        v-model="ruleForm.school"
        label="学校"
        input-align="right"
        disabled
      />
      <van-field
        v-if="user_role_id != '75'&&user_role_id != '76'"
        v-model="ruleForm.ue_jbxx_ju_bm"
        label="所属部门"
        input-align="right"
      /><van-field
        v-if="user_role_id != '75'&&user_role_id != '76'"
        v-model="ruleForm.ue_jbxx_ju_zw"
        label="职位"
        input-align="right"
      /><van-field
        v-if="user_role_id == '76'"
        v-model="ruleForm.user_grade_name"
        label="年级"
        input-align="right"
        disabled
      />
      <van-field
        v-if="user_role_id == '76'"
        v-model="ruleForm.user_class_name"
        label="班级"
        input-align="right"
        disabled
      >
      </van-field>
      <van-field
        class="rzxx"
        v-if="user_role_id == '75'"
        v-model="ruleForm.ue_jbxx_tea_rzxx"
        is-link
        readonly
        label="任教信息"
        @click="router.push('/userInfoEdit/teachingInfo')"
        input-align="right"
      />
    </van-form>
  </div>
</template>
<style lang="scss" scoped>
:deep(.van-cell__value) {
  color: #333;
}

:deep(.van-action-sheet__cancel) {
  color: #e63333;
}
</style>
