platform-customsdeclaration-ssr/pages/severPage/exchange/index.vue

<template>
  <div class="exchange-view">
    <div class="headline">
      <span>汇率管理</span>
      <div class="search_time">
        <a @click="updateItem()"><i class="border_radius">+</i>新增汇率</a>
      </div>
    </div>
    <ctable
      :headArr="headArr"
      :StyleWidth="StyleWidth"
      :data="tableData"
      :totalElements="totalElements"
      @handleCurrentChange="handleCurrentChange"
      :currentPage="currentPage"
      :controlArray="controlArray"
      @updateItem="updateItem"
      @clickTwo="clickTwo"
    >
    </ctable>

    <exchange-alert :AlertTitle="AlertTitle"
                    @closeAlert="closeAlert"
                    :chooseItem="chooseItem"
                    ref="exchangeAlert"
                    :IslookOrUpdate="IslookOrUpdate">
    </exchange-alert>
  </div>
</template>

<script>
  import { clone, Vuehttp } from '@/utils/tools'
  import { Ctable } from '@/components/base/table'
  import { CtableClass } from '@/utils/CtableClass'
  import { exchangeAlert } from '@/components/severPage'
  export default {
    name: 'ExchangeView',
    data(){
      return {
        currentPage: 1,
        count: 10,
        chooseItem: {},
        IslookOrUpdate: 'update'
      }
    },
    fetch({store}) {
      return !store.state.exchange.currencyList.data.content ? Promise.all([
        store.dispatch('loadexchangeInfo', {count: 10, page: 1}),
        store.dispatch('loadexchangeCurrencyList')
      ]) : ''
    },
    components: {
      Ctable,
      exchangeAlert
    },
    computed: {
      headArr() {
        return ['发布时间', '货币名称', '汇率', '操作']
      },
      StyleWidth() {
        return [298, 310, 400, 156]
      },
      tableData() {
        return CtableClass(this.getHttpResource, [['时间戳', 'createTime'], 'currencyName', 'rate', '操作'])
      },
      getHttpResource() {
        return this.$store.state.exchange.list.data.content.content
      },
      totalElements() {
        return this.$store.state.exchange.list.data.content.totalElements
      },
      controlArray() {
        return [['修改', 'updateItem']]
      },
      AlertTitle() {
       return this.IslookOrUpdate === 'add' ? '新增汇率' : (this.IslookOrUpdate === 'update' ? '修改信息' : '查看信息')
      }
    },
    methods: {
      // 分页调整数据
      handleCurrentChange (page) {
        this.currentPage = page
        this.$store.dispatch('loadexchangeInfo', {count: 10, page: this.currentPage})
      },
      updateItem(index) {
        this.chooseItem = {}
        this.IslookOrUpdate = 'add'
        if (index !== undefined) {
          this.IslookOrUpdate = 'update'
          this.chooseItem = clone(this.getHttpResource[index])
        }
        this.$refs.exchangeAlert.show()
      },
      closeAlert(tp, item) {
        if (tp === 'save') {
          let params = {
            RemittanceAccount: {
              currencyName: item.currencyName,
              rate: item.rate
            }
          }
          let url = '/facilitator/exchangeRate/persist'
          if (this.IslookOrUpdate === 'update') {
            params = {
              RemittanceAccount: item
            }
          }
          Vuehttp(params, url).then(res => {
            if (res.data.code !== 1) {
              this.$message.error(res.data.message)
            } else {
              this.$refs.exchangeAlert.hide()
              this.handleCurrentChange(1)
            }
          })
        } else {
          this.$refs.exchangeAlert.hide()
        }
      },
      clickTwo(index) {
        // this.IslookOrUpdate = 'look'
        // this.AlertTitle = '查看信息'
        // this.chooseItem = clone(this.getHttpResource[index])
        // this.$refs.exchangeAlert.show()
      }
    }
  }
</script>

<style scoped type="text/scss" lang="scss">

</style>