Explorar el Código

feat(组件): 修改bug

tangning hace 2 años
padre
commit
555ab4ff14

+ 20 - 1
src/api/operate/index.ts

@@ -49,7 +49,15 @@ enum Api {
   sceneApplyHandle = '/service/manage/sceneApply/handle',
   getInfoMail = '/service/manage/getInfo',
   updateMail = '/service/manage/update',
-  
+  caseClassList='/service/manage/caseClass/list',
+  allList='/service/manage/caseClass/allList',
+  addcaseOrUpdate='/service/manage/caseClass/addOrUpdate',
+  caseClassDel='/service/manage/caseClass/del',
+  caseIconList='/service/manage/caseIcon/list',
+  addCaseIconOrUpdate='/service/manage/caseIcon/addOrUpdate',
+  caseIconDel='/service/manage/caseIcon/del',
+  caseList = '/service/manage/case/list',
+  caseDel='/service/manage/case/del',
 }
 
 /**
@@ -106,6 +114,17 @@ enum Api {
      ignoreCancelToken: true,
    },
  });
+ 
+ export const caseListApi = (params: PageParams) =>
+ defHttp.post<RentListGetResultModel>({
+   url: Api.caseList,
+   params: params,
+   // data: params,
+   headers: {
+     // @ts-ignore
+     ignoreCancelToken: true,
+   },
+ });
  export const ListApi = (params: PageParams) =>
  defHttp.post<RentListGetResultModel>({
    url: Api.pageList,

+ 311 - 0
src/views/operate/caseList.vue

@@ -0,0 +1,311 @@
+ <template>
+  <PageWrapper contentBackground>
+    <template #footer>
+      <a-tabs v-model:activeKey="language" @change="changeTable">
+        <a-tab-pane key="cn" tab="Chinese" />
+        <a-tab-pane key="en" tab="English" />
+      </a-tabs>
+    </template>
+
+    <div class="desc-wrap-BasicTable">
+      <BasicTable @register="registerTable">
+        <template #toolbar>
+          <a-button type="primary" @click="openModal(true, {language})" v-if="getCheckPerm('news-add')">
+            新增案例</a-button
+          >
+        </template>
+        <template #action="{ record }">
+          <TableAction
+            stopButtonPropagation
+            :actions="[
+              {
+                label: '撤回',
+                //icon: 'icon-park-outline:folder-withdrawal-one',
+                ifShow: getCheckPerm('news-withdraw') && record.isPublic == 1,
+                onClick: handleWithdraw.bind(null, record),
+              },
+              {
+                label: '发布',
+                //icon: 'arcticons:efa-publish',
+                ifShow: getCheckPerm('news-publish') && record.isPublic == 0,
+                onClick: handlePublish.bind(null, record),
+              },
+              {
+                label: '编辑',
+                //icon: 'ep:edit',
+                ifShow: getCheckPerm('news-edit') && record.isPublic == 0,
+                onClick: handleEdit.bind(null, record),
+              },
+              {
+                label: '删除',
+                //icon: 'ic:outline-delete-outline',
+                ifShow: getCheckPerm('news-delete'),
+                popConfirm: {
+                  title: '是否确认删除',
+                  confirm: handleDelete.bind(null, record),
+                },
+              },
+            ]"
+          />
+        </template>
+      </BasicTable>
+    </div>
+    <addNewModal @register="register" @update="reload" />
+  </PageWrapper>
+</template>
+<script lang="ts">
+import { defineComponent, h, ref } from 'vue';
+import {
+  BasicTable,
+  useTable,
+  TableAction,
+  BasicColumn,
+  TableImg,
+  FormProps,
+} from '/@/components/Table';
+import { PageWrapper } from '/@/components/Page';
+import { Time } from '/@/components/Time';
+import { ListApi, NewDisplay, NewPutTop, NewPublicNews, newDelete } from '/@/api/operate';
+import {  Descriptions, Switch, Tabs } from 'ant-design-vue';
+import { useModal } from '/@/components/Modal';
+import { useI18n } from '/@/hooks/web/useI18n';
+import { useMessage } from '/@/hooks/web/useMessage';
+import addNewModal from './components/case/addModal.vue';
+import { usePermissionStore } from '/@/store/modules/permission';
+export default defineComponent({
+  components: {
+    BasicTable,
+    TableAction,
+    PageWrapper,
+    TableImg,
+    addNewModal,
+    [Descriptions.name]: Descriptions,
+    [Descriptions.Item.name]: Descriptions.Item,
+    [Tabs.name]: Tabs,
+    [Tabs.TabPane.name]: Tabs.TabPane,
+  },
+  setup() {
+    const { t } = useI18n();
+    const { createMessage } = useMessage();
+    const permissionStore = usePermissionStore();
+    const { getCheckPerm } = permissionStore;
+    const [register, { openModal }] = useModal();
+    const language = ref<string>('cn'); //未处理,0已处理(默认1)
+    const columns: BasicColumn[] = [
+      {
+        title: '案例标题',
+        dataIndex: 'title',
+        ellipsis: true,
+        width: 250,
+      },
+      // {
+      //   title: '来源',
+      //   dataIndex: 'source',
+      //   ellipsis: true,
+      //   width: 120,
+      // },
+      {
+        title: '类型',
+        dataIndex: 'newType',
+        ellipsis: true,
+        width: 80,
+        customRender: ({ record }) => {
+          return record.newType == 1 ? '链接' : '图文';
+        },
+      },
+      {
+        title: '创建人',
+        ellipsis: true,
+        dataIndex: 'creater',
+        width: 80,
+      },
+      {
+        title: '创建时间',
+        dataIndex: 'createTime',
+        width: 150,
+        customRender: ({ record }) => {
+          return (
+            record.createTime &&
+            h(Time, {
+              value: record.createTime,
+              mode: 'datetime',
+            })
+          );
+        },
+      },
+      {
+        title: '发布时间',
+        dataIndex: 'publicTime',
+        width: 150,
+        customRender: ({ record }) => {
+          return (
+            record.publicTime &&
+            h(Time, {
+              value: record.publicTime,
+              mode: 'datetime',
+            })
+          );
+        },
+      },
+      {
+        title: '排序',
+        ellipsis: true,
+        dataIndex: 'sort',
+        width: 80,
+      },
+      {
+        title: '是否显示',
+        dataIndex: 'display',
+        width: 80,
+        customRender: ({ record }) => {
+          if (!Reflect.has(record, 'pendingStatus')) {
+            record.pendingStatus = false;
+          }
+          return h(Switch, {
+            checked: record.display === 1,
+            checkedChildren: '是',
+            unCheckedChildren: '否',
+            loading: false,
+            onChange: async (checked: boolean) => {
+              record.pendingStatus = true;
+              const id: string = record.id || '';
+              const newStatus = checked ? 1 : 0;
+              Reflect.set(record, 'display', newStatus);
+              await NewDisplay({ id: id, display: newStatus });
+              createMessage.success(t('common.optSuccess'));
+              // reload()
+            },
+          });
+        },
+      },
+      {
+        title: '置顶',
+        dataIndex: 'isTop',
+        width: 80,
+        customRender: ({ record }) => {
+          if (!Reflect.has(record, 'pendingStatus')) {
+            record.pendingStatus = false;
+          }
+          return h(Switch, {
+            checked: record.isTop === 1,
+            checkedChildren: '是',
+            unCheckedChildren: '否',
+            loading: false,
+            onChange: async (checked: boolean) => {
+              record.pendingStatus = true;
+              const id: string = record.id || '';
+              const newStatus = checked ? 1 : 0;
+              // Reflect.set(record, 'isOnSale', newStatus);
+              await NewPutTop({ id, isTop: newStatus });
+              createMessage.success(t('common.optSuccess'));
+              reload();
+            },
+          });
+        },
+      },
+    ];
+    const searchForm: Partial<FormProps> = {
+      labelWidth: 100,
+      autoSubmitOnEnter: true,
+      schemas: [
+        {
+          field: 'ctivated',
+          label: t('routes.operate.releaseTime'),
+          component: 'RangePicker',
+          componentProps: {
+            maxLength: 100,
+            format: 'YYYY-MM-DD',
+            valueFormat: 'YYYY-MM-DD',
+            showTime: true,
+          },
+          colProps: {
+            xl: 11,
+            xxl: 11,
+          },
+        },
+        {
+          field: 'title',
+          label: t('routes.operate.newsTitle'),
+          component: 'Input',
+          colProps: {
+            xl: 6,
+            xxl: 6,
+          },
+        },
+      ],
+    };
+    const [registerTable, { reload }] = useTable({
+      api: ListApi,
+      title: '案例列表',
+      columns: columns,
+      useSearchForm: true,
+      formConfig: searchForm,
+      showTableSetting: true,
+      showIndexColumn: false,
+      searchInfo: { language },
+      rowKey: 'id',
+      fetchSetting: {
+        pageField: 'pageNum',
+        sizeField: 'pageSize',
+        listField: 'list',
+        totalField: 'total',
+      },
+      beforeFetch: (T) => {
+        if (T.ctivated) {
+          T.publicTimeStart = T.ctivated[0];
+          T.publicTimeEnd = T.ctivated[1];
+        }
+        return T;
+      },
+      actionColumn: {
+        width: 220,
+        title: '操作',
+        dataIndex: 'action',
+        slots: { customRender: 'action' },
+      },
+      canResize: true,
+    });
+    async function handleDelete(record: Recordable) {
+      await newDelete({ id: record.id });
+      createMessage.success(t('common.optSuccess'));
+      reload();
+    }
+    async function handlePublish(record: Recordable) {
+      console.log('点击了发布', record);
+      await NewPublicNews({ id: record.id, isPublic: 1 });
+      createMessage.success(t('common.optSuccess'));
+      reload();
+    }
+    function handleEdit(record: Recordable) {
+      console.log('点击了编辑', record);
+      openModal(true, {...record,language});
+    }
+    async function handleWithdraw(record: Recordable) {
+      await NewPublicNews({ id: record.id, isPublic: 0 });
+      createMessage.success(t('common.optSuccess'));
+      reload();
+    }
+    function changeTable(val: string) {
+        language.value = val;
+        reload();
+      }
+    function hendleAddNew() {
+      console.log('新增新闻');
+    }
+    return {
+      registerTable,
+      handleDelete,
+      handleEdit,
+      handleWithdraw,
+      handlePublish,
+      hendleAddNew,
+      changeTable,
+      reload,
+      language,
+      register,
+      openModal,
+      getCheckPerm,
+    };
+  },
+});
+</script>

+ 273 - 0
src/views/operate/components/case/addModal.vue

@@ -0,0 +1,273 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @register="register"
+    :title="title"
+    :width="1000"
+    @visible-change="handleVisibleChange"
+    @cancel="resetFields"
+    @ok="handleSubmit"
+  >
+    <div class="pt-2px pr-3px">
+      <BasicForm @register="registerForm" :model="model" >
+        <template #text="{ model, field }">
+          {{ model[field]  }}
+        </template>
+      </BasicForm>
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  import { defineComponent, ref, nextTick, onMounted, reactive, h } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { uploadApi } from '/@/api/product/index';
+  import { newAddNews, NewsDetail, newUpdateNews } from '/@/api/operate'
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { Tinymce } from '/@/components/Tinymce/index';
+
+  const { t } = useI18n();
+  export default defineComponent({
+    components: { BasicModal, BasicForm },
+    props: {
+      userData: { type: Object },
+    },
+    emits: ['update', 'register'],
+    setup(props, { emit }) {
+      const modelRef = ref({});
+      const title = ref('新增案例');
+      const fileFlow = reactive({
+        coverImageUrl:''
+      })
+      const { createMessage } = useMessage();
+      const schemas: FormSchema[] = [
+        {
+          field: 'id',
+          component: 'Input',
+          show:false,
+          label: 'id',
+          required: false,
+        },{
+          field: 'language',
+          component: 'Input',
+          show:false,
+          label: 'language',
+          defaultValue:'cn',
+          required: false,
+        },{
+            field: 'title',
+            component: 'Input',
+            required: true,
+            label: '标题',
+            componentProps: {
+              maxlength: 50,
+            },
+            colProps: {
+              span: 22,
+            },
+        },{
+            field: 'noteContent',
+            component: 'InputTextArea',
+            // required: true,
+            label: '摘要',
+            componentProps: {
+              maxLength: 500,
+              rows:4,
+              placeholder: '请输入职位要求',
+            },
+            colProps: {
+              span: 22,
+            },
+        },{
+            field: 'source',
+            component: 'Input',
+            label: '案例来源',
+            required: true,
+            componentProps: {
+              maxlength: 15,
+            },
+            colProps: {
+              span: 22,
+            },
+        },
+        {
+          field: 'coverImageUrl',
+          component: 'Upload',
+          label: '封面',
+          required: true,
+          rules: [{ required: true, message: t('common.uploadMessge') }],
+          // helpMessage: t('routes.corporation.uploadHelp'),
+          itemProps: {
+            validateTrigger: 'onBlur',
+          },
+          componentProps: {
+            api: uploadApi,
+            maxNumber: 1,
+            maxSize: 1,
+            accept: ['jpg','jpeg','png'],
+            afterFetch: function (data) {
+              console.log('uploadApi',data)
+              fileFlow.coverImageUrl = data.url
+              return data;
+            },
+          },
+
+          colProps: {
+            span: 22,
+          },
+        },
+        {
+          field: 'LOGO',
+          component: 'Upload',
+          label: 'LOGO',
+          required: true,
+          rules: [{ required: true, message: t('common.uploadMessge') }],
+          // helpMessage: t('routes.corporation.uploadHelp'),
+          itemProps: {
+            validateTrigger: 'onBlur',
+          },
+          componentProps: {
+            api: uploadApi,
+            maxNumber: 1,
+            maxSize: 1,
+            accept: ['jpg','jpeg','png'],
+            afterFetch: function (data) {
+              console.log('uploadApi',data)
+              fileFlow.coverImageUrl = data.url
+              return data;
+            },
+          },
+
+          colProps: {
+            span: 22,
+          },
+        },
+        {
+          field: 'newType',
+          label: '类型',
+          component: 'RadioButtonGroup',
+          required: true,
+          defaultValue: 2,
+          componentProps: {
+            onChange: NewTypeChange,
+            options: [
+              { label: '链接', value: 1 },
+              { label: '图文', value: 2 },
+            ],
+          },
+        },{
+            field: 'newsUrl',
+            component: 'Input',
+            label: '图标',
+            // ifShow:false,
+            required: true,
+            colProps: {
+              span: 22,
+            },
+            componentProps: {
+              maxlength: 200,
+            },
+        },
+        {
+          field: 'content',
+          label: '正文',
+          component: 'Input',
+          required: true,
+          colProps: {
+            span: 22,
+          },
+          render: ({ model, field }) => {
+            return h(Tinymce, {
+              value: model[field],
+              maxlength: 10000,
+              onChange: (value: string) => {
+                model[field] = value;
+              },
+              showImageUpload: true,
+            });
+          },
+        },
+      ];
+      const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
+        labelWidth: 120,
+        schemas,
+        showActionButtonGroup: false,
+        actionColOptions: {
+          span: 24,
+        },
+      });
+      onMounted(() => {});
+      let addListFunc = () => {};
+      const [register, { closeModal }] = useModalInner((data) => {
+        data && onDataReceive(data);
+      });
+      async function onDataReceive(data) {
+        modelRef.value = data
+        resetFields();
+        if(data.newType){
+          NewTypeChange(data.newType)
+        }
+        if(data.id){
+          title.value = '编辑案例'
+          const detail = await NewsDetail({id:data.id})
+          setFieldsValue({
+            ...detail,
+            newsUrl:detail.newType == 1?detail.content:'',
+            content:detail.newType != 1?detail.content:'',
+            coverImageUrl:detail.coverImageUrl?[detail.coverImageUrl]:''
+          });
+        }else{
+          title.value = '新增案例'
+          setFieldsValue({
+            content:'',
+            ...data,
+          });
+        }
+      }
+      function NewTypeChange(val){
+        console.log('NewTypeChange',val)
+        updateSchema([
+          { field: 'content', ifShow:val == 2,},
+          { field: 'newsUrl', ifShow:val != 2,},
+        ])
+      } 
+      const handleSubmit = async () => {
+        const params = await validate();
+        let apiUrl = title.value == '新增案例'?newAddNews:newUpdateNews
+        console.log('validate',params)
+        const apiData = {
+          ...params as any,
+          coverImageUrl:params.coverImageUrl && params.coverImageUrl[0],
+          content:params.newType == 1?params.newsUrl:params.content
+        }
+        try {
+          await apiUrl(apiData);
+          closeModal();
+          resetFields();
+          createMessage.success(t('common.optSuccess'));
+          emit('update');
+        } catch (error) {
+          console.log('not passing', error);
+        }
+      };
+      function handleVisibleChange(v) {
+        v && props.userData && nextTick(() => onDataReceive(props.userData));
+      }
+      return {
+        register,
+        schemas,
+        registerForm,
+        model: modelRef,
+        fileFlow,
+        NewTypeChange,
+        handleVisibleChange,
+        handleSubmit,
+        addListFunc,
+        resetFields,
+        title,
+        t,
+      };
+    },
+  });
+</script>

+ 1 - 1
src/views/operate/newsList.vue

@@ -2,7 +2,7 @@
   <PageWrapper contentBackground>
     <template #footer>
       <a-tabs v-model:activeKey="language" @change="changeTable">
-        <a-tab-pane key="cn" tab="中文" />
+        <a-tab-pane key="cn" tab="Chinese" />
         <a-tab-pane key="en" tab="English" />
       </a-tabs>
     </template>

+ 2 - 2
src/views/product/sdk/index.vue

@@ -166,8 +166,8 @@ export default defineComponent({
           }
           return h(Switch, {
             checked: record.isTop == 1 ? true : false,
-            checkedChildren: '启用',
-            unCheckedChildren: '禁用',
+            checkedChildren: '',
+            unCheckedChildren: '',
             disabled:record.status != 1,
             loading: false,
             onChange: async (checked: boolean) => {