!45 重构：短信模板和短信日志vue2改vue3

Merge pull request !45 from puhui999/master

Author: YunaiV

.gitignore

@@ -5,4 +5,5 @@ dist-ssr
 *.local
 /dist*
 *-lock.*
-pnpm-debug
+pnpm-debug
+.idea

src/api/system/sensitiveWord/index.ts

@@ -24,41 +24,41 @@ export interface SensitiveWordExportReqVO {
 }
 
 // 查询敏感词列表
-export const getSensitiveWordPageApi = (params: SensitiveWordPageReqVO) => {
+export const getSensitiveWordPage = (params: SensitiveWordPageReqVO) => {
   return request.get({ url: '/system/sensitive-word/page', params })
 }
 
 // 查询敏感词详情
-export const getSensitiveWordApi = (id: number) => {
+export const getSensitiveWord = (id: number) => {
   return request.get({ url: '/system/sensitive-word/get?id=' + id })
 }
 
 // 新增敏感词
-export const createSensitiveWordApi = (data: SensitiveWordVO) => {
+export const createSensitiveWord = (data: SensitiveWordVO) => {
   return request.post({ url: '/system/sensitive-word/create', data })
 }
 
 // 修改敏感词
-export const updateSensitiveWordApi = (data: SensitiveWordVO) => {
+export const updateSensitiveWord = (data: SensitiveWordVO) => {
   return request.put({ url: '/system/sensitive-word/update', data })
 }
 
 // 删除敏感词
-export const deleteSensitiveWordApi = (id: number) => {
+export const deleteSensitiveWord = (id: number) => {
   return request.delete({ url: '/system/sensitive-word/delete?id=' + id })
 }
 
 // 导出敏感词
-export const exportSensitiveWordApi = (params: SensitiveWordExportReqVO) => {
+export const exportSensitiveWord = (params: SensitiveWordExportReqVO) => {
   return request.download({ url: '/system/sensitive-word/export-excel', params })
 }
 
 // 获取所有敏感词的标签数组
-export const getSensitiveWordTagsApi = () => {
+export const getSensitiveWordTags = () => {
   return request.get({ url: '/system/sensitive-word/get-tags' })
 }
 
 // 获得文本所包含的不合法的敏感词数组
-export const validateTextApi = (id: number) => {
+export const validateText = (id: number) => {
   return request.get({ url: '/system/sensitive-word/validate-text?' + id })
 }

src/api/system/sms/smsChannel/index.ts

@@ -12,6 +12,12 @@ export interface SmsChannelVO {
   createTime: Date
 }
 
+export interface SmsChannelListVO {
+  id: number
+  code: string
+  signature: string
+}
+
 export interface SmsChannelPageReqVO extends PageParam {
   signature?: string
   code?: string

src/api/system/sms/smsLog/index.ts

@@ -1,39 +1,40 @@
 import request from '@/config/axios'
 
 export interface SmsLogVO {
-  id: number
-  channelId: number
+  id: number | null
+  channelId: number | null
   channelCode: string
-  templateId: number
+  templateId: number | null
   templateCode: string
-  templateType: number
+  templateType: number | null
   templateContent: string
-  templateParams: Map<string, object>
+  templateParams: Map<string, object> | null
+  apiTemplateId: string
   mobile: string
-  userId: number
-  userType: number
-  sendStatus: number
-  sendTime: Date
-  sendCode: number
+  userId: number | null
+  userType: number | null
+  sendStatus: number | null
+  sendTime: Date | null
+  sendCode: number | null
   sendMsg: string
   apiSendCode: string
   apiSendMsg: string
   apiRequestId: string
   apiSerialNo: string
-  receiveStatus: number
-  receiveTime: Date
+  receiveStatus: number | null
+  receiveTime: Date | null
   apiReceiveCode: string
   apiReceiveMsg: string
-  createTime: Date
+  createTime: Date | null
 }
 
 export interface SmsLogPageReqVO extends PageParam {
-  channelId?: number
-  templateId?: number
+  channelId?: number | null
+  templateId?: number | null
   mobile?: string
-  sendStatus?: number
+  sendStatus?: number | null
   sendTime?: Date[]
-  receiveStatus?: number
+  receiveStatus?: number | null
   receiveTime?: Date[]
 }
 export interface SmsLogExportReqVO {

src/api/system/sms/smsTemplate/index.ts

@@ -1,18 +1,18 @@
 import request from '@/config/axios'
 
 export interface SmsTemplateVO {
-  id: number
-  type: number
-  status: number
+  id: number | null
+  type: number | null
+  status: number | null
   code: string
   name: string
   content: string
   remark: string
   apiTemplateId: string
-  channelId: number
-  channelCode: string
-  params: string[]
-  createTime: Date
+  channelId: number | null
+  channelCode?: string
+  params?: string[]
+  createTime?: Date
 }
 
 export interface SendSmsReqVO {
@@ -21,13 +21,13 @@ export interface SendSmsReqVO {
   templateParams: Map<String, Object>
 }
 
-export interface SmsTemplatePageReqVO {
-  type?: number
-  status?: number
+export interface SmsTemplatePageReqVO extends PageParam {
+  type?: number | null
+  status?: number | null
   code?: string
   content?: string
   apiTemplateId?: string
-  channelId?: number
+  channelId?: number | null
   createTime?: Date[]
 }
 

src/components/RightToolbar/index.ts

@@ -0,0 +1,9 @@
+import RightToolbar from './src/index.vue'
+
+export interface columnsType {
+  key?: number
+  label?: string
+  visible?: boolean
+}
+
+export { RightToolbar }

src/components/RightToolbar/src/index.vue

@@ -0,0 +1,104 @@
+<template>
+  <div :style="style">
+    <el-row justify="end">
+      <el-tooltip
+        class="item"
+        effect="dark"
+        :content="showSearch ? '隐藏搜索' : '显示搜索'"
+        placement="top"
+        v-if="search"
+      >
+        <el-button circle @click="toggleSearch()">
+          <Icon icon="ep:search" />
+        </el-button>
+      </el-tooltip>
+      <el-tooltip class="item" effect="dark" content="刷新" placement="top">
+        <el-button circle @click="refresh()">
+          <Icon icon="ep:refresh" />
+        </el-button>
+      </el-tooltip>
+      <el-tooltip class="item" effect="dark" content="显隐列" placement="top" v-if="isColumns">
+        <el-button circle @click="showColumn()">
+          <Icon icon="ep:menu" />
+        </el-button>
+      </el-tooltip>
+    </el-row>
+    <el-dialog :title="title" v-model="open" append-to-body>
+      <el-transfer
+        :titles="['显示', '隐藏']"
+        v-model="value"
+        :data="columns"
+        @change="dataChange"
+      />
+    </el-dialog>
+  </div>
+</template>
+<script lang="ts" setup name="RightToolbar">
+import type { CSSProperties } from 'vue'
+import type { columnsType } from '@/components/RightToolbar'
+import { propTypes } from '@/utils/propTypes'
+// 显隐数据
+const value = ref<number[]>([])
+// 弹出层标题
+const title = ref('显示/隐藏')
+// 是否显示弹出层
+const open = ref(false)
+
+const props = defineProps({
+  showSearch: propTypes.bool.def(true),
+  columns: {
+    type: Array as PropType<columnsType[]>,
+    default: () => []
+  },
+  search: propTypes.bool.def(true),
+  gutter: propTypes.number.def(10)
+})
+const isColumns = computed(() => props.columns?.length > 0)
+const style = computed((): CSSProperties => {
+  const ret: CSSProperties = {}
+  if (props.gutter) {
+    ret.marginRight = `${props.gutter / 2}px`
+  }
+  return ret
+})
+const emit = defineEmits(['update:showSearch', 'queryTable'])
+// 搜索
+const toggleSearch = () => {
+  emit('update:showSearch', !props.showSearch)
+}
+// 刷新
+const refresh = () => {
+  emit('queryTable')
+}
+// 右侧列表元素变化
+const dataChange = (data: number[]) => {
+  props.columns.forEach((item) => {
+    const key: number = item.key!
+    item.visible = !data.includes(key)
+  })
+}
+// 打开显隐列dialog
+const showColumn = () => {
+  open.value = true
+}
+// 显隐列初始默认隐藏列
+const init = () => {
+  props.columns.forEach((item, index) => {
+    if (item.visible === false) {
+      value.value.push(index)
+    }
+  })
+}
+init()
+</script>
+<style lang="scss" scoped>
+:deep(.el-transfer__button) {
+  border-radius: 50%;
+  padding: 12px;
+  display: block;
+  margin-left: 0px;
+}
+:deep(.el-transfer__button:first-child) {
+  margin-bottom: 10px;
+}
+</style>

src/components/index.ts

@@ -9,6 +9,7 @@ import { XButton, XTextButton } from '@/components/XButton'
 import { DictTag } from '@/components/DictTag'
 import { ContentWrap } from '@/components/ContentWrap'
 import { Descriptions } from '@/components/Descriptions'
+import { RightToolbar } from '@/components/RightToolbar'
 
 export const setupGlobCom = (app: App<Element>): void => {
   app.component('Icon', Icon)
@@ -22,4 +23,5 @@ export const setupGlobCom = (app: App<Element>): void => {
   app.component('DictTag', DictTag)
   app.component('ContentWrap', ContentWrap)
   app.component('Descriptions', Descriptions)
+  app.component('RightToolbar', RightToolbar)
 }

src/layout/components/Message/src/Message.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import dayjs from 'dayjs'
+import { parseTime } from '@/utils/formatTime'
 import * as NotifyMessageApi from '@/api/system/notify/message'
 
 const { push } = useRouter()
@@ -57,7 +57,7 @@ onMounted(() => {
                     {{ item.templateNickname }}：{{ item.templateContent }}
                   </span>
                   <span class="message-date">
-                    {{ dayjs(item.createTime).format('YYYY-MM-DD HH:mm:ss') }}
+                    {{ parseTime(item.createTime) }}
                   </span>
                 </div>
               </div>

src/locales/zh-CN.ts

@@ -303,7 +303,14 @@ export default {
   dialog: {
     dialog: '弹窗',
     open: '打开',
-    close: '关闭'
+    close: '关闭',
+    sms: {
+      template: {
+        addTitle: '添加短信模板',
+        updtaeTitle: '修改短信模板',
+        sendSms: '发送短信'
+      }
+    }
   },
   sys: {
     api: {