<script>
import graceChecker from "@/common/graceChecker";
import StaticConstant from "@/common/StaticConstant";
import ApiConstant from "@/common/ApiConstant";
import Request from '@/common/request'
let request = new Request()
export default {
  name: "socre-edit",
  data() {
    return {
      scoreInfo: {
        province: '河南',//省份
        cognitioPolyclinic: '理科',//科类
        professionalCategory: '美术类',//报考方向
        culturalScore: '',//文化分
        professionalScore: '',//统考分
        chineseScore:'',
        englishScore:''
      },
      provinceArray:[{name:"河南"}],//
      cognitioPolyclinicArray:StaticConstant.categoryList,
      professionalCategoryArray:StaticConstant.professionalCategoryList
    }
  },
  onShow() {
    this.getUserScore()
  },
  methods: {
    //获取用户的分数信息
    getUserScore() {
      request.get(ApiConstant.Score.getScore, {}).then(res => {
        if (res.success) {
          this.scoreInfo = res.result
        }
      }).catch(err => {
      }).finally(() => {
      });
    },
    //保存用户的分数信息
    saveScore(){
      request.post(ApiConstant.Score.scoreSave, {
        ...this.scoreInfo
      }).then(res => {
        if (res.success) {
          setTimeout(function () {
            uni.showToast({title: '保存成功', icon: "none"});
            uni.navigateBack({
              delta: 1,
              complete: () => {
                uni.startPullDownRefresh()
              }
            });
          }, 500)
        }
      }).catch(err => {
      }).finally(() => {
      });
    },
    //选择考区
    bindPicker_provinceChange: function(e) {
      console.log('考区picker发送选择改变，携带值为：' + e)
      this.scoreInfo.province = this.provinceArray[e.detail.value].name
    },
    //选择科目
    bindPicker_cognitioPolyclinicChange: function(e) {
      console.log('科目picker发送选择改变，携带值为：' + e.detail.value)
      this.scoreInfo.cognitioPolyclinic = this.cognitioPolyclinicArray[e.detail.value].name
    },
    //选择报考方向
    bindPicker_professionalCategoryChange:function (e){
      console.log('报考方向picker发送选择改变，携带值为：' + e.detail.value)
      this.scoreInfo.professionalCategory = this.professionalCategoryArray[e.detail.value].value
    },
    formSubmit: function (e) {
      let that = this
      console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
      //定义表单规则
      var rule = [
        {name: "culturalScore", checkType: "between", checkRule: "0,750", errorMsg: "文化分0~750之间"},
        {name: "professionalScore", checkType: "between", checkRule: "0,450", errorMsg: "统考分0~450之间"},
        /*{name: "culturalScore", checkType: "string", checkRule: "1,3", errorMsg: "姓名应为1-3个字符"},
        {name: "gender", checkType: "in", checkRule: "男,女", errorMsg: "请选择性别"},
        {name: "loves", checkType: "notnull", checkRule: "", errorMsg: "请选择爱好"}*/
      ];
      //进行表单检查
      var formData = e.detail.value;
      var checkRes = graceChecker.check(formData, rule);
      if (checkRes) {
        uni.showModal({
          title:'确认高考成绩',
          content: '文化分：'+this.scoreInfo.culturalScore+'\r统考分：'+this.scoreInfo.professionalScore,
          confirmText: '确定',
          cancelText: '取消',
          success:function (res){
            if (res.confirm) {
              that.saveScore()
            }
          }
        });
      } else {
        uni.showToast({title: graceChecker.error, icon: "none"});
      }
    },
    formReset: function (e) {
      console.log('清空数据')
    }
  }
}
</script>

<template>
  <view>
<!--    <page-head title=""></page-head>-->
    <view class="uni-padding-wrap">
      <view class="uni-title uni-common-mt">
        统考/省联考成绩
        <text>\n暂仅支持统考及省组织的联考科类成绩评估</text>
      </view>
    </view>
    <view class="uni-padding-wrap uni-common-mt">
      <form class="form" @submit="formSubmit" @reset="formReset">
        <view class="uni-form-item uni-column">
          <view class="title">考区<span class="red">*</span></view>
          <view class="uni-list">
            <view class="uni-list-cell">
              <view class="uni-list-cell-left">
                当前选择
              </view>
              <view class="uni-list-cell-db">
                <picker @change="bindPicker_provinceChange" :value="scoreInfo.province" :range="provinceArray" range-key="name">
                  <view class="uni-input">{{scoreInfo.province}}</view>
                </picker>
              </view>
            </view>
          </view>
        </view>
        <view class="uni-form-item uni-column">
          <view class="title">科目<span class="red">*</span></view>
          <view class="uni-list">
            <view class="uni-list-cell">
              <view class="uni-list-cell-left">
                当前选择
              </view>
              <view class="uni-list-cell-db">
                <picker @change="bindPicker_cognitioPolyclinicChange" :value="scoreInfo.cognitioPolyclinic" :range="cognitioPolyclinicArray" range-key="name">
                  <view class="uni-input">{{scoreInfo.cognitioPolyclinic}}</view>
                </picker>
              </view>
            </view>
          </view>
        </view>
        <view class="uni-form-item uni-column">
          <view class="title">报考方向<span class="red">*</span></view>
          <view class="uni-list">
            <view class="uni-list-cell">
              <view class="uni-list-cell-left">
                当前选择
              </view>
              <view class="uni-list-cell-db">
                <picker @change="bindPicker_professionalCategoryChange" :value="scoreInfo.professionalCategory" :range="professionalCategoryArray" range-key="value">
                  <view class="uni-input">{{scoreInfo.professionalCategory}}</view>
                </picker>
              </view>
            </view>
          </view>
        </view>
        <view class="uni-form-item uni-column">
          <view class="title">文化分<span class="red">*</span></view>
          <input class="uni-input" v-model="scoreInfo.culturalScore" name="culturalScore" placeholder="请输入文化分" />
        </view>
        <view class="uni-form-item uni-column">
          <view class="title">语文分</view>
          <input class="uni-input" v-model="scoreInfo.chineseScore" name="chineseScore" placeholder="请输入语文分" />
        </view>
        <view class="uni-form-item uni-column">
          <view class="title">英语分</view>
          <input class="uni-input" v-model="scoreInfo.englishScore" name="englishScore" placeholder="请输入英语分" />
        </view>
        <view class="uni-form-item uni-column">
          <view class="title">统考分<span class="red">*</span></view>
          <input class="uni-input" v-model="scoreInfo.professionalScore" name="professionalScore" placeholder="请输入统考分" />
        </view>
        <view class="uni-btn-v">
          <button form-type="submit">可修改2次</button>
        </view>
      </form>
    </view>
  </view>
</template>

<style scoped lang="scss">
.uni-form-item .title {
  padding: 20rpx 0;
}
.red{
  color:red;
}

.uni-picker-tips {
  font-size: 12px;
  color: #666;
  margin-bottom: 15px;
  padding: 0 15px;
  /* text-align: right; */
}
</style>
