fix: 修复商品管理国家展示和编辑

src/lang/messages/pages/en.js

@@ -6376,6 +6376,7 @@ export default {
       table: {
         createdAt: 'Created At',
         goldAmount: 'Gold Amount',
+        country: 'Country',
         rewardAmount: 'Reward Amount',
         priceUsd: 'Price (USD)',
         shelf: 'Enable / Disable',

src/lang/messages/pages/zh.js

@@ -6373,6 +6373,7 @@ export default {
       table: {
         createdAt: '创建时间',
         goldAmount: '金币数',
+        country: '国家',
         rewardAmount: '奖励数',
         priceUsd: '价格$',
         shelf: '上/下架',

src/views/cnf/pay/application/commodity/edit-form.vue

@@ -11,7 +11,7 @@
     >
       <div slot="title">
         <div class="flex-l">
-          <sys-origin-icon :icon="row.selectApp.appCode" :desc="row.selectApp.appName" />
+          <sys-origin-icon v-if="selectAppInfo.appCode" :icon="selectAppInfo.appCode" :desc="selectAppInfo.appName" />
           {{ isUpdate ? $t('pages.payApplication.dialog.editProduct') : $t('pages.payApplication.dialog.createProduct') }}
         </div>
       </div>
@@ -19,7 +19,7 @@
         <el-form ref="form" :model="form" :rules="localizedRules" label-width="100px">
           <el-form-item :label="$t('pages.payApplication.form.saleCountry')">
             <div class="flex-l">
-              <img v-if="row.country.icon" :src="row.country.icon" width="40"> {{ row.country.countryName }}
+              <img v-if="rowCountry.icon" :src="rowCountry.icon" width="40"> {{ rowCountry.countryName || '-' }}
             </div>
           </el-form-item>
           <el-form-item v-if="!isUpdate" :label="$t('pages.payApplication.form.productType')" prop="type">
@@ -56,14 +56,14 @@
                     </div>
                   </el-col>
                   <el-col :md="8" class="col" style="text-align: left;">
-                    <div>{{ $t('pages.payApplication.form.salePrice') }}: <strong>{{ computedAmount }}</strong> {{ row.country.currency }}</div>
+                    <div>{{ $t('pages.payApplication.form.salePrice') }}: <strong>{{ computedAmount }}</strong> {{ rowCountry.currency }}</div>
                     <div>{{ $t('pages.payApplication.form.salePrice') }}: <strong>{{ amountUsd }}</strong> USD</div>
                   </el-col>
                   <el-col :md="8" class="col" style="text-align: left;">
                     <div>
-                      {{ $t('pages.payApplication.form.minLimit') }}: <strong>{{ aItem.countryChannelDetails.computedMinLimit }}</strong> {{ row.country.currency }}{{ $t('pages.payApplication.word.separator') }}
+                      {{ $t('pages.payApplication.form.minLimit') }}: <strong>{{ aItem.countryChannelDetails.computedMinLimit }}</strong> {{ rowCountry.currency }}{{ $t('pages.payApplication.word.separator') }}
-                      {{ $t('pages.payApplication.form.maxLimit') }}: <strong>{{ aItem.countryChannelDetails.computedMaxLimit }} </strong>{{ row.country.currency }}{{ $t('pages.payApplication.word.separator') }}
+                      {{ $t('pages.payApplication.form.maxLimit') }}: <strong>{{ aItem.countryChannelDetails.computedMaxLimit }} </strong>{{ rowCountry.currency }}{{ $t('pages.payApplication.word.separator') }}
-                      {{ $t('pages.payApplication.form.dailyLimit') }}: <strong>{{ aItem.countryChannelDetails.computedDailyLimit }} </strong>{{ row.country.currency }}
+                      {{ $t('pages.payApplication.form.dailyLimit') }}: <strong>{{ aItem.countryChannelDetails.computedDailyLimit }} </strong>{{ rowCountry.currency }}
                     </div>
                     <div>
                       {{ $t('pages.payApplication.form.minLimit') }}: <strong>{{ aItem.countryChannelDetails.factoryMinLimit }}</strong> USD{{ $t('pages.payApplication.word.separator') }}
@@ -96,7 +96,7 @@ export default {
     row: {
       type: Object,
       require: false,
-      default: () => {}
+      default: () => ({})
     }
   },
   data() {
@@ -119,6 +119,17 @@ export default {
     }
   },
   computed: {
+    selectAppInfo() {
+      return (this.row && this.row.selectApp) || {}
+    },
+    rowCountry() {
+      const country = (this.row && this.row.country) || {}
+      return {
+        icon: country.icon || country.nationalFlag || '',
+        currency: country.currency || '',
+        countryName: country.countryName || country.aliasName || country.enName || ''
+      }
+    },
     isUpdate() {
       return this.row && this.row.id
     },
@@ -177,6 +188,13 @@ export default {
     },
     loadSupportAmountChannels() {
       const that = this
+      if (!that.row.payCountryId || !validPositiveNumberPointTwo(that.form.amountUsd)) {
+        that.associateLoading = false
+        that.supportAmounts = []
+        that.computedAmount = ''
+        that.amountUsd = ''
+        return
+      }
       that.associateLoading = true
       listCountrytSupportAmountChannels(that.row.payCountryId, that.form.amountUsd)
         .then(res => {

src/views/cnf/pay/application/commodity/index.vue

@@ -38,12 +38,12 @@
       >
         <el-option
           v-for="item in countryList"
-          :key="item.id"
+          :key="getPayCountryId(item)"
-          :label="item.country.aliasName || item.country.enName"
+          :label="getCountryName(item)"
-          :value="item.id"
+          :value="getPayCountryId(item)"
         >
-          <span style="float: left;"> <img :src="item.country.nationalFlag" width="30"></span>
+          <span v-if="getCountryIcon(item)" style="float: left;"> <img :src="getCountryIcon(item)" width="30"></span>
-          <span style="float: left;margin-left:10px">{{ item.country.aliasName || item.country.enName }}</span>
+          <span style="float: left;margin-left:10px">{{ getCountryName(item) }}</span>
         </el-option>
       </el-select>
       <el-select
@@ -94,6 +94,14 @@
       highlight-current-row
     >
       <el-table-column label="ID" prop="id" align="center" />
+      <el-table-column :label="$t('pages.payApplication.table.country')" align="center" width="180">
+        <template slot-scope="scope">
+          <span v-if="getCommodityCountryIcon(scope.row)" style="display:inline-block;margin-right:6px;vertical-align:middle;">
+            <img :src="getCommodityCountryIcon(scope.row)" width="28">
+          </span>
+          <span>{{ getCommodityCountryName(scope.row) }}</span>
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('pages.payApplication.table.goldAmount')" prop="content" align="center" />
       <el-table-column :label="$t('pages.payApplication.table.rewardAmount')" prop="awardContent" align="center" />
       <el-table-column :label="$t('pages.payApplication.table.priceUsd')" prop="amountUsd" align="center" />
@@ -212,11 +220,11 @@ export default {
       this.renderData()
     },
     changeApplication(val) {
-      this.selectApp = this.appInfo.appList.filter(item => item.id === val)[0]
+      this.selectedApp = this.appInfo.appList.filter(item => item.id === val)[0] || {}
       this.renderData()
     },
     changeCountry(val) {
-      this.selectedCountry = this.countryList.filter(item => item.id === val)[0]
+      this.selectedCountry = this.getCountryByPayCountryId(val) || {}
       this.renderData()
     },
     loadOpenCountry() {
@@ -224,9 +232,9 @@ export default {
       that.loadingCountry = true
       listPayOpenCountry().then(res => {
         that.loadingCountry = false
-        that.countryList = res.body || []
+        that.countryList = that.normalizeList(res.body)
-        this.selectedCountry = that.countryList[0] || {}
+        that.selectedCountry = that.countryList[0] || {}
-        that.listQuery.payCountryId = this.selectedCountry.id
+        that.listQuery.payCountryId = that.getPayCountryId(that.selectedCountry)
         that.renderData()
       }).catch(er => {
         that.loadingCountry = false
@@ -241,10 +249,15 @@ export default {
         that.listQuery.cursor = 1
       }
       pagePayCommodity(that.listQuery).then(res => {
-        const { body } = res
+        const body = res.body || {}
         that.total = body.total || 0
-        that.list = body.records
+        that.list = body.records || []
         that.listLoading = false
+      }).catch(er => {
+        that.list = []
+        that.total = 0
+        that.listLoading = false
+        console.error(er)
       })
     },
     handleSearch() {
@@ -261,27 +274,73 @@ export default {
         'payCountryId': this.listQuery.payCountryId,
         'amountUsd': '',
         'selectApp': this.selectedApp,
-        'country': this.getEditFromCountry()
+        'country': this.getEditFromCountry({ payCountryId: this.listQuery.payCountryId })
       }
       this.appCommodityEditFormVisible = true
     },
     clickEditCommodity(row) {
       const that = this
-      that.appCommodityEditFormVisible = true
       that.selectedEditFrom = Object.assign({}, row)
       that.selectedEditFrom.selectApp = this.selectedApp
-      that.selectedEditFrom.country = that.getEditFromCountry()
+      that.selectedEditFrom.country = that.getEditFromCountry(row)
+      that.appCommodityEditFormVisible = true
     },
     editFromSuccess() {
       this.appCommodityEditFormVisible = false
       this.renderData()
     },
-    getEditFromCountry() {
+    normalizeList(body) {
+      if (Array.isArray(body)) {
+        return body
+      }
+      if (body && Array.isArray(body.records)) {
+        return body.records
+      }
+      return []
+    },
+    getPayCountryId(item) {
+      return item ? (item.id || item.payCountryId || '') : ''
+    },
+    getCountryBase(item) {
+      return (item && (item.country || item.payCountry || item.countryInfo || item.sysCountryCode)) || {}
+    },
+    getCountryName(item) {
+      if (!item) {
+        return ''
+      }
+      const country = this.getCountryBase(item)
+      return country.aliasName || country.countryName || country.enName || item.payCountryName || item.countryName || item.aliasName || item.enName || ''
+    },
+    getCountryIcon(item) {
+      if (!item) {
+        return ''
+      }
+      const country = this.getCountryBase(item)
+      return country.nationalFlag || country.icon || item.nationalFlag || item.countryNationalFlag || item.payCountryNationalFlag || item.icon || ''
+    },
+    getCountryByPayCountryId(payCountryId) {
+      if (!payCountryId) {
+        return null
+      }
+      return this.countryList.find(item => String(this.getPayCountryId(item)) === String(payCountryId))
+    },
+    getCommodityCountrySource(row) {
+      const payCountryId = row && row.payCountryId ? row.payCountryId : this.listQuery.payCountryId
+      return this.getCountryByPayCountryId(payCountryId) || row || this.selectedCountry || {}
+    },
+    getCommodityCountryName(row) {
+      return this.getCountryName(row) || this.getCountryName(this.getCommodityCountrySource(row)) || '-'
+    },
+    getCommodityCountryIcon(row) {
+      return this.getCountryIcon(row) || this.getCountryIcon(this.getCommodityCountrySource(row))
+    },
+    getEditFromCountry(row) {
+      const countrySource = this.getCommodityCountrySource(row)
       return {
-        'icon': this.selectedCountry.country.nationalFlag,
+        'icon': this.getCountryIcon(row) || this.getCountryIcon(countrySource),
-        'currency': this.selectedCountry.currency,
+        'currency': (row && row.currency) || countrySource.currency || '',
-        'exchangeRate': this.selectedCountry.usdExchangeRate,
+        'exchangeRate': (row && (row.usdExchangeRate || row.exchangeRate)) || countrySource.usdExchangeRate || '',
-        'countryName': this.selectedCountry.country.aliasName || this.selectedCountry.country.enName
+        'countryName': this.getCountryName(row) || this.getCountryName(countrySource)
       }
     }
   }