orgManager/src/views/finance/bankingRegulations/rateConfiguration/index.vue

<template>
   <div class="app-container">
      <el-table class="c-table-main" ref="tableRef" v-loading="loading" row-key="id" :data="dataList" stripe border>
            <el-table-column prop="currencyCode" :label="t('原币种')" align="center">
               <template #default="{row}">
                  {{ row.currencyCode }}
               </template>
            </el-table-column>
            <el-table-column prop="currencyCode" :label="t('基础币种')" align="center">
               <template #default="{row}">
                  {{ row.currencyCode }}
               </template>
            </el-table-column>
            <el-table-column prop="exchangeCurrencyCode" :label="t('兑换币种')" align="center">
               <template #default="{row}">
                  {{ row.exchangeCurrencyCode }}
               </template>
            </el-table-column>
            <el-table-column prop="exchangeRate" :label="t('站点汇率')" align="center">
               <template #default="{row}">
                  {{row.exchangeRate}}
               </template>
            </el-table-column>
            <el-table-column align="center" label-class-name="c-table-column-center12">
               <template #header>
                  <div style="width: 100%;text-align: center;">汇率差设置</div>
                  <div style="width: 100%;text-align: center;color: #8b8b8b;font-weight: 400;">（即比市场更高或更低的部分）</div>
               </template>
               <el-table-column prop="exchangeRate" :label="t('单位')" label-class-name="c-table-column-center12" align="center">
                  <template #default="{row}">
                     <span v-if="row.differenceType == 1">{{ t('百分比') }}</span>
                     <span v-if="row.differenceType == 2">{{ t('固定值') }}</span>
                  </template>
               </el-table-column>
               <el-table-column prop="exchangeRate" :label="t('汇率差')" label-class-name="c-table-column-center12" align="center">
                  <template #default="{row}">
                    <span v-if="row.differenceType == 1">{{row.exchangeCurrencyCode}}+{{row.differenceValue}}%</span> 
                    <span v-if="row.differenceType == 2">{{row.differenceValue}}</span>
                  </template>
               </el-table-column>
            </el-table-column>
            <el-table-column prop="exchangeRate" label-class-name="c-table-column-center12" align="center">
               <template #header>
                  <div style="width: 100%;text-align: center;">{{ t('生效汇率') }}</div>
                  <div style="width: 100%;text-align: center;color: #8b8b8b;font-weight: 400;">{{ t('(市场汇率 + 汇率差)') }}</div>
               </template>
                  <template #default="{row}">
                     {{row.actualBalance}}
                  </template>
               </el-table-column>
            <el-table-column prop="exchangeRate" :label="t('操作')" align="center">
               <template #default="{row}">
                  <!-- <el-button link type="primary" >{{
                  t('修改') }}</el-button> -->
                  --
               </template>
            </el-table-column>
      </el-table>
   </div>
</template>

<script setup name="BankingRegulations">
import { listBank, delBank, changeBankStatus } from "@/api/bank";
import { getLocalStorage } from "@/utils/auth";
import {  getTenantExchangeSelect } from "@/api/system/siteInformation";

const { proxy } = getCurrentInstance();

const fileHost = getLocalStorage('fileUrl') || ''; // 文件host
const bankList = ref([]);
const loading = ref(true);
const dataList = ref([]);
const total = ref(0);
const queryParams = reactive({
   pageNum: 1,
   pageSize: 20,
   currencyType: null,
   bankCode: null,
   status: null
});

// 查询银行管理列表
function getList() {
   loading.value = true;
   getTenantExchangeSelect({}).then(res => {
      dataList.value = res.data;
      loading.value = false;
   })
}

// 新增按钮操作
const addEditStatus = ref('add'), isShowDialog = ref(false), editDataId = ref('');
const handleAdd = () => {
   isShowDialog.value = true;
   addEditStatus.value = 'add';
}

// 修改
const handleUpdate = (row) => {
   editDataId.value = row.id;
   isShowDialog.value = true;
   addEditStatus.value = 'edit';
}

// 关闭新增修改弹窗
const closeDialog = (type) => {
   switch (type) {
      case 'add-edit': // 新增-修改弹窗
         addEditStatus.value = 'add';  // 每次关闭还原为新增模式
         isShowDialog.value = false;
         break
   }

   // 刷新列表
   getList();
}

// 表格中开启状态开关
const switchBeforeChange = () => {
   return false;
}

// 银行启用状态更改
const changeStatus = (row) => { // row.status: 0-停用 1-启用
   proxy.$modal.confirm( proxy.t('确认{}“' + row.bankName + '”？', +row.status === 1 ? '启用' : '停用')).then(() => {
      changeBankStatus({ id: row.id, status: +row.status === 1 ? 0 : 1 }).then(res => {
         proxy.$modal.msgSuccess(proxy.t(row.bankName + ' {}成功！', +row.status === 1 ? '启用' : '停用'));
         getList();
      })
   }).catch(() => { });
}

// 删除
const handleDelete = (row) => {
   proxy.$modal.confirm(proxy.t('确认删除“' + row.bankName + '”的数据？')).then(() => {
      return delBank(row.id);
   }).then(() => {
      getList();
      proxy.$modal.msgSuccess(proxy.t('删除成功！'));
   }).catch(() => { });
}

// 搜索
const handleQuery = () => {
   queryParams.pageNum = 1;
   getList();
}

// 重置
const resetQuery = () => {
   handleQuery();
}

getList();
</script>

<style lang="scss" scoped>
:deep(.c-table-column-center12){
   background: #fbf4c4!important;
}
</style>