client-mazu/src/pages/sellManage/common/TicketInfo.vue

<template>
  <el-form
    inline
    class="dialog-info"
    label-width="90px"
  >
    <el-form-item label="销售价格">
      {{ data.price }} 元
    </el-form-item>
    <el-form-item label="游玩天数">
      {{ data.useDays }}
    </el-form-item>
    <el-form-item label="可售日期">
      {{ data.saleDateStart | formatDate }} - {{ data.saleDateEnd | formatDate }}
    </el-form-item>
    <el-form-item label="可用日期">
      {{ data.useDateStart | formatDate }} - {{ data.useDateEnd | formatDate }}
    </el-form-item>
    <el-form-item label="核销规则">
      {{ checkRules }}
    </el-form-item>
    <el-form-item label="核销凭证">
      {{ checkTypes }}
    </el-form-item>
    <div
      class="block-wrap">
      <div class="block-title">
        适用景点及检票次数
      </div>
      <ul class="pill-wrap">
        <li
          class="pill"
          v-for="(item,index) in ticketTypeScenicList"
          :key="index">
          <span>{{ item.scenicName }}</span>
          <span>{{ item.checkLimitTimes !== -1 ? `${item.checkLimitTimes}次` : '不限次' }} </span>
        </li>
      </ul>
    </div>
  </el-form>
</template>

<script>
import { checkTypeDic, checkRuleDic } from '@/const'

const matchItem = (value, dic) => {
  const item = dic.find(item => `${item.value}` === `${value}`)
  if (item) {
    return item.label
  }
  return ''
}

export default {
  props: {
    data: {
      type: Object,
      default: () => {}
    }
  },
  data () {
    return {
      checkRules: [],
      checkTypes: [],
      ticketTypeScenicList: []
    }
  },
  filters: {
    complicatedCheckType (arr) {
      switch (arr[0]) {
        case 1:
          switch (arr[1]) {
            case 1:
              return `单人按次 单独限制`
            case 2:
              return `单人按次 批量限制 共可检${arr[3]}次`
            default:
              return ''
          }
        case 2:
          switch (arr[2]) {
            case 0:
              return `按有效期 截止到票种有效期`
            default:
              return `按有效期 ${arr[2]}天`
          }
        default:
          return ''
      }
    }
  },
  watch: {
    data: {
      handler (val) {
        this.checkRules = val.checkRule ? val.checkRule.split(',').map(item => matchItem(item, checkRuleDic)).join('&') : ''
        this.checkTypes = val.checkType ? val.checkType.split(',').map(item => matchItem(item, checkTypeDic)).join('&') : ''
        this.ticketTypeScenicList = val.ticketTypeScenicList || []
      },
      immediate: true
    }
  }
}
</script>