<template>
  <div class="BusFeedback">
    <div class="main NewSurveyList" v-loading="loading">
      <div class="">
        <div style="text-align:center;font-size:20px;font-weight:bold;"><template
            v-if="surveyInfo&&surveyInfo.Title&&surveyInfo.Title!=''">{{surveyInfo.Title}}</template>
        </div>
        <div style="text-indent:2em;"><template
            v-if="surveyInfo&&surveyInfo.SubTitle&&surveyInfo.SubTitle!=''">{{surveyInfo.SubTitle}}</template>
        </div>
        <table id="table">

          <template v-for="(item, index) in busDetailsList">
            <tr :key="`t_`+index">
              <td class="_name">{{index+1}}、{{item.Title}}</td>
            </tr>
            <tr :key="`a_`+index">
              <template v-if="item.SurveyType === 1">
                <td>
                  <el-rate v-model="item.ScoreNum" show-text :texts="texts" disabled>
                  </el-rate>
                </td>
              </template>
              <template v-if="item.SurveyType === 2">
                <td>
                  <el-radio-group v-model="item.ScoreNum">
                    <el-radio v-for="(radio, rIndex) in item.SurveyOptionsList" :label="radio.ID" :key="rIndex"
                      disabled>
                      {{radio.OptionsName}}</el-radio>
                  </el-radio-group>
                </td>
              </template>
              <template v-if="item.SurveyType === 3">
                <td>
                  <el-checkbox v-for="(radio, rIndex) in item.SurveyOptionsList" :checked="radio.IsCheck=='1'"
                    :label="radio.ID" :key="rIndex" rea>
                    {{radio.OptionsName}}</el-checkbox>
                </td>
              </template>
              <template v-if="item.SurveyType === 4">
                <td>
                  <el-input type="textarea" :rows="2" :placeholder="$t('fnc.qsrneirong')" v-model="item.TextContent"
                    disabled>
                  </el-input>
                </td>
              </template>
            </tr>
          </template>
        </table>
      </div>
      <div style="margin: 20px 0; text-align: right;">
        <button class="normalBtn" @click="closeDialog">{{$t('pub.closeSel')}}</button>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    props: ["TCID"],
    components: {},
    data() {
      return {
        loading: false,
        wqList: [],
        texts: [
          this.$t('objFill.pingfens')[0],
          this.$t('objFill.pingfens')[1],
          this.$t('objFill.pingfens')[2],
          this.$t('objFill.pingfens')[3],
          this.$t('objFill.pingfens')[4]
        ],
        surveyInfo: {}, //问卷信息
        busDetailsList: [], //车问卷详情
      }
    },
    created() {
      this.GetBusSurveyInfo()
    },
    mounted() {
      this.GetSurveyShowList();
      this.showBusSurveyInfo();
    },
    methods: {
      //显示车行详情
      showBusSurveyInfo() {
        this.loading = true;
        var postMsg = {
          TCID: this.TCID
        }
        this.apipost("survey_post_GetBusSurveyDetails", postMsg, res => {
          this.loading = false;
          if (res.data.resultCode == 1) {
            this.busDetailsList = res.data.data;
          }
        })
      },
      //获取文件标题和描述
      GetBusSurveyInfo() {
        this.apipost("survey_post_GetBusSurveyInfo", {}, res => {
          if (res.data.resultCode == 1) {
            this.surveyInfo = res.data.data;
          }
        });
      },
      GetSurveyShowList() {
        let data = {
          IsShow: 1,
          SurveyType: -1
        }
        this.apipost('survey_post_GetBusSurveyShowList', data, res => {
          if (res.data.resultCode === 1) {
            let data = res.data.data
            data.map(item => {
              if (item.SurveyType === 2) {
                item.SurveyOptionsList.map((cItem, cIndex) => {
                  cItem.IsCheckS = false
                })
              }
              if (item.SurveyType === 3) {
                item.SurveyOptionsList.map((cItem, cIndex) => {
                  cItem.IsCheckS = false
                })
              }
              if (item.SurveyType === 1) {
                item.ScoreNum = 5;
              }
            })
            this.wqList = data;
          }
        }, null)
      },
      closeDialog() {

      },
    }
  }

</script>
<style scoped>
  .Feedback ul>li {
    display: inline-block;
    font-size: 12px;
    color: #666;
    margin: 20px 30px 0px 0;
  }

  .Feedback .singeRowTable {
    margin-top: 20px;
  }

  .NewSurveyList.main {
    padding: 1.5rem;
  }

  .NewSurveyList .tit {
    font-size: 2rem;
    text-align: center;
    margin-bottom: .5rem;
  }

  .NewSurveyList .sub_tit {
    font-size: 1.4rem;
    margin-bottom: .4rem;
  }

  .NewSurveyList .indet_2 {
    text-indent: 2.4rem;
  }

  .NewSurveyList .tit_det {
    text-indent: 2.4rem;
    font-size: 1rem;
  }

  .NewSurveyList table {
    border-collapse: collapse;
    border-spacing: 0;
  }

  .NewSurveyList table {
    margin-top: 1rem;
    width: 100%;
  }

  .NewSurveyList tr td {
    padding: .5rem;
    border: 1px solid #5b5653;
    font-size: 1rem;
  }

  .NewSurveyList .qianming {
    margin-top: 2.5rem;
  }

  .NewSurveyList .qianming label {
    margin-right: .2rem;
  }

  .NewSurveyList.main {
    width: 100%;
    margin: 0 auto;
  }

  .NewSurveyList #table td,
  .NewSurveyList .qianming span {
    color: #111;
  }

  .NewSurveyList #table td._name,
  .NewSurveyList .qianming label {
    color: #5d5d5d;
  }

  .go_regis {
    text-decoration: underline;
    cursor: pointer;
  }

</style>