<template>
    <div style="padding: 10px 10px;">
      <div  v-for="(item, index) in list" :key="index" :color="item.color">
        <div class="jcgjList-title no-break">
          <div><span>{{ item.createTime }}</span> 
           <span :style="'color:' + item.color+';margin-left:5px'">{{ $i18n.locale ==='zh_CN' ? item.jcmc :item.jcmcEn }}</span></div>
        </div>
        <div class="no-break" style="padding: 5px 0px;">
          <template v-if="$i18n.locale === 'zh_CN'">
            <span v-for="(pitem, pindex) in item.jcnrList" :key="pindex" style="padding-right: 5px;">
              {{ pitem.name }}：{{ pitem.value }}
            </span>
          </template>
          <template v-else>
            <span v-for="(pitem, pindex) in item.jcnrListEn" :key="pindex" style="padding-right: 5px;">
              {{ pitem.name }}：{{ pitem.value }}
            </span>
          </template>
          <div v-if="item.remark && item.remark !== ''" style="padding-top: 5px;">
            {{ $t('form.remark') }}：{{ item.remark }}
          </div>
          <div v-if="item.qmrId && item.qmrId > 0" style="padding-top: 5px;">
            {{ $t('form.qmyy') }}：{{ $i18n.locale === 'zh_CN' ? item.jcmc : item.jcmcEn }}
          </div>
          <div v-if="item.qmrId && item.qmrId > 0" style="padding-top: 5px;">
            {{ $t('form.signer') }}：{{ item.qmrMc }}
          </div>
        </div>
      </div>
    </div>
</template>

<script>
export default {
  name: "JcgjExportList",
  components: {},
  props: {
    showRy: {
      type: Boolean,
      default: false
    },
    showXg: {
      type: Boolean,
      default: false
    },
    showLc: {
      type: Boolean,
      default: true
    },
    showBj: {
      type: Boolean,
      default: true
    },
    showBcsm: {
      type: Boolean,
      default: false
    },
    // 更换笼具
    showLj: {
      type: Boolean,
      default: false
    },
    readonly: {
      type: Boolean,
      default: false
    },
  },
  data() {
    return {
      list: [],
      queryParams: {
        jcmc: '',
        jcgjlx: -1
      }
    };
  },
  mounted() {
    this.list = []
  },
  methods: {
    handleQuery() {
      this.$emit('handleQuery', this.queryParams)
    },
    init(val) {
      let that = this
      this.list = that.paseData(val)
    },
    add(val) {
      let that = this
      this.list.push(...that.paseData(val));
    },
    paseData(val) {
      let tmp = []
      _.forEach(val, function (a) {
        let item = a
        try {
          item.jcnrList = JSON.parse(a.jcnr)
          item.jcnrListEn = JSON.parse(a.jcnrEn)
        } catch (e) {
          item.jcnrList = []
          item.jcnrListEn = []
        }
        // 稽查名称颜色：1：蓝色；3：红色；5：绿色；7：橙色
        if (item.jcmcys == 1) {
          item.color = '#409EFF'
        }
        else if (item.jcmcys == 3) {
          item.color = '#F56C6C'
        } else if (item.jcmcys == 5) {
          item.color = '#67C23A'
        } else if (item.jcmcys == 7) {
          item.color = '#E6A23C'
        }
        tmp.push(item)
      })
      return tmp
    }
  }
};
</script>
