fix Bug Features CHANGELOG.ms

2026-03-01 00:23:11 +08:00 · 2021-07-19 16:42:11 +08:00
parent 46dc7eb69e
commit b689fabfdd
148 changed files with 5829 additions and 4268 deletions
--- a/src/views/form/basicForm/index.vue
+++ b/src/views/form/basicForm/index.vue
@@ -9,12 +9,12 @@
      <n-grid cols="2 s:1 m:3 l:3 xl:3 2xl:3" responsive="screen">
        <n-grid-item offset="0 s:0 m:1 l:1 xl:1 2xl:1">
          <n-form
-            :label-width="80"
-            :model="formValue"
-            :rules="rules"
-            label-placement="left"
-            ref="formRef"
-            class="py-8"
+              :label-width="80"
+              :model="formValue"
+              :rules="rules"
+              label-placement="left"
+              ref="formRef"
+              class="py-8"
          >
            <n-form-item label="预约姓名" path="name">
              <n-input v-model:value="formValue.name" placeholder="输入姓名"/>
@@ -27,17 +27,17 @@
            </n-form-item>
            <n-form-item label="预约医生" path="doctor">
              <n-select
-                placeholder="请选择预约医生"
-                :options="doctorList"
-                v-model:value="formValue.doctor"
+                  placeholder="请选择预约医生"
+                  :options="doctorList"
+                  v-model:value="formValue.doctor"
              />
            </n-form-item>
            <n-form-item label="预约事项" path="matter">
              <n-select
-                placeholder="请选择预约事项"
-                :options="matterList"
-                v-model:value="formValue.matter"
-                multiple
+                  placeholder="请选择预约事项"
+                  :options="matterList"
+                  v-model:value="formValue.matter"
+                  multiple
              />
            </n-form-item>
            <n-form-item label="性别" path="sex">
@@ -50,11 +50,23 @@
            </n-form-item>
            <n-form-item label="预约备注" path="remark">
              <n-input
-                v-model:value="formValue.remark"
-                type="textarea"
-                placeholder="请输入预约备注"
+                  v-model:value="formValue.remark"
+                  type="textarea"
+                  placeholder="请输入预约备注"
              />
            </n-form-item>
+            <n-form-item label="图片" path="img">
+              <BasicUpload
+                  :action="`${uploadUrl}/v1.0/files`"
+                  :headers="uploadHeaders"
+                  :data="{ type: 0 }"
+                  name="files"
+                  :width="100"
+                  :height="100"
+                  @uploadChange="uploadChange"
+                  v-model:value="uploadList"
+                  helpText="单个文件不超过20MB，最多只能上传10个文件"/>
+            </n-form-item>
            <div style="margin-left:80px">
              <n-space>
                <n-button type="primary" @click="formSubmit">提交预约</n-button>
@@ -69,8 +81,12 @@
 </template>

 <script lang="ts">
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref, reactive, toRefs, } from 'vue'
 import { useMessage } from 'naive-ui'
+import { BasicUpload } from '@/components/Upload'
+import { useGlobSetting } from '@/hooks/setting'
+
+const globSetting = useGlobSetting()

 const matterList = [
  {
@@ -102,14 +118,45 @@ const doctorList = [
  }
 ]

-export default defineComponent({
-  setup() {
-    const formRef = ref(null)
-    const message = useMessage()
+const rules = {
+  name: {
+    required: true,
+    message: '请输入预约姓名',
+    trigger: 'blur'
+  },
+  remark: {
+    required: true,
+    message: '请输入预约备注',
+    trigger: 'blur'
+  },
+  mobile: {
+    required: true,
+    message: '请输入预约电话号码',
+    trigger: ['input']
+  },
+  datetime: {
+    required: true,
+    type: 'number',
+    message: '请选择预约时间',
+    trigger: ['blur', 'change'],
+  },
+  doctor: {
+    required: true,
+    type: 'number',
+    message: '请选择预约医生',
+    trigger: 'change'
+  },
+}

-    return {
-      formRef,
-      formValue: ref({
+export default defineComponent({
+  components: { BasicUpload },
+  setup() {
+    const formRef: any = ref(null)
+    const message = useMessage()
+    const { uploadUrl } = globSetting
+
+    const state = reactive({
+      formValue: {
        name: '',
        mobile: '',
        remark: '',
@@ -117,50 +164,46 @@ export default defineComponent({
        matter: null,
        doctor: null,
        datetime: [],
-      }),
-      rules: {
-        name: {
-          required: true,
-          message: '请输入预约姓名',
-          trigger: 'blur'
-        },
-        remark: {
-          required: true,
-          message: '请输入预约备注',
-          trigger: 'blur'
-        },
-        mobile: {
-          required: true,
-          message: '请输入预约电话号码',
-          trigger: ['input']
-        },
-        datetime: {
-          required: true,
-          type: 'number',
-          message: '请选择预约时间',
-          trigger: ['blur', 'change'],
-        },
-        doctor: {
-          required: true,
-          type: 'number',
-          message: '请选择预约医生',
-          trigger: 'change'
-        },
      },
+      //图片列表 通常查看和编辑使用 绝对路径 | 相对路径都可以
+      uploadList: [
+        'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
+      ],
+      uploadHeaders: {
+        platform: "miniPrograms",
+        timestamp: new Date().getTime(),
+        token: 'Q6fFCuhc1vkKn5JNFWaCLf6gRAc5n0LQHd08dSnG4qo=',
+      }
+    })
+
+    function formSubmit() {
+      formRef.value.validate((errors) => {
+        if (!errors) {
+          message.success('验证成功')
+        } else {
+          message.error('验证失败，请填写完整信息')
+        }
+      })
+    }
+
+    function resetForm() {
+      formRef.value.restoreValidation()
+    }
+
+    function uploadChange(list: string[]) {
+      console.log(list)
+    }
+
+    return {
+      ...toRefs(state),
+      formRef,
+      uploadUrl,
+      rules,
      doctorList,
      matterList,
-      formSubmit(e) {
-        formRef.value.validate((errors) => {
-          if (!errors) {
-            message.success('验证成功')
-          } else {
-            message.error('验证失败，请填写完整信息')
-          }
-        })
-      },
-      resetForm() {
-        formRef.value.restoreValidation()
-      }
+      formSubmit,
+      resetForm,
+      uploadChange
    }
  }
 })
--- a/src/views/form/detail/index.vue
+++ b/src/views/form/detail/index.vue
@@ -7,22 +7,32 @@
    </div>
    <n-card :bordered="false" title="基本信息" class="proCard mt-4" size="small" :segmented="{content: 'hard'}">
      <n-descriptions label-placement="left" class="py-2">
-        <n-descriptions-item><template #label>收款人姓名</template>啊俊</n-descriptions-item>
+        <n-descriptions-item>
+          <template #label>收款人姓名</template>
+          啊俊
+        </n-descriptions-item>
        <n-descriptions-item label="收款账户">NaiveUiAdmin@qq.com</n-descriptions-item>
        <n-descriptions-item label="付款类型">支付宝</n-descriptions-item>
        <n-descriptions-item label="付款账户">NaiveUiAdmin@163.com</n-descriptions-item>
        <n-descriptions-item label="转账金额">￥1980.00</n-descriptions-item>
-        <n-descriptions-item label="状态"><n-tag type="success"> 已到账 </n-tag></n-descriptions-item>
+        <n-descriptions-item label="状态">
+          <n-tag type="success"> 已到账</n-tag>
+        </n-descriptions-item>
      </n-descriptions>
    </n-card>
    <n-card :bordered="false" title="其它信息" class="proCard mt-4" size="small" :segmented="{content: 'hard'}">
      <n-descriptions label-placement="left" class="py-2">
-        <n-descriptions-item><template #label>城市</template>深圳</n-descriptions-item>
+        <n-descriptions-item>
+          <template #label>城市</template>
+          深圳
+        </n-descriptions-item>
        <n-descriptions-item label="性别">男</n-descriptions-item>
        <n-descriptions-item label="邮箱">NaiveUiAdmin@qq.com</n-descriptions-item>
        <n-descriptions-item label="地址">广东省深圳市南山区</n-descriptions-item>
        <n-descriptions-item label="生日">1991-06-04</n-descriptions-item>
-        <n-descriptions-item label="认证"><n-tag type="success"> 已认证 </n-tag></n-descriptions-item>
+        <n-descriptions-item label="认证">
+          <n-tag type="success"> 已认证</n-tag>
+        </n-descriptions-item>
      </n-descriptions>
    </n-card>
    <n-card :bordered="false" title="表格信息" class="proCard mt-4" size="small" :segmented="{content: 'hard'}">
--- a/src/views/form/stepForm/Step1.vue
+++ b/src/views/form/stepForm/Step1.vue
@@ -1,26 +1,26 @@
 <template>
  <n-form
-    :label-width="90"
-    :model="formValue"
-    :rules="rules"
-    label-placement="left"
-    ref="form1Ref"
-    style="max-width: 500px; margin: 40px auto 0;"
+      :label-width="90"
+      :model="formValue"
+      :rules="rules"
+      label-placement="left"
+      ref="form1Ref"
+      style="max-width: 500px; margin: 40px auto 0;"
  >
    <n-form-item label="付款账户" path="myAccount">
      <n-select
-        placeholder="请选择付款账户"
-        :options="myAccountList"
-        v-model:value="formValue.myAccount"
+          placeholder="请选择付款账户"
+          :options="myAccountList"
+          v-model:value="formValue.myAccount"
      />
    </n-form-item>
    <n-form-item label="收款账户" path="account">
      <n-input-group>
        <n-select
-          placeholder="请选择"
-          :options="accountTypeList"
-          :style="{ width: '20%' }"
-          v-model:value="formValue.accountType"
+            placeholder="请选择"
+            :options="accountTypeList"
+            :style="{ width: '20%' }"
+            v-model:value="formValue.accountType"
        />
        <n-input placeholder="请输入收款账户" :style="{ width: '80%' }" v-model:value="formValue.account"/>
      </n-input-group>
--- a/src/views/form/stepForm/Step2.vue
+++ b/src/views/form/stepForm/Step2.vue
@@ -1,11 +1,11 @@
 <template>
  <n-form
-    :label-width="90"
-    :model="formValue"
-    :rules="rules"
-    label-placement="left"
-    ref="form2Ref"
-    style="max-width: 500px; margin: 40px auto 0;"
+      :label-width="90"
+      :model="formValue"
+      :rules="rules"
+      label-placement="left"
+      ref="form2Ref"
+      style="max-width: 500px; margin: 40px auto 0;"
  >
    <n-form-item label="付款账户" path="myAccount">
      <span>NaiveUiAdmin@163.com</span>
--- a/src/views/form/stepForm/stepForm.vue
+++ b/src/views/form/stepForm/stepForm.vue
@@ -9,16 +9,16 @@
      <n-space vertical class="steps">
        <n-steps :current="currentTab" :status="currentStatus">
          <n-step
-            title="填写转账信息"
-            description="确保填写正确"
+              title="填写转账信息"
+              description="确保填写正确"
          />
          <n-step
-            title="确认转账信息"
-            description="确认转账信息"
+              title="确认转账信息"
+              description="确认转账信息"
          />
          <n-step
-            title="完成"
-            description="恭喜您，转账成功"
+              title="完成"
+              description="恭喜您，转账成功"
          />
        </n-steps>
        <step1 v-if="currentTab === 1" @nextStep="nextStep"/>