瀏覽代碼

feat: (notifcation) 对接

gemercheung 3 年之前
父節點
當前提交
c9f136909e

+ 27 - 3
src/api/notification/list.ts

@@ -1,8 +1,12 @@
 import { defHttp } from '/@/utils/http/axios';
-import { PageParams, MemberListGetResultModel } from './model';
+import { PageParams, ListGetResultModel, NoticeParams } from './model';
+import { Result } from '/#/axios';
 
 enum Api {
-  pageList = '/zfb-api/zfb/notification/list',
+  pageList = '/zfb-api/zfb/platform/notice/list',
+  addNotice = '/zfb-api/zfb/platform/notice/save',
+  delNotice = '/zfb-api/zfb/platform/notice/delete',
+  unreadNoticesList = '/zfb-api/zfb/platform/notice/unreadNoticesList',
 }
 
 /**
@@ -10,7 +14,7 @@ enum Api {
  */
 
 export const ListApi = (params: PageParams) =>
-  defHttp.post<MemberListGetResultModel>({
+  defHttp.post<ListGetResultModel>({
     url: Api.pageList,
     params,
     headers: {
@@ -18,3 +22,23 @@ export const ListApi = (params: PageParams) =>
       ignoreCancelToken: true,
     },
   });
+
+export const addNoticeApi = (params: NoticeParams) =>
+  defHttp.post<Result>({
+    url: Api.addNotice,
+    params,
+    headers: {
+      // @ts-ignore
+      ignoreCancelToken: true,
+    },
+  });
+
+export const editNoticeApi = (params: NoticeParams) =>
+  defHttp.post<Result>({
+    url: Api.addNotice,
+    params,
+    headers: {
+      // @ts-ignore
+      ignoreCancelToken: true,
+    },
+  });

+ 12 - 5
src/api/notification/model.ts

@@ -6,14 +6,21 @@ export type PageParams = BasicPageParams;
 
 export interface MemberListItem {
   id: number;
-  name: string;
-  image: string;
-  link: string;
+  content: string;
+  type: string;
+  effectiveTime: string[];
   createTime: string;
-  isShow: boolean;
+}
+
+export interface NoticeParams {
+  id?: string;
+  title: string;
+  content: string;
+  type: string;
+  effectiveTime: string[];
 }
 
 /**
  * @description: Request list return value
  */
-export type MemberListGetResultModel = BasicFetchResult<MemberListItem>;
+export type ListGetResultModel = BasicFetchResult<MemberListItem>;

+ 193 - 0
src/views/notification/addModal.vue

@@ -0,0 +1,193 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @cancel="resetFields"
+    @register="register"
+    :title="title"
+    width="60%"
+    min-width="600px"
+    @ok="handleOk"
+  >
+    <div class="pt-3px pr-3px">
+      <BasicForm @register="registerForm" :model="modelRef" />
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  // computed
+  import { defineComponent, ref, h } from 'vue';
+
+  import { addNoticeApi, editNoticeApi } from '/@/api/notification/list';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  // import { ListAllCompanyApi } from '/@/api/corporation/list';
+  // import { useI18n } from '/@/hooks/web/useI18n';
+  // import { useMessage } from '/@/hooks/web/useMessage';
+  // import { useUserStore } from '/@/store/modules/user';
+  import { Tinymce } from '/@/components/Tinymce';
+  // const { t } = useI18n();
+  export default defineComponent({
+    components: { BasicModal, BasicForm },
+    props: {
+      userData: { type: Object },
+    },
+    emits: ['register', 'ok', 'cancel'],
+    setup(_, { emit }) {
+      const modelRef = ref({});
+      // const userStore = useUserStore();
+      // const { getCheckRole } = userStore;
+      // const userinfo = computed(() => userStore.getUserInfo);
+      // const { companyId } = userinfo.value;
+
+      const schemas: FormSchema[] = [
+        {
+          field: 'id',
+          component: 'Input',
+          label: 'id',
+          show: false,
+        },
+
+        {
+          field: 'title',
+          component: 'Input',
+          label: '标题',
+          required: true,
+          colProps: {
+            span: 22,
+          },
+        },
+
+        {
+          field: 'effectiveTime',
+          component: 'RangePicker',
+          label: '时间段',
+          required: true,
+          colProps: {
+            span: 22,
+          },
+        },
+        {
+          field: 'type',
+          component: 'RadioButtonGroup',
+          label: '类型',
+          required: true,
+          colProps: {
+            span: 22,
+          },
+          defaultValue: 0,
+          componentProps: {
+            options: [
+              { label: '文字', value: 0 },
+              { label: '图片', value: 1 },
+            ],
+          },
+        },
+        {
+          field: 'content',
+          label: '内容',
+          component: 'Input',
+          render: ({ model, field }) => {
+            return h(Tinymce, {
+              value: model[field],
+              maxlength: 200,
+              onChange: (value: string) => {
+                model[field] = value;
+              },
+              showImageUpload: false,
+            });
+          },
+        },
+      ];
+      const title = ref('新 增');
+      // const { createMessage } = useMessage();
+      const [registerForm, { validate, resetFields }] = useForm({
+        labelWidth: 120,
+        schemas,
+        showActionButtonGroup: false,
+        actionColOptions: {
+          span: 24,
+        },
+      });
+      // closeModal
+      const [register] = useModalInner((data) => {
+        data && onDataReceive(data);
+      });
+      function onDataReceive(data) {
+        // 方式1;
+        console.log('useModalInner', data);
+        //   setFieldsValue({
+        //     ...data,
+        //     roleId: data.roleId != 2 ? data.roleId : '',
+        //   });
+        //   let setSchema = [
+        //     {
+        //       field: 'roleId',
+        //       component: 'ApiSelect',
+        //       componentProps: {
+        //         disabled: data.roleId == 2 ? false : data.id ? true : false,
+        //         api: getRoleListByParam,
+        //         labelField: 'roleName',
+        //         valueField: 'roleId',
+        //         params: {
+        //           type: data.roleId ? 1 : 0,
+        //           roleId: data.roleId,
+        //         },
+        //       },
+        //     },
+        //     {
+        //       field: 'phone',
+        //       componentProps: {
+        //         disabled: getCheckRole('plat_admin') ? false : data.id ? true : false,
+        //       },
+        //     },
+        //     {
+        //       field: 'companyId',
+        //       componentProps: {
+        //         disabled: data.id ? (data.roleId != 2 ? true : false) : false,
+        //       },
+        //     },
+        //     {
+        //       field: 'permList',
+        //       componentProps: {
+        //         disabled: data.roleId == 2 ? false : data.id ? true : false,
+        //         params: {
+        //           companyId: data.companyId || companyId,
+        //         },
+        //       },
+        //     },
+        //   ];
+        //   title.value = data.id ? '编辑' : '新增';
+        //   updateSchema(setSchema);
+      }
+
+      async function handleOk() {
+        let data = await validate();
+        console.log('data', data);
+
+        const requestApi = data.id ? editNoticeApi : addNoticeApi;
+        let res = await requestApi({
+          title: data.title,
+          content: data.content,
+          type: data.type,
+          effectiveTime: data.effectiveTime,
+          id: data.id,
+        });
+        console.log('res', res);
+        emit('ok', res);
+        // createMessage.success(t('common.optSuccess'));
+        // closeModal();
+        // resetFields();
+      }
+
+      return {
+        register,
+        title,
+        schemas,
+        registerForm,
+        modelRef,
+        handleOk,
+        resetFields,
+      };
+    },
+  });
+</script>

+ 18 - 4
src/views/notification/list.vue

@@ -1,7 +1,9 @@
 <template>
   <div class="p-4">
     <BasicTable @register="registerTable">
-      <template #toolbar> </template>
+      <template #toolbar>
+        <a-button type="primary" @click="handleCreate">新增</a-button>
+      </template>
       <template #avatar="{ record }">
         <Avatar :size="80" :src="record.avatar" />
       </template>
@@ -38,6 +40,7 @@
         />
       </template>
     </BasicTable>
+    <AddModal @register="registerAddModal" @ok="reload" />
   </div>
 </template>
 <script lang="ts">
@@ -45,19 +48,21 @@
   import { BasicTable, useTable, BasicColumn, FormProps, TableAction } from '/@/components/Table';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { uploadApi } from '/@/api/sys/upload';
-
+  import { useModal } from '/@/components/Modal';
   import { ListApi } from '/@/api/notification/list';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useGo } from '/@/hooks/web/usePage';
   import { Avatar } from 'ant-design-vue';
   import { Time } from '/@/components/Time';
+  import AddModal from './addModal.vue';
 
   export default defineComponent({
-    components: { BasicTable, TableAction, Avatar, Time },
+    components: { BasicTable, TableAction, Avatar, Time, AddModal },
     setup() {
       const { createMessage } = useMessage();
       const go = useGo();
       const { t } = useI18n();
+      const [registerAddModal, { openModal: openAddModal }] = useModal();
       const columns: BasicColumn[] = [
         {
           title: 'ID',
@@ -111,7 +116,7 @@
         ],
       };
 
-      const [registerTable] = useTable({
+      const [registerTable, { reload }] = useTable({
         title: '消息列表',
         api: ListApi,
         columns: columns,
@@ -142,6 +147,11 @@
         }
       }
 
+      function handleCreate(): void {
+        // openAddModal();
+        openAddModal(true, {});
+      }
+
       return {
         registerTable,
         createMessage,
@@ -149,6 +159,10 @@
         go,
         renderGenderLabel,
         uploadApi: uploadApi as any,
+        handleCreate,
+        reload,
+        registerAddModal,
+        openAddModal,
       };
     },
   });

+ 5 - 0
src/views/notification/template.vue

@@ -0,0 +1,5 @@
+<template>
+  <div> 设备管理 </div>
+</template>
+
+<script lang="ts" setup></script>

+ 8 - 1
src/views/staff/detailsModal.vue

@@ -282,10 +282,11 @@
           ...data,
           roleId: data.roleId != 2 ? data.roleId : '',
         });
-        let setSchema = [
+        let setSchema: FormSchema[] = [
           {
             field: 'roleId',
             component: 'ApiSelect',
+            label: '角色',
             componentProps: {
               disabled: data.roleId == 2 ? false : data.id ? true : false,
               api: getRoleListByParam,
@@ -299,18 +300,24 @@
           },
           {
             field: 'phone',
+            label: '手机号',
+            component: 'Input',
             componentProps: {
               disabled: getCheckRole('plat_admin') ? false : data.id ? true : false,
             },
           },
           {
             field: 'companyId',
+            label: '公司',
+            component: 'ApiSelect',
             componentProps: {
               disabled: data.id ? (data.roleId != 2 ? true : false) : false,
             },
           },
           {
             field: 'permList',
+            component: 'ApiSelect',
+            label: '权益',
             componentProps: {
               disabled: data.roleId == 2 ? false : data.id ? true : false,
               params: {