add 系统设置下基础设置

src/components/CommonPage/CommonTable.vue

@@ -68,6 +68,7 @@
 
   /** 搜索 */
   const reload = (where) => {
+    console.log('where', where);
     tableRef.value?.reload?.({ where });
   };
 

src/components/CommonPage/ProDatePicker.vue

@@ -36,6 +36,7 @@
       selectDate.value = value[props.startKey]
         ? [value[props.startKey], value[props.endKey]]
         : [];
+      console.log(value, selectDate.value, 'valuexxxxxxxxxxx');
     },
     { deep: true }
   );
@@ -49,8 +50,6 @@
       temp[props.startKey] = '';
       temp[props.endKey] = '';
     }
-    console.log(value);
-    console.log(temp,'xxxx');
     emit('update:modelValue', temp);
   };
 

src/components/CommonPage/SimpleForm.vue

@@ -8,9 +8,19 @@
     :items="items"
     :grid="{ span: grid }"
     @updateValue="setFieldValue"
+    @submit="submitForm"
+    @reset="resetForm"
   >
-    <template v-for="(val, key) in slotArray" v-slot:[key]="{ item, model, updateValue }">
-      <slot :name="key" :item="item" :model="model" :updateValue="updateValue"></slot>
+    <template
+      v-for="(val, key) in slotArray"
+      v-slot:[key]="{ item, model, updateValue }"
+    >
+      <slot
+        :name="key"
+        :item="item"
+        :model="model"
+        :updateValue="updateValue"
+      ></slot>
     </template>
   </pro-form>
 </template>
@@ -20,8 +30,8 @@
   import { useFormData } from '@/utils/use-form-data';
   import ProForm from '@/components/ProForm/index.vue';
   const slotArray = useSlots();
-  console.log(slotArray,'daa');
 
+  const emit = defineEmits(['submit', 'reset']);
   const proFormRef = ref(null);
   const props = defineProps({
     items: {
@@ -44,11 +54,12 @@
 
   const [form, resetFields, assignFields, setFieldValue] = useFormData();
   /** 提交表单 */
-  const submitForm = () => {
+  const submitForm = (model) => {
     return new Promise((resolve, reject) => {
       proFormRef.value?.validate?.((valid) => {
         if (valid) {
           resolve(form);
+          emit('submit', model);
         } else {
           reject('表单验证失败');
         }

src/components/ImageUpload/index.vue

@@ -24,6 +24,7 @@
     <template v-for="name in Object.keys($slots)" #[name]="slotProps">
       <slot :name="name" v-bind="slotProps || {}"></slot>
     </template>
+    <el-text type="info" v-if="tips">{{ tips }}</el-text>
   </CommonUpload>
 </template>
 
@@ -93,7 +94,8 @@
     /** 修改按钮点击前的钩子 */
     beforeItemEdit: Function,
     /** 国际化 */
-    locale: Object
+    locale: Object,
+    tips: { type: String, default: '' }
   });
 
   const emit = defineEmits(['update:modelValue', 'change']);

src/views/data/books/components/book-export-log.vue

@@ -54,16 +54,16 @@
   import ProDatePicker from '@/components/CommonPage/ProDatePicker.vue';
   import { download, toFormData, checkDownloadRes } from '@/utils/common';
 
-  const searchData = reactive({ createTimeStart: '', createTimeEnd: '' });
+  const searchData = ref({ createTimeStart: '', createTimeEnd: '' });
 
   const pageRef = ref(null);
   function reload() {
-    console.log('reload', searchData);
-    pageRef.value?.reload(searchData);
+    console.log('reload', searchData.value);
+    pageRef.value?.reload(searchData.value);
   }
   function handleReset() {
-    searchData.createTimeStart = '';
-    searchData.createTimeEnd = '';
+    searchData.value.createTimeStart = '';
+    searchData.value.createTimeEnd = '';
     reload();
   }
 

src/views/system/payment/components/alipay-config.vue

@@ -0,0 +1,30 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="140px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    { type: 'input', label: '支付宝应用appid', prop: 'appid', required: true },
+    { type: 'textarea', label: '支付公钥', prop: 'key', required: true },
+    {
+      type: 'textarea',
+      label: '支付密钥',
+      prop: 'minimchid',
+      required: true
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/payment/components/wechat-config.vue

@@ -0,0 +1,60 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="140px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    { type: 'input', label: 'mchid', prop: 'mchid', required: true },
+    {
+      type: 'radio',
+      label: '支付接口类型',
+      prop: 'type',
+      required: true,
+      options: [
+        {
+          label: 'v2',
+          value: 1
+        },
+        {
+          label: 'v3',
+          value: 2
+        }
+      ]
+    },
+    { type: 'input', label: 'key', prop: 'key', required: true },
+    {
+      type: 'imageUpload',
+      label: '微信支付证书',
+      prop: 'logoImage',
+      required: true,
+      props: { limit: 1, tips: '支持.jpg .png 格式，建议上传50*50尺寸' }
+    },
+    {
+      type: 'imageUpload',
+      label: '微信支付证书密钥',
+      prop: 'backgroundImage',
+      required: true,
+      props: { limit: 1, tips: '支持.jpg .png 格式，建议上传50*50尺寸' }
+    },
+    {
+      type: 'input',
+      label: '小程序mchid',
+      prop: 'minimchid',
+      required: true,
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/payment/index.vue

@@ -0,0 +1,48 @@
+<template>
+  <ele-page flex-table>
+    <ele-card flex-table class="policy-card">
+      <div class="flex-col h-full">
+        <el-tabs
+          v-model="activeName"
+          @tab-change="handleTabChange"
+          class="mb-2"
+        >
+          <el-tab-pane
+            v-for="item in tabList"
+            :label="item.label"
+            :name="item.name"
+          ></el-tab-pane>
+        </el-tabs>
+
+        <component :is="currentComponent" style="max-width:1000px" />
+      </div>
+    </ele-card>
+  </ele-page>
+</template>
+
+<script setup>
+  import alipayConfig from '@/views/system/payment/components/alipay-config.vue';
+  import wechatConfig from '@/views/system/payment/components/wechat-config.vue';
+  import { reactive, ref, shallowRef } from 'vue';
+
+  const activeName = ref('wechatConfig');
+  const currentComponent = shallowRef(wechatConfig);
+
+  function handleTabChange(name) {
+    let tab = tabList.find((item) => item.name === name);
+    currentComponent.value = tab ? tab.component : shallowRef(wechatConfig);
+  }
+
+  const tabList = reactive([
+    {
+      label: '微信支付',
+      name: 'wechatConfig',
+      component: shallowRef(wechatConfig)
+    },
+    {
+      label: '支付宝支付',
+      name: 'alipayConfig',
+      component: shallowRef(alipayConfig)
+    }
+  ]);
+</script>

src/views/system/policy/components/about-us.vue

@@ -0,0 +1,27 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="0"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'editor',
+      label: '',
+      prop: 'aboutUs'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/policy/components/privacy-agreement.vue

@@ -0,0 +1,27 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="0"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'editor',
+      label: '',
+      prop: 'privacyAgreement',
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/policy/components/user-agreement.vue

@@ -0,0 +1,27 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="0"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'editor',
+      label: '',
+      prop: 'userAgreement'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/policy/index.vue

@@ -0,0 +1,54 @@
+<template>
+  <ele-page flex-table>
+    <ele-card flex-table class="policy-card">
+      <div class="flex-col h-full">
+        <el-tabs
+          v-model="activeName"
+          @tab-change="handleTabChange"
+          class="mb-2"
+        >
+          <el-tab-pane
+            v-for="item in tabList"
+            :label="item.label"
+            :name="item.name"
+          ></el-tab-pane>
+        </el-tabs>
+
+        <component :is="currentComponent" />
+      </div>
+    </ele-card>
+  </ele-page>
+</template>
+
+<script setup>
+  import userAgreement from '@/views/system/policy/components/user-agreement.vue';
+  import privacyAgreement from '@/views/system/policy/components/privacy-agreement.vue';
+  import aboutUs from '@/views/system/policy/components/about-us.vue';
+  import { reactive, ref, shallowRef } from 'vue';
+
+  const activeName = ref('userAgreement');
+  const currentComponent = shallowRef(userAgreement);
+
+  function handleTabChange(name) {
+    let tab = tabList.find((item) => item.name === name);
+    currentComponent.value = tab ? tab.component : shallowRef(userAgreement);
+  }
+
+  const tabList = reactive([
+    {
+      label: '用户协议',
+      name: 'userAgreement',
+      component: shallowRef(userAgreement)
+    },
+    {
+      label: '隐私协议',
+      name: 'privacyAgreement',
+      component: shallowRef(privacyAgreement)
+    },
+    {
+      label: '关于我们',
+      name: 'aboutUs',
+      component: shallowRef(aboutUs)
+    }
+  ]);
+</script>

src/views/system/setting/components/alipay-applet.vue

@@ -0,0 +1,37 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: '小程序AppId',
+      prop: 'appId'
+    },
+    {
+      type: 'input',
+      label: '小程序密钥',
+      prop: 'appkey'
+    },
+    {
+      type: 'input',
+      label: '小程序版本号',
+      prop: 'version'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/base-config.vue

@@ -0,0 +1,44 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'imageUpload',
+      label: '后台LOGO',
+      prop: 'logoImage',
+      required: true,
+      props: { limit: 1, tips: '支持.jpg .png 格式，建议上传50*50尺寸' }
+    },
+    {
+      type: 'imageUpload',
+      label: '登录背景',
+      prop: 'backgroundImage',
+      required: true,
+      props: { limit: 1, tips: '支持.jpg .png 格式，建议上传50*50尺寸' }
+    },
+    {
+      type: 'imageUpload',
+      label: '浏览器图标',
+      prop: 'browserIcon',
+      required: true,
+      props: { limit: 1, tips: '支持.jpg .png 格式，建议上传50*50尺寸' }
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data)
+  }
+
+</script>

src/views/system/setting/components/isbn-collection.vue

@@ -0,0 +1,39 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="false"
+  ></simple-form>
+</template>
+
+<script setup name="isbnCollection">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: '使用者',
+      prop: 'logoImage',
+      required: true
+    },
+    {
+      type: 'input',
+      label: 'Appkey',
+      prop: 'appkey',
+      required: true,
+    },
+    {
+      type: 'input',
+      label: 'Secret',
+      prop: 'secret',
+      required: true
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/logistics-query.vue

@@ -0,0 +1,37 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'dictRadio',
+      label: '物流公司',
+      prop: 'logoImage',
+    },
+    {
+      type: 'input',
+      label: '公司编码',
+      prop: 'backgroundImage',
+    },
+    {
+      type: 'input',
+      label: '授权KEY',
+      prop: 'browserIcon',
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/mall-config.vue

@@ -0,0 +1,42 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: '店铺昵称',
+      prop: 'accesskeyid'
+    },
+    {
+      type: 'input',
+      label: 'appkey',
+      prop: 'appkey'
+    },
+    {
+      type: 'input',
+      label: 'appsecret',
+      prop: 'appsecret'
+    },
+    {
+      type: 'input',
+      label: '默认仓库编号',
+      prop: 'bucket'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/map-config.vue

@@ -0,0 +1,27 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: '高德地图',
+      prop: 'logoImage'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/sms-config.vue

@@ -0,0 +1,37 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: '短信有效期',
+      prop: 'logoImage'
+    },
+    {
+      type: 'input',
+      label: '短信参数',
+      prop: 'params'
+    },
+    {
+      type: 'input',
+      label: '短信签名',
+      prop: 'sign'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/storage-config.vue

@@ -0,0 +1,42 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: 'accesskeyid',
+      prop: 'accesskeyid'
+    },
+    {
+      type: 'input',
+      label: 'secret',
+      prop: 'secret'
+    },
+    {
+      type: 'input',
+      label: 'endpoint',
+      prop: 'endpoint'
+    },
+    {
+      type: 'input',
+      label: '域名bucket',
+      prop: 'bucket'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/wechat-applet.vue

@@ -0,0 +1,37 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="120px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: '小程序AppId',
+      prop: 'appId'
+    },
+    {
+      type: 'input',
+      label: '小程序密钥',
+      prop: 'appkey'
+    },
+    {
+      type: 'input',
+      label: '小程序版本号',
+      prop: 'version'
+    },
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/components/withdrawal-limit.vue

@@ -0,0 +1,37 @@
+<template>
+  <simple-form
+    :items="formItems"
+    ref="formRef"
+    label-width="160px"
+    :footer="true"
+    @submit="handleSubmit"
+  ></simple-form>
+</template>
+
+<script setup name="baseConfig">
+  import { ref, shallowRef } from 'vue';
+  import SimpleForm from '@/components/CommonPage/SimpleForm.vue';
+
+  const formRef = ref(null);
+  const formItems = shallowRef([
+    {
+      type: 'input',
+      label: '每人每日最高提现金额',
+      prop: 'appId'
+    },
+    {
+      type: 'input',
+      label: '微信提现说明',
+      prop: 'appkey'
+    },
+    {
+      type: 'input',
+      label: '支付宝提现说明',
+      prop: 'version'
+    }
+  ]);
+
+  function handleSubmit(data) {
+    console.log(data);
+  }
+</script>

src/views/system/setting/index.vue

@@ -0,0 +1,54 @@
+<template>
+  <ele-page flex-table>
+    <ele-card flex-table>
+      <el-tabs v-model="activeName" @tab-change="handleTabChange" class="mb-6">
+        <el-tab-pane
+          v-for="item in tabList"
+          :label="item.label"
+          :name="item.name"
+        ></el-tab-pane>
+      </el-tabs>
+
+      <component :is="currentComponent" style="max-width:600px" />
+    </ele-card>
+  </ele-page>
+</template>
+
+<script setup>
+  import baseConfig from '@/views/system/setting/components/base-config.vue';
+  import isbnCollection from '@/views/system/setting/components/isbn-collection.vue';
+  import logisticsQuery from '@/views/system/setting/components/logistics-query.vue';
+  import mapConfig from '@/views/system/setting/components/map-config.vue';
+  import smsConfig from '@/views/system/setting/components/sms-config.vue';
+  import storageConfig from '@/views/system/setting/components/storage-config.vue';
+  import mallConfig from '@/views/system/setting/components/mall-config.vue';
+  import wechatApplet from '@/views/system/setting/components/wechat-applet.vue';
+  import alipayApplet from '@/views/system/setting/components/alipay-applet.vue';
+  import withdrawalLimit from '@/views/system/setting/components/withdrawal-limit.vue';
+  import { reactive, ref, shallowRef } from 'vue';
+
+  const activeName = ref('baseConfig');
+  const currentComponent = shallowRef(baseConfig);
+
+  function handleTabChange(name) {
+    let tab = tabList.find((item) => item.name === name);
+    currentComponent.value = tab ? tab.component : shallowRef(baseConfig);
+  }
+
+  const tabList = reactive([
+    { label: '基础配置', name: 'baseConfig', component: shallowRef(baseConfig) },
+    {
+      label: 'ISBN采集配置',
+      name: 'isbnCollection',
+      component: shallowRef(isbnCollection)
+    },
+    { label: '物流查询', name: 'logisticsQuery', component: shallowRef(logisticsQuery) },
+    { label: '地图配置', name: 'mapConfig', component: shallowRef(mapConfig) },
+    { label: '短信配置', name: 'smsConfig', component: shallowRef(smsConfig) },
+    { label: '阿里云OSS存储配置', name: 'storageConfig', component: shallowRef(storageConfig) },
+    { label: '商城配置', name: 'mallConfig', component: shallowRef(mallConfig) },
+    { label: '微信小程序配置', name: 'wechatApplet', component: shallowRef(wechatApplet) },
+    { label: '支付小程序配置', name: 'alipayApplet', component: shallowRef(alipayApplet) },
+    { label: '提现限制', name: 'withdrawalLimit', component: shallowRef(withdrawalLimit) }
+  ]);
+</script>