Merge branch 'dev' of gitlab.33.cn:CassiniatSaturn/fns_backend into dev

src/components/UserManage/addSuperManagerModal.vue

@@ -26,6 +26,7 @@
       <a-form-model-item label="手机号" prop="tel">
         <a-input
           v-model="form.tel"
+          :maxLength="11"
           placeholder="请输入手机号"
           style="width: 200px;"
         />
@@ -93,7 +94,7 @@ export default Vue.extend({
         { required: true, message: '请输入名称', max: 6, trigger: 'blur' },
       ],
       tel: [
-        { required: true, message: '请输入手机号', max: 11, trigger: 'blur' },
+        { required: true, message: '请输入手机号', len: 11, trigger: 'blur' },
       ],
       bank: [{ required: true, message: '请输入所属银行', trigger: 'blur' }],
     }
@@ -142,6 +143,7 @@ export default Vue.extend({
           )
           if (ret && ret.code === 200) {
             message.success('发布成功')
+            this.$store.dispatch('platformUserManagement/query')
           }
         } else {
           return false

src/components/UserManage/superManagerTable.vue

@@ -8,29 +8,40 @@
       style="text-align: center;"
       bordered
     >
-      <span slot="level">超级管理员</span>
+      <span slot="level">银行管理员</span>
       <template #created_at="text">
         {{ text | formatDate }}
       </template>
       <template #status="text">
-        {{ text | filterUserStatus }}
+        {{ text | platformfilterUserStatus }}
       </template>
       <div slot="action" slot-scope="text, record">
         <a
-          :class="record.status == eUserStatus.enable ? 'undeleteable' : ' '"
+          :class="
+            record.status == eUserResStatus.enable_notOnPosition ||
+            record.status === eUserResStatus.enable_onPosition
+              ? 'undeleteable'
+              : ' '
+          "
           @click="showModal(record, 0)"
         >
           删除
         </a>
         <a-divider type="vertical" />
         <a
-          v-if="record.status == eUserStatus.disable"
+          v-if="
+            record.status == eUserResStatus.disable_noPosition ||
+            record.status === eUserResStatus.disable_notOnPosition
+          "
           @click="showModal(record, 1)"
         >
           启用
         </a>
         <a
-          v-else-if="eUserStatus.enable === record.status"
+          v-else-if="
+            record.status === eUserResStatus.enable_notOnPosition ||
+            eUserResStatus.enable_onPosition
+          "
           @click="showModal(record, 2)"
         >
           禁用
@@ -65,7 +76,7 @@ import { modalType } from './const'
 import { getPlatformUserManagementTableColumns } from '@/const/columns/superManagerColumn'
 import { mapActions, mapMutations, mapState } from 'vuex'
 import StaffService from '@/service/StaffService'
-import { eUserStatus } from '@/types/user'
+import { eUserReqStatus, eUserResStatus } from '@/types/user'
 
 export default Vue.extend({
   computed: {
@@ -90,7 +101,8 @@ export default Vue.extend({
       show: false,
       content: '',
       title: '',
-      eUserStatus,
+      eUserReqStatus,
+      eUserResStatus,
     }
   },
   methods: {
@@ -121,19 +133,24 @@ export default Vue.extend({
       }
       this.show = true
     },
-    handleOk() {
+    async handleOk() {
       if (this.type == modalType.delete) {
+        await StaffService.getInstance().deleteStaff(this.uuid)
       } else if (this.type == modalType.on) {
-        StaffService.getInstance().modifyStaffStatus({
+        await StaffService.getInstance().modifyStaffStatus({
           uuid: this.uuid,
-          status: eUserStatus.enable,
+          status: eUserReqStatus.enable,
         })
       } else if (this.type == modalType.off) {
-        StaffService.getInstance().modifyStaffStatus({
+        await StaffService.getInstance().modifyStaffStatus({
           uuid: this.uuid,
-          status: eUserStatus.disable,
+          status: eUserReqStatus.disable,
         })
       }
+      this.$store.commit('/platformUserManagement/save', {
+        page: 1,
+      })
+      this.$store.dispatch('/platformUserManagement/query')
       this.show = false
     },
   },

src/components/UserManage/topBar.vue

@@ -42,6 +42,7 @@
       class="my-1"
       :is="type == 1 ? 'addNormalManagerModal' : 'addSuperManagerModal'"
       ref="addrModal"
+      :userType="type"
       :level="level"
     />
   </div>

src/const/columns/bannerColumns.ts

-import { column } from "@/types/column"
-const columns:Array<column>=
-[
+import { column } from '@/types/column'
+const columns: Array<column> = [
   {
     title: '发布时间',
-    align:'center',
-    dataIndex: 'time',
+    align: 'center',
+    dataIndex: 'created_at',
+    scopedSlots: { customRender: 'created_at' },
   },
   {
     title: 'banner名称',
-    align:'center',
-    dataIndex: 'name',
+    align: 'center',
+    dataIndex: 'title',
   },
   {
     title: 'banner位置',
-    align:'center',
+    align: 'center',
     dataIndex: 'location',
+    scopedSlots: { customRender: 'location' },
   },
   {
     title: '图片',
-    align:'center',
-    dataIndex: 'path',
-    scopedSlots: { customRender: 'path' },
+    align: 'center',
+    dataIndex: 'file_name',
+    scopedSlots: { customRender: 'file_name' },
   },
   {
     title: '状态',
-    align:'center',
-    dataIndex: 'state',
+    align: 'center',
+    dataIndex: 'banner_status',
+    scopedSlots: { customRender: 'banner_status' },
   },
   {
     title: '操作',
-    align:'center',
+    align: 'center',
     key: 'action',
     scopedSlots: { customRender: 'action' },
-  }
+  },
 ]
 
-export {
-  columns
-}
+export { columns }
\ No newline at end of file

src/const/config/upload.ts

+export const ACCEPT_IMAGE_TYPE = '.jpg,.jpep,.png'
+
+export function isAcceptImageType(file: File) {
+  const isCorrectType = file.name.match(/(\.jpg|\.jpep|\.png)$/)
+  return !!isCorrectType
+}
+
+export const TOAST_TEXT = '请上传jpg或jpep或png文件'
+
+// 最大上传大小 40M
+export const MAX_IMAGE_SIZE = 1024 * 1024 * 40
+
+export const TOAST_TEXT2 = '请上传小于40M的图片'

src/filter/index.ts

-import { eUserStatus } from '@/types/user'
+import { eBannerLocation, eBannerStatus } from '@/types/banner'
+import { eUserResStatus } from '@/types/user'
 import moment from 'moment'
 
 export default {
@@ -10,16 +11,44 @@ export default {
       return ''
     }
   },
-  filterUserStatus(status: eUserStatus) {
+  filterUserStatus(status: eUserResStatus) {
     switch (status) {
-      case eUserStatus.disable:
+      case eUserResStatus.disable_noPosition:
         return '禁用'
-      case eUserStatus.enable:
+      case eUserResStatus.disable_notOnPosition:
+        return '禁用'
+      case eUserResStatus.enable_notOnPosition:
+        return '启用/不在岗'
+      case eUserResStatus.enable_onPosition:
+        return '启用/在岗'
+    }
+  },
+  platformfilterUserStatus(status: eUserResStatus) {
+    switch (status) {
+      case eUserResStatus.disable_noPosition:
+        return '禁用'
+      case eUserResStatus.disable_notOnPosition:
+        return '禁用'
+      case eUserResStatus.enable_notOnPosition:
+        return '启用'
+      case eUserResStatus.enable_onPosition:
         return '启用'
-      case eUserStatus.onPosition:
-        return '在岗'
-      case eUserStatus.notOnPosition:
-        return '不在岗'
+    }
+  },
+  filterBannerLocation(status: eBannerLocation) {
+    switch (status) {
+      case eBannerLocation.home:
+        return '首页'
+    }
+  },
+  filtereBannerStatus(status: eBannerStatus) {
+    switch (status) {
+      case eBannerStatus.editable:
+        return '未发布'
+      case eBannerStatus.delete:
+        return '删除'
+      case eBannerStatus.published:
+        return '已发布'
     }
   },
 } as {

src/service/BannerManagementService/index.ts

 import baseAxios from '../index'
 import { banner_status } from '@/views/Root/Banner/const'
+import { iBannerItem } from './types'
+import { eBannerStatus } from '@/types/banner'
 const prefix = '/banner/admin'
 
 // 新增banner信息
@@ -17,12 +19,18 @@ export function bannerAdd(data: {
 
 // 查询banner列表
 export function bannerQuery(data: {
-  banner_status: 0
-  location:0
-  end_time: number
-  start_time: number
+  banner_status: eBannerStatus
+  location: number
+  end_time?: number
+  start_time?: number
+  limit?: number
+  offset?: number
 }) {
-  return baseAxios({
+  return baseAxios<{
+    count: number
+    items: iBannerItem[]
+    total: number
+  }>({
     url: prefix + '/list',
     method: 'POST',
     data,
@@ -31,12 +39,12 @@ export function bannerQuery(data: {
 
 // 修改banner状态
 export function bannerModify(data: {
-  banner_status: banner_status
-  uuid:string
+  banner_status: eBannerStatus
+  uuid: string
 }) {
   return baseAxios({
     url: prefix + '/modify',
     method: 'POST',
     data,
   })
-}
+}
\ No newline at end of file

src/service/BannerManagementService/types.ts

+export interface iBannerItem {
+  banner_status: number
+  created_at: number
+  file_name: string
+  location: number
+  title: string
+  update_at: number
+  uuid: string
+}

src/service/FileService/index.ts

+import baseAxios from '../index'
+export default class FileService {
+  static instance: FileService
+  static getInstance() {
+    if (!FileService.instance) {
+      FileService.instance = new FileService()
+    }
+    return FileService.instance
+  }
+
+  download(file_hash: string) {
+    return (baseAxios({
+      method: 'get',
+      url: '/image/download',
+      params: {
+        file_hash,
+      },
+    }) as unknown) as Promise<File>
+  }
+
+  getImageSrc(file_hash: string) {
+    return `/proxyApi/api/v1/image/show?file_hash=${file_hash}`
+  }
+
+  showImage(file_hash: string) {
+    return (baseAxios({
+      method: 'get',
+      url: '/image/show',
+      params: {
+        file_hash,
+      },
+    }) as unknown) as Promise<File>
+  }
+
+  uploadImage(uploadFile: File) {
+    const fd = new FormData()
+    fd.append('uploadFile', uploadFile)
+    return baseAxios<string>({
+      method: 'post',
+      url: '/image/upload',
+      data: fd,
+    })
+  }
+}

src/service/StaffService/index.ts

-import { eUserStatus } from '@/types/user'
+import { eUserReqStatus } from '@/types/user'
 import baseAxios from '../index'
 
 export default class StaffService {
@@ -10,11 +10,18 @@ export default class StaffService {
     return StaffService.instance
   }
 
-  modifyStaffStatus(data: { status: eUserStatus; uuid: string }) {
+  modifyStaffStatus(data: { status: eUserReqStatus; uuid: string }) {
     return baseAxios({
       url: '/staff/modifyStatus',
       method: 'PUT',
       data,
     })
   }
+
+  deleteStaff(uuid: string) {
+    return baseAxios({
+      url: '/staff/' + uuid,
+      method: 'delete',
+    })
+  }
 }

src/service/UserManagementService/index.ts

 import { eLevel } from '@/types/level'
 import { eNewRoleRelatedToBackEnd } from '@/types/role'
-import { eUserStatus } from '@/types/user'
+import { eUserReqStatus } from '@/types/user'
 import { eUserType } from '@/types/userType'
 import baseAxios from '../index'
 
@@ -142,7 +142,7 @@ export default class UserService {
         role: string
         second_branch: string
         second_sub_branch: string
-        status: eUserStatus
+        status: eUserReqStatus
         user_name: string
         uuid: string
       }[]

src/service/index.ts

@@ -14,8 +14,8 @@ const baseAxios = axios.create({
 baseAxios.interceptors.response.use(
   (value: AxiosResponse<iRet>) => {
     const ret = value.data
-    if (ret.code !== 200) {
-      if(ret.code === 504){
+    if (ret.code !== undefined && ret.code !== 200) {
+      if (ret.code === 504) {
         // deleteUserMsg();
       }
       message.error(ret.msg)

src/types/banner.ts

-export interface banner{
-  key:string
-  time:string,
-  name:string,
-  location:string,
-  path:string,
-  state:string
-}
+export interface banner {
+  key: string
+  time: string
+  name: string
+  location: string
+  path: string
+  state: string
+}
\ No newline at end of file
+
+export enum eBannerLocation {
+  all = 0,
+  home = 1,
+}
+
+// 0:全部状态，1:可编辑，2:已发布，3:删除
+export enum eBannerStatus {
+  all = 0,
+  editable = 1,
+  published = 2,
+  delete = 3,
+}

src/types/role.ts

 export enum eRole {
   platform_management, // 平台管理员
-  superManager, // 超级管理员 也 叫 银行管理员
+  superManager, // 超级管理员 也叫 银行管理员
 
   firstLevel_branch, // 一级分行管理员
   secondary_branch, // 二级分行管理员

src/types/user.ts

@@ -7,9 +7,16 @@ export interface user {
   note?: string
 }
 
-export enum eUserStatus {
-  disable = 0,
-  enable = 1,
-  onPosition = 2,
+export enum eUserReqStatus {
+  disable = 1,
+  enable = 2,
+  onPosition = 3,
   notOnPosition = 4,
 }
+
+export enum eUserResStatus {
+  disable_notOnPosition = 0,
+  disable_noPosition = 1,
+  enable_notOnPosition = 2,
+  enable_onPosition = 3,
+}

src/views/Login/index.vue

@@ -235,8 +235,6 @@ export default Vue.extend({
         this.$router.push({
           name: "home",
         });
-      } else {
-        message.warn(ret.msg);
       }
     },
     async handleClickLogin() {
@@ -256,15 +254,6 @@ export default Vue.extend({
           console.log(err);
         }
         this.loading = false;
-        
-        // setUserMsg({
-        //   userInfo: 'lakds',
-        //   token: 'aldksfj',
-        //   role: eRole.superManager,
-        // })
-        // this.$router.push({
-        //   name: 'home'
-        // })
       } else {
         return false;
       }

src/views/Root/Banner/index.vue

 <template>
   <div>
-    <p class=" text-2xl font-bold mb-5">Banner管理</p>
+    <p class="text-2xl font-bold mb-5">Banner管理</p>
     <!-- timepicker -->
-    <span class=" font-semibold">发布时间：</span>
-    <timerange class=" mr-3"
-              @getNewTime="getNewTime"/>
-    <a-button type="primary" style=" margin-right:10px;" @click="query">查询</a-button>
+    <span class="font-semibold">发布时间：</span>
+    <timerange
+      class="mr-3"
+      @getNewTime="getNewTime"
+      :startTime="queryParam.startTime"
+      :endTime="queryParam.endTime"
+    />
+    <a-button type="primary" style="margin-right: 10px;" @click="fetchList">
+      查询
+    </a-button>
     <!-- 新增 -->
     <a-button type="primary" @click="showModal">新增</a-button>
     <!-- 上传弹窗 -->
     <a-modal
+      :afterClose="afterAddNewBannerModalClose"
       title="新增"
       v-model="visible"
       :centered="true"
       footer=""
       :closable="false"
     >
-      <a-form-model :model="form" 
-                    :label-col=" { span: 5 }" 
-                    :wrapper-col=" { span: 10 }" 
-                    ref="ruleForm" 
-                    :rules="rules">
+      <a-form-model
+        :model="form"
+        :label-col="{ span: 5 }"
+        :wrapper-col="{ span: 10 }"
+        ref="ruleForm"
+        :rules="rules"
+      >
         <a-form-model-item label="Banner名称" prop="name">
-          <a-input style="width:200px" v-model="form.name" placeholder="请输入名称"/>
+          <a-input
+            style="width: 200px;"
+            v-model="form.name"
+            placeholder="请输入名称"
+          />
         </a-form-model-item>
         <a-form-model-item label="Banner位置">
-          <span class=" text-sm text-black">首页</span>
+          <span class="text-sm text-black">首页</span>
         </a-form-model-item>
-        <a-form-model-item label="上传图片" :required="true" prop="file">
+        <a-form-model-item label="上传图片" :required="true" prop="fileList">
           <a-upload
-            name="file"
-            action="#"
-            accept="image/*"
+            :beforeUpload="beforeUpload"
+            name="uploadFile"
+            action="/proxyApi/api/v1/image/upload"
+            :accept="ACCEPT_IMAGE_TYPE"
+            :file-list="form.fileList"
             @change="handleChange"
             required
           >
-            <a-button style="width:200px"> <a-icon type="upload" /> 点击上传 </a-button>
+            <a-button style="width: 200px;" :disabled="alreadlyHasOneImage">
+              <a-icon type="upload" />
+              点击上传
+            </a-button>
           </a-upload>
         </a-form-model-item>
         <a-form-model-item :wrapper-col="{ span: 9, offset: 5 }">
           <a-button type="primary" @click="onSubmit">发布</a-button>
-          <a-button style="margin-left: 10px;" @click="visible=false">取消</a-button>
+          <a-button style="margin-left: 10px;" @click="visible = false">
+            取消
+          </a-button>
         </a-form-model-item>
       </a-form-model>
     </a-modal>
     <!-- banner列表 -->
-    <a-table :columns="columns" 
-             :data-source="list" 
-             style=" text-align: center; margin-top:40px;" 
-             bordered>
-      <span slot="path" slot-scope="text,record">
-        <a-icon type="picture"  @click="preview(record.path)" theme="twoTone" style="fontSize:20px"/>
+    <a-table
+      :columns="columns"
+      :data-source="bannerList"
+      :loading="tableLoading"
+      :pagination="false"
+      style="text-align: center; margin-top: 40px;"
+      bordered
+    >
+      <template #created_at="text">
+        {{ text | formatDate }}
+      </template>
+      <template #banner_status="text">
+        {{ text | filtereBannerStatus }}
+      </template>
+      <template #location="text">
+        {{ text | filterBannerLocation }}
+      </template>
+      <span slot="file_name" slot-scope="text, record">
+        <a-icon
+          type="picture"
+          @click="preview(record.file_name)"
+          theme="twoTone"
+          style="fontsize: 20px;"
+        />
         <el-image-viewer
-           v-if="showViewer"
-            fit="scale-down"
-           :on-close="closeViewer"
-           :url-list="[url]" />
+          v-if="showViewer"
+          fit="scale-down"
+          :on-close="closeViewer"
+          :url-list="[url]"
+        />
       </span>
-      <span slot="action" slot-scope="text,record">
-        <span v-if="record.state=='下架'">
-          <a @click="addBanner">上架</a>
+      <span slot="action" slot-scope="text, record">
+        <span v-if="record.banner_status == eBannerStatus.editable">
+          <a @click="addBanner(record)">上架</a>
           <a-divider type="vertical" />
-          <a @click="deleteBanner">删除</a>
+          <a @click="deleteBanner(record)">删除</a>
         </span>
-        <a v-else
-           @click="removeBanner">下架</a>
+        <a
+          v-else-if="(record.banner_status == eBannerStatus.published)"
+          @click="removeBanner(record)"
+        >
+          下架
+        </a>
       </span>
     </a-table>
+    <a-pagination
+      class="text-right mt-4"
+      :current="current"
+      :total="total"
+      @change="handlePaginationChange"
+    ></a-pagination>
     <!-- 操作Modal -->
     <a-modal
       :title="title"
       v-model="show"
       :centered="true"
       :closable="false"
+      :confirmLoading="modalLoading"
       @ok="handleOk"
       @cancle="show = false"
     >
-      <p class=" text-center">{{text}}</p>
+      <p class="text-center">{{ text }}</p>
     </a-modal>
   </div>
 </template>
 <script lang="ts">
-import Vue from "vue"
-import { FormModel } from 'ant-design-vue'
+import Vue from 'vue'
+import { FormModel, message } from 'ant-design-vue'
 import timerange from '@/components/TimePicker/index.vue'
 import { bannerList } from '@/mock/index'
 import { columns } from '@/const/columns/bannerColumns'
 import { modalType } from './const'
-import { bannerQuery } from '@/service/BannerManagementService/index'
+import {
+  bannerQuery,
+  bannerModify,
+} from '@/service/BannerManagementService/index'
+import {
+  ACCEPT_IMAGE_TYPE,
+  isAcceptImageType,
+  TOAST_TEXT,
+  TOAST_TEXT2,
+  MAX_IMAGE_SIZE,
+} from '@/const/config/upload'
+import { bannerAdd } from '@/service/BannerManagementService/index'
+import { PAGE_SIZE } from '@/const/config/page'
+import { iBannerItem } from '@/service/BannerManagementService/types'
+import { eBannerStatus } from '@/types/banner'
+import FileService from '@/service/FileService/index'
 
 export default Vue.extend({
-  components:{
-    'el-image-viewer':()=>import('element-ui/packages/image/src/image-viewer.vue'),
-    timerange
+  components: {
+    'el-image-viewer': () =>
+      import('element-ui/packages/image/src/image-viewer.vue'),
+    timerange,
   },
-  computed:{
-    columns(){
+  computed: {
+    columns() {
       return columns
-    }
+    },
+    current(): number {
+      return this.queryParam.offset / this.queryParam.limit + 1
+    },
+    alreadlyHasOneImage(): boolean {
+      return this.form.fileList.length == 1
+    },
+  },
+  mounted() {
+    this.fetchList()
   },
   data() {
     let list = bannerList
-    return{
+    return {
+      uuid: '',
+      eBannerStatus,
+      ACCEPT_IMAGE_TYPE,
       visible: false,
-      show:false,
-      title:'',
-      text:'',
-      modalType:modalType.on,
-      queryParam:{
-        startTime:0,
-        endTime:0
+      show: false,
+      modalLoading: false,
+      title: '',
+      text: '',
+      modalType: modalType.on,
+      queryParam: {
+        startTime: undefined as undefined | number,
+        endTime: undefined as undefined | number,
+        limit: PAGE_SIZE,
+        offset: 0,
+        location: 0,
       },
+      tableLoading: false,
+      bannerList: [] as iBannerItem[],
+      total: 0,
       form: {
         name: '',
+        file_hash: '',
+        fileList: [],
       },
-      rules:{
-          name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
-          file: [{ required: true, message: '请上传文件', trigger: 'change' }],
+      rules: {
+        name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
+        fileList: [
+          { required: true, message: '请上传文件', trigger: 'change' },
+        ],
       },
-      showViewer:false,
-      url:'',
+      showViewer: false,
+      url: '',
       list,
-      img:require('../../../assets/pic.png'),
+      img: require('../../../assets/pic.png'),
     }
   },
-  methods:{
-    getNewTime(startTime:number,endTime:number){
+  methods: {
+    handlePaginationChange(current: number) {
+      this.queryParam.offset = (current - 1) * this.queryParam.limit
+      this.fetchList()
+    },
+    async fetchList() {
+      this.tableLoading = true
+      const ret = await bannerQuery({
+        end_time: this.queryParam.endTime,
+        start_time: this.queryParam.startTime,
+        limit: this.queryParam.limit,
+        offset: this.queryParam.offset,
+        location: this.queryParam.location,
+        banner_status: 0,
+      })
+      if (ret.code === 200) {
+        this.bannerList = ret.data.items
+        this.total = ret.data.total
+        this.tableLoading = false
+      }
+    },
+    afterAddNewBannerModalClose() {
+      const ref = this.$refs.ruleForm as FormModel
+      ref.resetFields()
+    },
+    getNewTime(startTime: number, endTime: number) {
       this.queryParam.startTime = startTime
       this.queryParam.endTime = endTime
     },
-    async query(){
-      const ret = await bannerQuery(
-        {
-          banner_status:0,
-          location:0,
-          start_time:this.queryParam.startTime,
-          end_time:this.queryParam.endTime
-        }
-      )
-      console.log(ret)
-    },
-    addBanner(record:any){
+    addBanner(record: any) {
+      this.uuid = record.uuid
       this.modalType = modalType.on
       this.show = true
       this.title = '上架Banner'
       this.text = '确定上架该Banner吗？'
     },
-    removeBanner(record:any){
+    removeBanner(record: any) {
+      this.uuid = record.uuid
       this.modalType = modalType.off
       this.show = true
       this.title = '下架Banner'
       this.text = '确定下架该Banner吗？'
     },
-    deleteBanner(record:any){
+    deleteBanner(record: any) {
+      this.uuid = record.uuid
       this.modalType = modalType.delete
       this.show = true
       this.title = '删除Banner'
-       this.text = '确定删除该Banner吗？'
+      this.text = '确定删除该Banner吗？'
     },
-    handleOk(record:any){
-      if( this.modalType == modalType.on){
-
-      } else if( this.modalType == modalType.off){
-        
-      } else if( this.modalType == modalType.delete){
-        
+    async handleOk(record: any) {
+      this.modalLoading = true
+      try {
+        if (this.modalType == modalType.on) {
+          await bannerModify({
+            banner_status: eBannerStatus.published,
+            uuid: this.uuid,
+          })
+        } else if (this.modalType == modalType.off) {
+          await bannerModify({
+            banner_status: eBannerStatus.editable,
+            uuid: this.uuid,
+          })
+        } else if (this.modalType == modalType.delete) {
+          await bannerModify({
+            banner_status: eBannerStatus.delete,
+            uuid: this.uuid,
+          })
+        }
+        this.show = false
+        this.fetchList()
+      } catch (err) {}
+      this.modalLoading = false
+    },
+    beforeUpload(file: File) {
+      const isAccpet = isAcceptImageType(file)
+      if (!isAccpet) {
+        message.error(TOAST_TEXT)
       }
+      const isLt4M = file.size < MAX_IMAGE_SIZE
+      if (!isLt4M) {
+        message.error(TOAST_TEXT2)
+      }
+      console.log(isAccpet && isLt4M)
 
-      this.show = false
+      return isAccpet && isLt4M
     },
-    handleChange(info:any) {
+    handleChange(info: any) {
+      console.log(info, 'show info')
+      const fileList = (info.fileList || []).filter((item: any) => {
+        return item.status !== undefined
+      })
+      this.form.fileList = fileList
+
       if (info.file.status !== 'uploading') {
-        console.log(info.file, info.fileList);
       }
       if (info.file.status === 'done') {
-        console.log(`${info.file.name} file uploaded successfully`);
+        if (info.file.response.code === 200) {
+          this.form.file_hash = info.file.response.data
+        }
       } else if (info.file.status === 'error') {
-        console.log(`${info.file.name} file upload failed.`);
       }
     },
     showModal() {
-      this.visible = true;
+      this.visible = true
     },
-    preview(src:string){
+    preview(file_name: string) {
       this.showViewer = true
+      const src = FileService.getInstance().getImageSrc(file_name)
       this.url = src
     },
-    closeViewer(){
+    closeViewer() {
       this.showViewer = false
     },
-    handleCancel(e:Event) {
-      this.visible = false;
+    handleCancel(e: Event) {
+      this.visible = false
     },
     onSubmit() {
-      (this.$refs.ruleForm as FormModel).validate(valid => {
+      ;(this.$refs.ruleForm as FormModel).validate((valid) => {
         if (valid) {
           this.visible = false
+          bannerAdd({
+            file_name: this.form.file_hash,
+            location: 1,
+            title: this.form.name,
+          }).then((ret) => {
+            if (ret.code === 200) {
+              this.fetchList()
+              message.success('发布成功')
+            }
+          })
         } else {
-          console.log('error submit!!');
-          return false;
+          console.log('error submit!!')
+          return false
         }
       })
     },
-  }
-});
+  },
+})
 </script>

src/views/Root/index.vue

@@ -2,7 +2,7 @@
   <div>
     <a-layout id="components-layout-demo-fixed-sider">
       <a-layout-sider width="256" style="background: white">
-        <div class="text-center text-lg my-3">合同后台</div>
+        <div class="text-center text-lg my-3">普惠金融后台</div>
         <a-menu
           style="width: 256px"
           :open-keys.sync="openKeys"