udpate

jsconfig.json

@@ -5,5 +5,8 @@
       "@/*": ["src/*"]
     }
   },
-  "exclude": ["node_modules", "dist"]
+  "exclude": ["node_modules", "dist"],
+  "vueCompilerOptions": {
+    "target": 2.7
+  }
 }

package.json

@@ -11,18 +11,18 @@
   },
   "dependencies": {
     "axios": "^0.27.2",
-    "core-js": "^3.26.0",
-    "element-ui": "^2.15.10",
+    "core-js": "^3.26.1",
+    "element-ui": "^2.15.12",
     "js-cookie": "^3.0.1",
     "md5": "^2.3.0",
     "normalize.css": "^8.0.1",
     "nprogress": "^0.2.0",
-    "vue": "^2.7.13",
+    "vue": "^2.7.14",
     "vue-router": "^3.6.5",
     "vuex": "^3.6.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.19.6",
+    "@babel/core": "^7.20.2",
     "@babel/eslint-parser": "^7.19.1",
     "@rushstack/eslint-patch": "^1.2.0",
     "@vue/cli-plugin-babel": "~5.0.8",
@@ -33,31 +33,31 @@
     "@vue/cli-service": "~5.0.8",
     "@vue/eslint-config-prettier": "^7.0.0",
     "@vue/preload-webpack-plugin": "^2.0.0",
-    "@vue/test-utils": "^1.3.0",
+    "@vue/test-utils": "^1.3.3",
     "babel-jest": "^27.5.1",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "compression-webpack-plugin": "^6.1.1",
     "eslint": "^7.32.0",
     "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-vue": "^9.7.0",
+    "eslint-plugin-vue": "^9.8.0",
     "html-webpack-plugin": "^5.5.0",
-    "postcss": "^8.4.18",
+    "postcss": "^8.4.19",
     "postcss-html": "^1.5.0",
-    "prettier": "2.7.1",
-    "sass": "^1.55.0",
-    "sass-loader": "^10.3.1",
+    "prettier": "2.8.0",
+    "sass": "^1.56.1",
+    "sass-loader": "^10.4.1",
     "script-ext-html-webpack-plugin": "^2.1.5",
-    "stylelint": "^14.14.0",
-    "stylelint-config-prettier": "^9.0.3",
+    "stylelint": "^14.15.0",
+    "stylelint-config-prettier": "^9.0.4",
     "stylelint-config-recess-order": "^3.0.0",
     "stylelint-config-recommended-vue": "^1.4.0",
-    "stylelint-config-standard-scss": "^6.0.0",
+    "stylelint-config-standard-scss": "^6.1.0",
     "stylelint-declaration-block-no-ignored-properties": "^2.6.0",
     "stylelint-webpack-plugin": "^3.3.0",
     "svg-sprite-loader": "^6.0.11",
     "svgo": "^2.8.0",
-    "vue-loader": "^15.10.0",
-    "vue-template-compiler": "^2.7.13",
+    "vue-loader": "^15.10.1",
+    "vue-template-compiler": "^2.7.14",
     "vue-demi": "^0.13.11"
   },
   "browserslist": [

src/api/log.js

@@ -0,0 +1,40 @@
+import { request, getRequestParams } from '@/utils/request';
+
+/**
+ * 得到操作日志数据类型列表
+ * @param {Object} data
+ */
+export function GetOperateLogDataTypeList(data) {
+  return request({
+    method: 'post',
+    url: process.env.VUE_APP_FileServer,
+    params: getRequestParams('log_manager-GetOperateLogDataTypeList'),
+    data
+  });
+}
+
+/**
+ * 得到操作日志存储区索引列表
+ * @param {Object} data
+ */
+export function GetOperateLogStoreIndexList(data) {
+  return request({
+    method: 'post',
+    url: process.env.VUE_APP_FileServer,
+    params: getRequestParams('log_manager-GetOperateLogStoreIndexList'),
+    data
+  });
+}
+
+/**
+ * 分页查询操作日志列表
+ * @param {Object} data
+ */
+export function PageQueryOperateLogList(data) {
+  return request({
+    method: 'post',
+    url: process.env.VUE_APP_FileServer,
+    params: getRequestParams('log_manager-PageQueryOperateLogList'),
+    data
+  });
+}

src/api/user.js

@@ -67,3 +67,16 @@ export function GetBatchRegisterStudentProgress(data) {
     data
   });
 }
+
+/**
+ * 发送验证码
+ * @param {Object} data
+ */
+export function SendVerificationCode(data) {
+  return request({
+    method: 'post',
+    url: process.env.VUE_APP_FileServer,
+    params: getRequestParams('user_manager-SendVerificationCode'),
+    data
+  });
+}

src/layouts/components/LayoutHeader.vue

@@ -27,12 +27,12 @@
     <div class="header-crumbs">
       <div class="header-crumbs-navigation">
         <router-link v-for="(item, i) in levelList" :key="i" :to="item.meta.path ? item.meta.path : ''">
-          <i v-show="i > 0" class="el-icon-arrow-right" /> {{ item.meta.title }}
+          <i v-show="i > 0" class="el-icon-arrow-right"></i> {{ item.meta.title }}
         </router-link>
       </div>
     </div>
 
-    <update-password ref="password" />
+    <UpdatePassword ref="password" />
   </header>
 </template>
 
@@ -100,6 +100,11 @@ export default {
           path: '/quota',
           name: '配额管理',
           isShow: is_inner
+        },
+        {
+          path: '/log',
+          name: '操作日志',
+          isShow: is_inner
         }
       ];
 

src/layouts/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="basic-layout">
-    <layout-header />
+    <LayoutHeader />
     <main class="app-main">
       <router-view :key="key" />
     </main>
@@ -8,21 +8,21 @@
 </template>
 
 <script>
-import LayoutHeader from './components/LayoutHeader.vue';
-
 export default {
-  name: 'Layout',
-  components: {
-    LayoutHeader
-  },
-  computed: {
-    key() {
-      return this.$route.path;
-    }
-  }
+  name: 'Layout'
 };
 </script>
 
+<script setup>
+import { computed } from 'vue';
+import { useRoute } from 'vue-router/composables';
+
+import LayoutHeader from './components/LayoutHeader.vue';
+
+const route = useRoute();
+let key = computed(() => route.path);
+</script>
+
 <style lang="scss">
 .basic-layout {
   height: 100%;

src/router/index.js

@@ -92,7 +92,7 @@ const routes = [
     redirect: { name: 'AccountManager' },
     children: [
       {
-        path: '/account_manager/index',
+        path: 'index',
         name: 'AccountManager',
         component: () => import('@/views/account_manager'),
         beforeEnter: (to, form, next) => {
@@ -108,7 +108,7 @@ const routes = [
     redirect: { name: 'TeacherManager' },
     children: [
       {
-        path: '/teacher_manager/index',
+        path: 'index',
         name: 'TeacherManager',
         component: () => import('@/views/teacher_manager'),
         beforeEnter: (to, form, next) => {
@@ -124,7 +124,7 @@ const routes = [
     redirect: { name: 'StudentManager' },
     children: [
       {
-        path: '/student_manager/index',
+        path: 'index',
         name: 'StudentManager',
         component: () => import('@/views/student_manager'),
         beforeEnter: (to, form, next) => {
@@ -140,7 +140,7 @@ const routes = [
     redirect: '/vocabulary/index',
     children: [
       {
-        path: '/vocabulary/index',
+        path: 'index',
         component: () => import('@/views/vocabulary/index')
       },
       {
@@ -173,7 +173,7 @@ const routes = [
     redirect: '/settings/index/LiveRoomConfig',
     children: [
       {
-        path: '/settings/index',
+        path: 'index',
         component: () => import('@/views/settings'),
         children: [
           {
@@ -241,6 +241,18 @@ const routes = [
     ]
   },
   {
+    path: '/log',
+    component: Layout,
+    meta: { title: '操作日志' },
+    redirect: '/log/index',
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/log/index.vue')
+      }
+    ]
+  },
+  {
     path: '*',
     redirect: '/404'
   }

src/utils/request.js

@@ -12,7 +12,7 @@ axios.defaults.headers['X-Requested-With'] = 'XMLHttpRequest';
 const service = axios.create({
   baseURL: process.env.VUE_APP_BASE_API,
   // withCredentials: true, // 跨域请求时发送 cookies
-  timeout: 5000
+  timeout: 30000
 });
 
 // 请求拦截器

src/views/account_manager/OrgList.vue

@@ -1,77 +0,0 @@
-<!-- TODO 待删除 -->
-<template>
-  <el-dialog class="org-list" :visible="visible" :before-close="handleClose">
-    <div slot="title">用户【{{ curUserName }}】加入的机构列表</div>
-
-    <el-table :data="org_list" height="320px" border>
-      <el-table-column prop="org_name" label="机构名" width="480" />
-      <el-table-column label="已审核">
-        <template slot-scope="{ row }">
-          <span>{{ row.is_audited === 'true' ? '√' : '' }}</span>
-        </template>
-      </el-table-column>
-    </el-table>
-
-    <div slot="footer">
-      <el-button @click="handleClose">关闭</el-button>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-import { GetOrgList_User } from '@/api/org';
-
-export default {
-  props: {
-    userId: {
-      default: '',
-      type: String
-    },
-    curUserName: {
-      default: '',
-      type: String
-    }
-  },
-  data() {
-    return {
-      visible: false,
-      org_list: []
-    };
-  },
-  watch: {
-    userId(newVal) {
-      if (newVal.length > 0) {
-        GetOrgList_User({ user_id: this.userId, audited_status: -1 }).then(({ org_list }) => {
-          this.org_list = org_list;
-        });
-      } else {
-        this.org_list = [];
-      }
-    }
-  },
-  methods: {
-    show() {
-      this.visible = true;
-    },
-
-    handleClose() {
-      this.visible = false;
-      this.$emit('orgListClose');
-    }
-  }
-};
-</script>
-
-<style lang="scss">
-.org-list {
-  .el-table__header {
-    .cell {
-      text-align: center;
-    }
-  }
-
-  .el-dialog__body {
-    padding-bottom: 0;
-  }
-}
-</style>

src/views/log/index.vue

@@ -0,0 +1,132 @@
+<template>
+  <div class="log">
+    <div class="log-search">
+      <div class="search-item">
+        <label for="dataType">类型</label>
+        <el-select v-model="curDateType" name="dataType">
+          <el-option
+            v-for="{ data_type, data_type_name } in dataTypeList"
+            :key="data_type"
+            :value="data_type"
+            :label="data_type_name"
+          />
+        </el-select>
+      </div>
+      <div class="search-item">
+        <label for="storeIndex">存储时间段</label>
+        <el-select v-model="curStoreIndexCode" class="store-list" name="storeIndex">
+          <el-option
+            v-for="{ code, begin_time, end_time } in storeIndexList"
+            :key="code"
+            :value="code"
+            :label="`${begin_time}~${end_time}`"
+          />
+        </el-select>
+      </div>
+      <div class="search-item">
+        <label for="operationName">操作人</label>
+        <el-input v-model="operatorName" name="operationName" @keyup.enter.native="queryOperateLogList" />
+      </div>
+      <div class="search-item">
+        <el-button icon="el-icon-search" @click="queryOperateLogList" />
+      </div>
+    </div>
+
+    <CommonTable
+      :page-size="page_capacity"
+      :total="total_count"
+      :current-page="cur_page"
+      @prev-click="changePage($event, queryOperateLogList)"
+      @next-click="changePage($event, queryOperateLogList)"
+      @current-change="changePage($event, queryOperateLogList)"
+      @size-change="changePageSize($event, queryOperateLogList)"
+    >
+      <el-table :data="list">
+        <el-table-column label="序号" width="80px" align="center">
+          <template slot-scope="{ $index }">
+            {{ $index + 1 }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="operator_id" label="操作人ID" />
+        <el-table-column prop="operator_name" label="操作人姓名" />
+        <el-table-column prop="operate_time" label="操作时间" />
+        <el-table-column prop="operator_ip" label="操作IP" />
+      </el-table>
+    </CommonTable>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { GetOperateLogDataTypeList, GetOperateLogStoreIndexList, PageQueryOperateLogList } from '@/api/log';
+import { useList } from '@/utils/list';
+
+import CommonTable from '@/components/common/CommonTable.vue';
+
+let { changePage, changePageSize, cur_page, list, page_capacity, total_count } = useList();
+
+let dataTypeList = ref([]);
+let curDateType = ref('');
+let storeIndexList = ref([]);
+let curStoreIndexCode = ref('');
+let operatorName = ref('');
+
+function queryOperateLogList() {
+  PageQueryOperateLogList({
+    data_type: curDateType.value,
+    store_index_code: curStoreIndexCode.value,
+    operator_name: operatorName.value,
+    cur_page: cur_page.value,
+    page_capacity: page_capacity.value
+  }).then(({ cur_page: page, total_count: total, data_list }) => {
+    cur_page.value = page;
+    total_count.value = total;
+    list.value = data_list;
+  });
+}
+
+Promise.all([GetOperateLogDataTypeList(), GetOperateLogStoreIndexList()]).then(results => {
+  const { data_type_list } = results[0];
+  dataTypeList.value = data_type_list;
+  if (data_type_list.length > 0) curDateType.value = data_type_list[0].data_type;
+
+  const { store_index_list } = results[1];
+  storeIndexList.value = store_index_list;
+  if (store_index_list.length > 0) curStoreIndexCode.value = store_index_list[0].code;
+
+  queryOperateLogList();
+});
+</script>
+
+<style lang="scss" scoped>
+@import '~@/styles/mixin';
+
+.log {
+  @include container;
+
+  &-search {
+    display: flex;
+    column-gap: 12px;
+    padding-top: 24px;
+
+    .search-item {
+      display: flex;
+      align-items: center;
+
+      label {
+        margin-right: 14px;
+        word-break: keep-all;
+      }
+
+      .store-list :deep input {
+        width: 320px;
+      }
+
+      &:last-child {
+        flex: 1;
+        justify-content: flex-end;
+      }
+    }
+  }
+}
+</style>

src/views/login/index.vue

@@ -46,6 +46,17 @@
             />
           </el-form-item>
 
+          <el-form-item class="dynamic_verification_code" prop="dynamic_verification_code">
+            <el-input v-model="loginForm.dynamic_verification_code" placeholder="邮箱验证码" />
+            <div
+              class="verificationCode-btn"
+              :class="VerificationCodeShow ? 'waitTime' : 'getVerification'"
+              @click="getVerificationCode"
+            >
+              {{ VerificationCodeShow ? time + 's' : '获取' }}
+            </div>
+          </el-form-item>
+
           <el-form-item class="form-remember">
             <el-row type="flex" justify="space-between">
               <el-col> <el-checkbox v-model="isRemember" /> 记住我</el-col>
@@ -81,6 +92,7 @@ export default {
 <script setup>
 import { GetLogo, GetVerificationCodeImage } from '@/api/app';
 import { setConfig } from '@/utils/auth';
+import { SendVerificationCode } from '@/api/user';
 import { ref } from 'vue';
 import { useRouter } from 'vue-router/composables';
 import { Message } from 'element-ui';
@@ -106,7 +118,8 @@ let loginForm = ref({
   password: '123456',
   is_password_md5: 'true',
   user_type: 'ADMIN',
-  verification_code_image_id: ''
+  verification_code_image_id: '',
+  dynamic_verification_code: ''
 });
 let loginRules = ref({
   user_name: [{ required: true, trigger: 'blur', message: '用户名不能为空！' }],
@@ -120,6 +133,38 @@ function updateVerificationCode() {
 }
 updateVerificationCode();
 
+// 邮箱验证码
+let VerificationCodeShow = ref(false);
+let time = ref(60);
+function getVerificationCode() {
+  if (time.value !== 60) return;
+
+  if (!loginForm.value.user_name) {
+    Message.warning('请先输入邮箱或手机号码');
+    return;
+  }
+  VerificationCodeShow.value = true;
+  let timer = null;
+  timer = setInterval(() => {
+    time.value -= 1;
+    if (time.value === 0) {
+      VerificationCodeShow.value = false;
+      clearInterval(timer);
+      timer = null;
+      time.value = 60;
+    }
+  }, 1000);
+  SendVerificationCode({
+    verification_type: 'EMAIL',
+    phone_or_email: loginForm.value.user_name
+  }).catch(() => {
+    VerificationCodeShow.value = false;
+    clearInterval(timer);
+    timer = null;
+    time.value = 60;
+  });
+}
+
 let login = ref();
 let loading = ref(false);
 function handleLogin() {
@@ -184,7 +229,7 @@ function handleLogin() {
     &-admin {
       width: 460px;
       min-width: 460px;
-      height: 550px;
+      height: 598px;
       min-height: 550px;
       background-color: #fff;
       border: 1px solid #ccc;
@@ -228,6 +273,38 @@ function handleLogin() {
           }
         }
 
+        .dynamic_verification_code {
+          .el-form-item__content {
+            display: flex;
+            column-gap: 5px;
+            align-items: center;
+          }
+
+          .el-input {
+            width: 194px;
+          }
+
+          .verificationCode-btn {
+            display: flex;
+            flex: 1;
+            align-items: center;
+            justify-content: center;
+            width: 90px;
+            height: 48px;
+            font-size: 14px;
+            font-weight: 700;
+            color: #fff;
+            cursor: pointer;
+            background: #f90;
+            border-radius: 4px;
+
+            &.waitTime {
+              color: #6c6c6c;
+              background: #f0f0f0;
+            }
+          }
+        }
+
         .login-button {
           width: 100%;
           height: 48px;

src/views/org_manager/ShowOrg.vue

@@ -61,7 +61,7 @@
       <div class="org-image">
         <el-image :src="orgInfo.picture_url">
           <div slot="error" class="image-slot">
-            <i class="el-icon-picture-outline" />
+            <i class="el-icon-picture-outline"></i>
           </div>
         </el-image>
       </div>
@@ -77,40 +77,43 @@
 import { GetOrgInfo } from '@/api/org';
 
 export default {
-  props: {
-    orgId: {
-      default: '',
-      type: String
-    }
-  },
-  data() {
-    return {
-      visible: false,
-      orgInfo: {}
-    };
-  },
-  watch: {
-    visible(newValue) {
-      if (newValue) {
-        GetOrgInfo({ id: this.orgId }).then(res => {
-          this.orgInfo = res;
-        });
-      } else {
-        this.orgInfo = {};
-      }
-    }
-  },
-  methods: {
-    show() {
-      this.visible = true;
-    },
-    close() {
-      this.visible = false;
-    }
-  }
+  name: 'ShowOrg'
 };
 </script>
 
+<script setup>
+import { ref, watch } from 'vue';
+
+const props = defineProps({
+  orgId: {
+    default: '',
+    type: String
+  }
+});
+
+let visible = ref(false);
+let orgInfo = ref({});
+watch(visible, newVal => {
+  if (newVal) {
+    GetOrgInfo({ id: props.orgId }).then(res => {
+      orgInfo.value = res;
+    });
+  } else {
+    orgInfo.value = {};
+  }
+});
+
+function show() {
+  visible.value = true;
+}
+
+function close() {
+  visible.value = false;
+}
+
+defineExpose({ show });
+</script>
+
 <style lang="scss" scoped>
 .org {
   display: flex;

src/views/settings/configure/LiveRoomConfig.vue

@@ -22,36 +22,32 @@
 </template>
 
 <script>
+export default {
+  name: 'LiveRoom'
+};
+</script>
+
+<script setup>
+import { ref } from 'vue';
 import { GetLiveRoomConfig, SetLiveRoomConfig } from '@/api/settings';
+import { Message } from 'element-ui';
 
-export default {
-  data() {
-    return {
-      form: {
-        user_id: '',
-        api_key: '',
-        unit_price_1v1: 0,
-        unit_price_1vm: 0
-      }
-    };
-  },
-  created() {
-    this.getLiveRoomConfig();
-  },
-  methods: {
-    getLiveRoomConfig() {
-      GetLiveRoomConfig().then(({ user_id, api_key, unit_price_1v1, unit_price_1vm }) => {
-        this.form = { user_id, api_key, unit_price_1v1, unit_price_1vm };
-      });
-    },
+let form = ref({
+  user_id: '',
+  api_key: '',
+  unit_price_1v1: 0,
+  unit_price_1vm: 0
+});
 
-    setLiveRoomConfig() {
-      SetLiveRoomConfig(this.form).then(() => {
-        this.$message.success('设置场景视频对接配置成功');
-      });
-    }
-  }
-};
+GetLiveRoomConfig().then(({ user_id, api_key, unit_price_1v1, unit_price_1vm }) => {
+  form.value = { user_id, api_key, unit_price_1v1, unit_price_1vm };
+});
+
+function setLiveRoomConfig() {
+  SetLiveRoomConfig(form.value).then(() => {
+    Message.success('设置场景视频对接配置成功');
+  });
+}
 </script>
 
 <style lang="scss" scoped>

src/views/settings/configure/MailboxConfig.vue

@@ -22,41 +22,36 @@
 </template>
 
 <script>
+export default {
+  name: 'MaiboxConfig'
+};
+</script>
+
+<script setup>
+import { ref } from 'vue';
 import { SetMailboxConfig, GetMailboxConfig } from '@/api/settings';
+import { Message } from 'element-ui';
 
-export default {
-  data() {
-    return {
-      form: {
-        address: '',
-        smtp: '',
-        user_name: '',
-        password: ''
-      }
-    };
-  },
-  created() {
-    this.getMailboxConfig();
-  },
-  methods: {
-    setMailboxConfig() {
-      SetMailboxConfig(this.form).then(() => {
-        this.$message.success('设置邮箱配置成功');
-      });
-    },
+let form = ref({
+  address: '',
+  smtp: '',
+  user_name: '',
+  password: ''
+});
+GetMailboxConfig().then(({ address, smtp, user_name, password }) => {
+  form.value = {
+    address,
+    smtp,
+    user_name,
+    password
+  };
+});
 
-    getMailboxConfig() {
-      GetMailboxConfig().then(({ address, smtp, user_name, password }) => {
-        this.form = {
-          address,
-          smtp,
-          user_name,
-          password
-        };
-      });
-    }
-  }
-};
+function setMailboxConfig() {
+  SetMailboxConfig(form.value).then(() => {
+    Message.success('设置邮箱配置成功');
+  });
+}
 </script>
 
 <style lang="scss" scoped>

src/views/settings/configure/SXYZFConfig.vue

@@ -26,62 +26,61 @@
         </el-upload>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" @click="UpdateSysConfig_SXYZF">应用</el-button>
+        <el-button type="primary" @click="updateSysConfig_SXYZF">应用</el-button>
       </el-form-item>
     </el-form>
   </div>
 </template>
 
 <script>
+export default {
+  name: 'SXYZFConfig'
+};
+</script>
+
+<script setup>
+import { ref } from 'vue';
 import { GetSysConfig_SXYZF, UpdateSysConfig_SXYZF } from '@/api/settings';
 import { fileUpload } from '@/api/app';
+import { Message } from 'element-ui';
 
-export default {
-  data() {
-    return {
-      form: {
-        merchant_id: '',
-        pay_finish_notify_request_server_url: '',
-        pay_success_callback_page_url: '',
-        private_key_file_id: '',
-        private_key_file_name: '',
-        private_key_password: '',
-        public_key_file_id: '',
-        public_key_file_name: ''
-      }
-    };
-  },
-  created() {
-    GetSysConfig_SXYZF().then(res => {
-      this.form = res;
-    });
-  },
-  methods: {
-    // 上传文件
-    upload(file) {
-      fileUpload('Open', file).then(({ file_info_list }) => {
-        this.$message.success('上传成功');
-        if (file_info_list.length <= 0) return;
-        let fileInfo = file_info_list[0];
-        if (file.action === 'private') {
-          this.form.private_key_file_name = fileInfo.file_name;
-          this.form.private_key_file_id = fileInfo.file_id;
-          return;
-        }
-        if (file.action === 'public') {
-          this.form.public_key_file_name = fileInfo.file_name;
-          this.form.public_key_file_id = fileInfo.file_id;
-        }
-      });
-    },
+let form = ref({
+  merchant_id: '',
+  pay_finish_notify_request_server_url: '',
+  pay_success_callback_page_url: '',
+  private_key_file_id: '',
+  private_key_file_name: '',
+  private_key_password: '',
+  public_key_file_id: '',
+  public_key_file_name: ''
+});
+GetSysConfig_SXYZF().then(res => {
+  form.value = res;
+});
 
-    UpdateSysConfig_SXYZF() {
-      UpdateSysConfig_SXYZF({ ...this.form }).then(() => {
-        this.$message.success('更新首信易支付配置成功');
-      });
+// 上传文件
+function upload(file) {
+  fileUpload('Open', file).then(({ file_info_list }) => {
+    Message.success('上传成功');
+    if (file_info_list.length <= 0) return;
+    let fileInfo = file_info_list[0];
+    if (file.action === 'private') {
+      form.value.private_key_file_name = fileInfo.file_name;
+      form.value.private_key_file_id = fileInfo.file_id;
+      return;
     }
-  }
-};
+    if (file.action === 'public') {
+      form.value.public_key_file_name = fileInfo.file_name;
+      form.value.public_key_file_id = fileInfo.file_id;
+    }
+  });
+}
+
+function updateSysConfig_SXYZF() {
+  UpdateSysConfig_SXYZF(form.value).then(() => {
+    Message.success('更新首信易支付配置成功');
+  });
+}
 </script>
 
 <style lang="scss" scoped>

src/views/settings/index.vue

@@ -24,20 +24,23 @@
 
 <script>
 export default {
-  data() {
-    return {
-      curName: this.$route.meta.name
-    };
-  },
-  methods: {
-    handleSelect(key) {
-      if (this.$route.meta.name === key) return;
-      this.$router.push(`/settings/index/${key}`);
-    }
-  }
+  name: 'SettingPage'
 };
 </script>
 
+<script setup>
+import { useRoute, useRouter } from 'vue-router/composables';
+
+const route = useRoute();
+const router = useRouter();
+
+let curName = route.meta.name;
+function handleSelect(key) {
+  if (route.meta.name === key) return;
+  router.push(`/settings/index/${key}`);
+}
+</script>
+
 <style lang="scss">
 @import '~@/styles/mixin';