<template>
  <div class="page">
    <x-textarea  v-model="remarks" placeholder="请输入处理内容" :rows="5"></x-textarea>
    <upload-pic :maxImages="maxPageSize"></upload-pic>

    <div class="line_style">
    </div>

    <div class="flex_row">
        <img src="../../assets/images/location.png" width="20" height="20"/>
      <p class="location_text" style="margin-left: 4px">所在位置({{cityName}})</p>
    </div>
    <div class="line_style">
    </div>

    <div class="flex_row" style="justify-content:space-between;margin-top: 10px">
      <p class="location_text">
        评分标准
      </p>
      <p class="location_text">
        {{totalScore}}
      </p>
    </div>

    <div style="flex: 1;overflow: auto;margin-bottom: 40px">
    <div class="flex_list" v-for="(item,index) in standardList" :key="index">
      <p class="location_text">{{index+1}}、{{item.standardContent}}</p>
      <div class="flex_row_new">
        <p class="text">分值：</p><p class="text">{{item.standardScore}}</p>
        <p class="text" style="margin-left: 8px">得分：</p>
        <img src="../../assets/images/add_icon.png" width="24" height="24" @click="addScore(item)">
        <x-input v-model="item.score" type="number" text-align="center" :show-clear="false" @on-change="inputChange" disabled class="input_style">></x-input>
        <img src="../../assets/images/delete_icon.png" width="24" height="24" @click="deleteScore(item)">
      </div>
    </div>
    </div>


    <div class="btn_style" @click="uploadFile">提交</div>
  </div>
</template>

<script>
  import UploadPic from "../../components/UploadPic";
  import {earnScore,uploadScoreInfo} from "./service/getData"
  import {XTextarea,XInput} from 'vux'
  import utils from "../../util/utils";
  import util from "../../util/util";
  import fileUtils from "../../util/fileUtils";
    export default {
        name: "scorePage",
        components:{
            UploadPic,XTextarea,XInput
        },
        data(){
            return{
                remarks:'',
                maxPageSize:3,
                sss:'',
                fbId:'',
                standardList:[],
                totalScore:'总分：0',
                totalScores:0,
                pcPics: [],
                files: [],
                imgUrls:'',
                imgNames:'',
                fbName:'',
                cityName:'',
                photos:[]
            }
        },
        created(){
          try {
              EbeiPlugins.setNavigationItemTitle("评分");

              EbeiPlugins.getLocationCity((data) => {
                  this.cityName = data
              }, ()=> {
                  alert("获取定位出错");
              })
          }catch (e) {
              alert(e);
          }

          this.fbId = this.$route.query.id?this.$route.query.id:''
            this.fbName = this.$route.query.name?this.$route.query.name:''
            this.getCurrentInfo()
        },
        methods:{
            toScoreInfo(imgS){
              let self = this
                let params = {
                    accessories:imgS,
                    createTime:'',
                    creator:localStorage.getItem('userName')?localStorage.getItem('userName'):'',
                    fbId:self.fbId,
                    fbName:self.fbName,
                    matterContent:self.remarks,
                    operateTime:'',
                    operator:'',
                    projectId:localStorage.getItem('projectId')?localStorage.getItem('projectId'):'',
                    projectName:localStorage.getItem('projectName')?localStorage.getItem('projectName'):'',
                    scoreResult:self.totalScores,
                    srId:'',
                    standardScoreList:self.standardList
                }

                self.$Spin.show()
                uploadScoreInfo(params).then(res=>{
                    self.$Spin.hide()
                    console.log(res)
                    if (res.status==200){
                        this.$vux.toast.show({
                            type:'text',
                            text:'打分成功'
                        })
                        this.$router.back()
                    }
                })
            },
            inputChange(value){
                let total = 0
                this.standardList.forEach(item=>{
                    if (item.score){
                        total +=parseInt(item.score)
                    }else {
                        total +=0
                    }
                })

              this.totalScore = '总分：'+total
                this.totalScores = total
            },
            addScore(item){
                let score = parseInt(item.score) +1
                if(score>parseInt(item.standardScore)){

                }else {
                    item.score = score
                }

                let total = 0
                this.standardList.forEach(item=>{
                    if (item.score){
                        total +=parseInt(item.score)
                    }else {
                        total +=0
                    }
                })

                this.totalScore = '总分：'+total
                this.totalScores = total
            },
            deleteScore(item){
                let score = parseInt(item.score) -1
                if(score<0){

                }else {
                    item.score = score
                }


                let total = 0
                this.standardList.forEach(item=>{
                    if (item.score){
                        total +=parseInt(item.score)
                    }else {
                        total +=0
                    }
                })

                this.totalScore = '总分：'+total
                this.totalScores = total
            },
            getCurrentInfo(){
                let self = this
                let params = {
                    fbId:self.fbId,
                    companyId:localStorage.getItem('companyId')?localStorage.getItem('companyId'):''
                }
                self.$Spin.show()
                earnScore(params).then(res=>{
                    console.log(res)
                    self.$Spin.hide()
                    if (res.status==200){
                        self.standardList = res.data.standardScoreList
                    }
                })

            },
            uploadFile() {
                var self = this;
                self.$Spin.show()
                if (util.isWeixin()) {
                } else {
                    let file_bases = localStorage.getItem('file_bases');
                    if (!util.isStrEmpty(file_bases)) {
                        self.photos = JSON.parse(file_bases);
                        if (self.photos.length > 0) {
                            let uuids = []
                            for (let i = 0; i < this.photos.length; i++) {
                                let uuid = utils.UUID()
                                let obj = self.photos[i]
                                uuids.push(uuid)
                                fileUtils.uploadSingleImage(obj, uuid).then((fileID) => {
                                    console.log(fileID)
                                    EbeiPlugins.onLog(fileID)
                                    // alert(fileID)
                                }).catch((error) => {
                                    console.log('111')
                                })
                            }

                            let uuidStr = uuids.join(',')
                            EbeiPlugins.onLog(uuidStr)

                            self.toScoreInfo(uuidStr);

                            // var pic = this.pcPics.shift();
                            // EbeiPlugins.getFileBase64(pic.bigimageUrl, (b64) => {
                            //     if (b64 == undefined) {
                            //         // self.hideLoading();
                            //         self.$Spin.hide()
                            //         self.$vux.alert.show({
                            //             title: '提示',
                            //             content: '图片异常',
                            //         })
                            //         return;
                            //     }
                            //
                            //     var typeArray = pic.bigimageUrl.split(".");
                            //     var type = typeArray[typeArray.length - 1];
                            //     var params = {
                            //         base64: b64,
                            //         type: type,
                            //     }
                            //
                            //     uploadFileByLocal(params).then(res => {
                            //         alert(res)
                            //         if (res){
                            //             if (res.status==200) {
                            //                 var dataRes = {imgUrl:res.data,name:pic.bigimageName}
                            //                 if (dataRes) {
                            //                     self.files.push(dataRes);
                            //                 }
                            //                 localStorage.setItem('file_bases', JSON.stringify(self.pcPics));
                            //                 // self.count++;
                            //                 self.uploadFile();
                            //             } else {
                            //                 self.$Spin.hide()
                            //                 self.$vux.alert.show({
                            //                     title: '提示',
                            //                     content: '提交失败',
                            //                 })
                            //             }
                            //         }else {
                            //             self.$Spin.hide()
                            //             self.$vux.alert.show({
                            //                 title: '提示',
                            //                 content: '提交失败',
                            //             })
                            //         }
                            //     },(err)=>{
                            //         alert(err)
                            //     });
                            // }, () => {
                            //     // 获取失败
                            //     // self.hideLoading();
                            //     self.$Spin.hide()
                            //     self.$vux.alert.show({
                            //         title: '提示',
                            //         content: '文件处理错误',
                            //     })
                            // });
                        }
                    }else {
                        self.toScoreInfo('');
                    }
                }
            },
        }
    }
</script>

<style scoped lang="less">
  .page{
    width: 100%;
    overflow: auto;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: white;
  }

  .btn_style{
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: #68B4FF;
    color: white;
    font-size: 16px;
    padding: 8px;
    text-align: center;
  }

  .line_style{
    height: 10px;background: rgb(249,249,249);width: 100%
  }

  .flex_row{
    display: flex;flex-direction: row;align-items: center;padding: 4px 15px 4px 15px;
  }

  .flex_list{
    display: flex;flex-direction: column;padding: 5px 15px 5px 15px;
  }

  .flex_row_new{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    .text{
      font-size: 14px;
      color: #888888;
    }

    .input_style{
      border: 1px solid #1296db;width: 50px;padding: 1px 2px;height: 24px;
    }
  }

  .location_text{
    color: #333333;
    font-size: 14px;
  }
</style>
