fix: 汇率页面格式调整

src/views/ecw/currencyRate/index.vue

@@ -12,17 +12,17 @@
     <el-table v-loading="query.loading" :data="query.result.list">
       <el-table-column align="center" :label="$t('原币种')">
         <template v-slot="{ row }">
-          {{ $l(currency(row.sourceId), 'title') }}
+          {{ $l(row.source, 'title') }}
         </template>
       </el-table-column>
       <el-table-column align="center" :label="$t('支付币种')">
         <template v-slot="{ row }">
-          {{ $l(currency(row.targetId), 'title') }}
+          {{ $l(row.target, 'title') }}
         </template>
       </el-table-column>
-      <el-table-column :label="$t('汇率')">
+      <el-table-column align="center" :label="$t('汇率')">
         <template v-slot="{ row }">
-          {{ currency(row.sourceId).fuhao }} {{ row.sourceAmount }} : {{ row.targetAmount }} {{ currency(row.targetId).fuhao }}
+          {{ row.source.fuhao }} {{ row.sourceAmount }} : {{ row.targetAmount }} {{ row.target.fuhao }}
         </template>
       </el-table-column>
       <el-table-column align="center" :label="$t('有效期')">
@@ -30,19 +30,19 @@
           {{ parseTime(row.expiration) }}
         </template>
       </el-table-column>
-      <el-table-column align="left" :label="$t('国家')" prop="countries" :formatter="countries"/>
-      <el-table-column :label="$t('备注')" prop="remarks"/>
-      <el-table-column :label="$t('状态')">
+      <el-table-column align="center" :label="$t('国家')" prop="countries" :formatter="countries"/>
+      <el-table-column align="center" :label="$t('备注')" prop="remarks"/>
+      <el-table-column align="center" :label="$t('状态')">
         <template v-slot="{ row }">
           <dict-tag :type="DICT_TYPE.CURRENCY_RATE_STATUS" :value="expired(row.expiration)" />
         </template>
       </el-table-column>
-      <el-table-column :label="$t('最后修改时间')">
+      <el-table-column align="center" :label="$t('最后修改时间')">
         <template v-slot="{ row }">
           {{ parseTime(row.updateTime) }}
         </template>
       </el-table-column>
-      <el-table-column :label="$t('最后修改人')">
+      <el-table-column align="center" :label="$t('最后修改人')">
         <template v-slot="{ row }">
           {{ user(row.updater).nickname }}
         </template>
@@ -102,7 +102,9 @@ export default Vue.extend({
     async pagination() {
       this.query.loading = true
       try {
-        this.query.result = await getCurrencyRatePage(this.query.params).then(it => it.data)
+        const result = await getCurrencyRatePage(this.query.params).then(it => it.data)
+        result.list = result.list.map(e => (e.source = this.currency(e.sourceId), e.target = this.currency(e.targetId), e))
+        this.query.result = result
       } finally {
         this.query.loading = false
       }
@@ -110,14 +112,6 @@ export default Vue.extend({
     expired(day) {
       return dayjs().isAfter(day) ? 1 : 0
     },
-    amount(row) {
-      const source = this.currency(row.sourceId)
-      const target = this.currency(row.targetId)
-      return `${source.fuhao} ${row.sourceAmount} : ${target.fuhao} ${row.targetAmount}`
-    },
-    rate(row) {
-      return this.decimal(row.targetAmount).dividedBy(row.sourceAmount).toFixed(8)
-    },
     add() {
       this.dialogs.form = { visible: true, id: null, data: {}, }
     },
@@ -128,7 +122,7 @@ export default Vue.extend({
       this.$confirm(this.$t('确定要删除吗？'), this.$t('确认'), { type: 'warning' }).then(() => deleteCurrencyRate(row.id)).catch(() => {}).finally(this.pagination)
     },
     logs(row) {
-      this.dialogs.logs = { visible: true, id: row.id, source: this.currency(row.sourceId), target: this.currency(row.targetId), }
+      this.dialogs.logs = { visible: true, id: row.id, source: row.source, target: row.target, }
     },
     async reverse(row) {
       var swap = { sourceId: row.targetId, targetId: row.sourceId, }

src/views/ecw/currencyRate/logs.vue

@@ -8,15 +8,15 @@
       <el-table-column :label="$t('修改人')">
         <template v-slot="{ row }">
           <div>
-            <div><b>{{ (users[row.updater] || { nickname: row.updater }).nickname }}</b>: <i class="remarks">{{ row.remarks || $t('无') }}</i></div>
+            <div><i>{{ user(row.updater).nickname }}</i>: <i class="remarks">{{ row.remarks || $t('无') }}</i></div>
             <div><i>{{ parseTime(row.updateTime) }}</i></div>
           </div>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('金额修改')" align="right">
+      <el-table-column :label="$t('金额修改')" align="center">
         <template v-slot="{ row }">
-          <div v-if="row.sourceAmount1 == row.sourceAmount2 && row.targetAmount1 == row.targetAmount2">
-            <div>{{ amount(row.sourceAmount1, row.targetAmount1) }}</div>
+          <div v-if="row.sourceAmount1 === row.sourceAmount2 && row.targetAmount1 === row.targetAmount2">
+            <div>{{ amount(row.sourceAmount2, row.targetAmount2) }}</div>
           </div>
           <div v-else>
             <div class="after">{{ amount(row.sourceAmount2, row.targetAmount2) }}</div>
@@ -24,37 +24,26 @@
           </div>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('汇率变化')" align="left">
+      <el-table-column :label="$t('国家变化')" align="center">
         <template v-slot="{ row }">
-          <div v-if="row.sourceAmount1 == row.sourceAmount2 && row.targetAmount1 == row.targetAmount2">
-            <div>1 : {{ rate(row.sourceAmount1, row.targetAmount1) }}</div>
+          <div v-if="row.countries1String === row.countries2String">
+            <div>{{ countriesString(row.countries2) }}</div>
           </div>
           <div v-else>
-            <div class="after">1 : {{ rate(row.sourceAmount2, row.targetAmount2) }}</div>
-            <div class="before">1 : {{ rate(row.sourceAmount1, row.targetAmount1) }}</div>
+            <div class="after">{{ row.countries2String }}</div>
+            <div class="before">{{ row.countries1String }}</div>
           </div>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('国家变化')">
+      <el-table-column :label="$t('日期变化')" align="center">
         <template v-slot="{ row }">
-          <div v-if="countriesString(row.countries1) != countriesString(row.countries2)">
-            <div class="after">{{ countriesString(row.countries2) }}</div>
-            <div class="before">{{ countriesString(row.countries1) }}</div>
+          <div v-if="row.expiration1 === row.expiration2">
+            <div>{{ parseTime(row.expiration2) }}</div>
           </div>
           <div v-else>
-            <div>{{ countriesString(row.countries1) }}</div>
-          </div>
-        </template>
-      </el-table-column>
-      <el-table-column :label="$t('日期变化')">
-        <template v-slot="{ row }">
-          <div v-if="row.expiration1 != row.expiration2">
             <div class="after">{{ parseTime(row.expiration2) }}</div>
             <div class="before">{{ parseTime(row.expiration1) }}</div>
           </div>
-          <div v-else>
-            <div>{{ parseTime(row.expiration1) }}</div>
-          </div>
         </template>
       </el-table-column>
     </el-table>
@@ -92,6 +81,9 @@ export default Vue.extend({
     close() {
       this.$emit('update:visible', false)
     },
+    user(id) {
+      return this.users[id] || { id, nickname: id, }
+    },
     countriesString(list) {
       return (list || []).map(e => this.countries[e]).filter(e => e).map(c => this.$l(c, 'name')).join(',')
     },
@@ -107,9 +99,9 @@ export default Vue.extend({
     async pagination() {
       this.loading = true
       try {
-        const data = await getCurrencyRateLogs({ id: this.id, page: this.page, rows: this.limit, }).then(it => it.data)
-        this.list = data.list
-        this.total = data.total
+        const result = await getCurrencyRateLogs({ id: this.id, page: this.page, rows: this.limit, }).then(it => it.data)
+        this.list = result.list.map(e => (e.countries1String = this.countriesString(e.countries1), e.countries2String = this.countriesString(e.countries2), e))
+        this.total = result.total
       } finally {
         this.loading = false
       }