xxxxxx

src/packages/pc/components/layouts/header/components/cancel/index.vue

@@ -0,0 +1,47 @@
+<!-- 系统公告 -->
+<template>
+    <app-drawer title="注销服务" :width="600" v-model:show="show" :loading="loading" :refresh="refresh">
+        <h4>账户注销后不能再使用该系统，如果账户有余额需要人工审核才能注销，确定要注销账户吗？</h4>
+        <section class="logoff__details">
+            <h4>为保证您的账号安全，在提交注销申请时，需同时满足以下条件：</h4>
+            <dl>
+                <dt>1. 账号财产已结清。</dt>
+                <dd>没有资产、欠款、未结清的资金和现货。</dd>
+                <dt>2. 账号处于安全状态。</dt>
+                <dd>账号处于正常使用状态，无被盗风险。</dd>
+                <dt>3. 账号无任何纠纷。</dt>
+            </dl>
+        </section>
+        <template #footer>
+            <el-button type="info" @click="onCancel(false)">取消</el-button>
+            <el-button type="danger" @click="onSubmit">确认注销</el-button>
+        </template>
+    </app-drawer>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+import { ElMessage } from 'element-plus'
+import { useAccountCancellation } from '@/business/user'
+import AppDrawer from '@pc/components/base/drawer/index.vue'
+
+const { formSubmit } = useAccountCancellation()
+
+const show = ref(true)
+const refresh = ref(false)
+
+const onCancel = (isRefresh = false) => {
+    show.value = false
+    refresh.value = isRefresh
+}
+
+const onSubmit = () => {
+    formSubmit().then(() => {
+        ElMessage.success('提交成功，请等待审核。').then.then(() => {
+            close(true)
+        })
+    }).catch((err) => {
+        ElMessage.error('提交失败：' + err)
+    })
+}
+</script>

src/packages/pc/components/layouts/header/components/modify/index.vue

@@ -1,7 +1,7 @@
 <!-- 系统公告 -->
 <template>
-    <app-drawer class="app-notice" title="修改登录密码" :width="400" v-model:show="show" :loading="loading" :refresh="refresh">
-        <el-form ref="formRef" label-width="100px" :model="formData" :rules="formRules">
+    <app-drawer title="修改登录密码" :width="400" v-model:show="show" :loading="loading" :refresh="refresh">
+        <el-form ref="formRef" class="el-form--vertical" label-width="100px" :model="formData" :rules="formRules">
             <el-form-item label="原密码" prop="OldPwd">
                 <el-input placeholder="请输入原密码" show-password v-model="formData.OldPwd" />
             </el-form-item>
@@ -51,7 +51,7 @@ const formRules: FormRules = {
         {
             required: true,
             validator: (rule, value, callback) => {
-                if (value === formData.NewPwd) {
+                if (Confirmpassword.value === formData.NewPwd) {
                     callback()
                 } else {
                     callback(new Error('密码输入不一致！'))

src/packages/pc/components/layouts/header/index.vue

@@ -23,6 +23,8 @@
                     <el-dropdown-menu>
                         <el-dropdown-item :icon="Unlock"
                             @click="openComponent('modify')">修改密码</el-dropdown-item>
+                        <el-dropdown-item :icon="Delete"
+                            @click="openComponent('cancel')">注销账户</el-dropdown-item>
                         <el-dropdown-item :icon="SwitchButton"
                             @click="eventBus.$emit('LogoutNotify')">退出登录</el-dropdown-item>
                     </el-dropdown-menu>
@@ -35,7 +37,7 @@
 
 <script lang="ts" setup>
 import { ref, onMounted, computed, defineAsyncComponent } from 'vue'
-import { SwitchButton, Unlock } from '@element-plus/icons-vue'
+import { SwitchButton, Unlock, Delete } from '@element-plus/icons-vue'
 import { getFileUrl } from '@/filters'
 import { useComponent } from '@/hooks/component'
 import { useUserStore, useGlobalStore, useNoticeStore } from '@/stores'
@@ -45,6 +47,7 @@ import AppIcon from '@pc/components/base/icon/index.vue'
 const componentMap = new Map<string, unknown>([
     ['notice', defineAsyncComponent(() => import('./components/notice/index.vue'))],
     ['modify', defineAsyncComponent(() => import('./components/modify/index.vue'))],
+    ['cancel', defineAsyncComponent(() => import('./components/cancel/index.vue'))],
 ])
 
 const { componentId, openComponent, closeComponent } = useComponent()