1404/11/04- first
This commit is contained in:
@@ -0,0 +1,247 @@
|
||||
<template>
|
||||
<ALayoutHeader
|
||||
theme="light"
|
||||
:class="[prefixCls]"
|
||||
:style="`height:${layoutStore.header.height};line-height:${layoutStore.header.height}`"
|
||||
>
|
||||
<!-- :style="`height:${layoutStore.header.height};line-height:${layoutStore.header.height}`"-->
|
||||
<div class="flex items-center">
|
||||
<div class="flex-1 flex">
|
||||
<img :src="getConfigApp('avatar')" style="height: 38px" class="mr-5 mt-1" />
|
||||
<BaseButton
|
||||
type="text"
|
||||
icon="vuesax-linear:menu"
|
||||
@click="handleCollapseSideMenu"
|
||||
v-if="layoutStore.layout == 'side'"
|
||||
/>
|
||||
<!-- justify-center flex-1 -->
|
||||
<!-- <div class="">-->
|
||||
<BasicMenu/>
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
<!-- <BaseButton icon="vuesax-linear:menu" @click="handleCollapseSideMenu"></BaseButton>-->
|
||||
<!-- <div @click="handleCollapseSideMenu">بستن منو</div>-->
|
||||
<div class="flex items-center gap-3 ">
|
||||
<div>
|
||||
<BaseButton size="small" @click="openNewTabBalance">تراز</BaseButton>
|
||||
</div>
|
||||
<ADropdown placement="bottomLeft" class="ml-5">
|
||||
<a class="ant-dropdown-link" @click.prevent>
|
||||
<!-- Hover me-->
|
||||
<div class="flex items-center gap-1 text-gray-400">
|
||||
<AAvatar :src="placeholderM" />
|
||||
<Icon icon="vuesax-linear:arrow-down" size="15" />
|
||||
</div>
|
||||
</a>
|
||||
<template #overlay>
|
||||
<AMenu>
|
||||
<AMenuItem>
|
||||
<div class="flex flex-col">
|
||||
<span class="font-bold">{{ userStore.userInfo?.name }}</span>
|
||||
<span>{{ userStore.userInfo?.post_user }}</span>
|
||||
</div>
|
||||
</AMenuItem>
|
||||
<AMenuDivider />
|
||||
<AMenuItem @click="myInfoVisible = true">
|
||||
<div class="flex items-center gap-1">
|
||||
<Icon icon="vuesax-linear:profile" size="18" />
|
||||
<span>اطلاعات حساب کاربری</span>
|
||||
</div>
|
||||
</AMenuItem>
|
||||
<AMenuItem @click="clearLocalStorage">
|
||||
<div class="flex items-center gap-1">
|
||||
<Icon icon="vuesax-linear:logout" size="18" />
|
||||
<span>خروج</span>
|
||||
</div>
|
||||
</AMenuItem>
|
||||
</AMenu>
|
||||
</template>
|
||||
</ADropdown>
|
||||
<!-- todo remove -->
|
||||
<div class="w-2"></div>
|
||||
<BaseButton
|
||||
iconSize="20"
|
||||
icon="vuesax-linear:setting"
|
||||
type="text"
|
||||
v-if="layoutStore.showSettingsIcon"
|
||||
@click="handleShowSettings"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<BasicModal
|
||||
v-model:visible="myInfoVisible"
|
||||
width="40rem"
|
||||
title="اطلاعات حساب کاربری"
|
||||
@ok="ok"
|
||||
:loading="loading"
|
||||
@close="myInfoVisible = false"
|
||||
>
|
||||
<a-form :model="form" ref="formRef" autocomplete="off">
|
||||
<div class="grid md:grid-cols-2 gap-4">
|
||||
<a-form-item label="نام" name="fname" :rules="inputRules()">
|
||||
<BasicInput v-model:value="form.fname" />
|
||||
</a-form-item>
|
||||
<a-form-item label="نام خانوادگی" name="lname" :rules="inputRules()">
|
||||
<BasicInput v-model:value="form.lname" />
|
||||
</a-form-item>
|
||||
<a-form-item label="شماره موبایل" name="mobile" :rules="inputLenRules(11)">
|
||||
<BasicInput v-model:value="form.mobile" type="number" />
|
||||
</a-form-item>
|
||||
<a-form-item label="رمز کاربری" name="password">
|
||||
<BasicInput type="password" v-model:value="form.password" />
|
||||
</a-form-item>
|
||||
</div>
|
||||
</a-form>
|
||||
</BasicModal>
|
||||
|
||||
<!-- this is admin header-->
|
||||
<!-- <div :class="['admin-header-wide', layout, pageWidth]">
|
||||
<router-link
|
||||
v-if="isMobile || layout === 'head'"
|
||||
to="/"s
|
||||
:class="['logo', isMobile ? null : 'pc', headerTheme]"
|
||||
>
|
||||
<img width="32" src="@/assets/img/logo.png" />
|
||||
<h1 v-if="!isMobile">{{ systemName }}</h1>
|
||||
</router-link>
|
||||
<a-divider v-if="isMobile" type="vertical" />
|
||||
<a-icon
|
||||
v-if="layout !== 'head'"
|
||||
class="trigger"
|
||||
:type="collapsed ? 'menu-unfold' : 'menu-fold'"
|
||||
@click="toggleCollapse"
|
||||
/>
|
||||
<div
|
||||
v-if="layout !== 'side' && !isMobile"
|
||||
class="admin-header-menu"
|
||||
:style="`width: ${menuWidth};`"
|
||||
>
|
||||
<i-menu
|
||||
class="head-menu"
|
||||
:theme="headerTheme"
|
||||
mode="horizontal"
|
||||
:options="menuData"
|
||||
@select="onSelect"
|
||||
/>
|
||||
</div>
|
||||
<div :class="['admin-header-right', headerTheme]">
|
||||
<header-search class="header-item" @active="(val) => (searchActive = val)" />
|
||||
<a-tooltip class="header-item" title="帮助文档" placement="bottom">
|
||||
<a href="https://iczer.gitee.io/vue-antd-admin-docs/" target="_blank">
|
||||
<a-icon type="question-circle-o" />
|
||||
</a>
|
||||
</a-tooltip>
|
||||
<header-notice class="header-item" />
|
||||
<header-avatar class="header-item" />
|
||||
<a-dropdown class="lang header-item">
|
||||
<div><a-icon type="global" /> {{ langAlias }}</div>
|
||||
<a-menu @click="(val) => setLang(val.key)" :selected-keys="[lang]" slot="overlay">
|
||||
<a-menu-item v-for="lang in langList" :key="lang.key">{{
|
||||
lang.key.toLowerCase() + ' ' + lang.name
|
||||
}}</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
</div>-->
|
||||
</ALayoutHeader>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {openNewTabBalance} from '@core/composable/appInfo'
|
||||
import { usePrefix } from '@core/composable/usePrefix'
|
||||
import { useLayoutStore } from '@core/stores/layout'
|
||||
import BasicMenu from '@core/layouts/composnts/BasicMenu.vue'
|
||||
import placeholderM from '@core/assets/img/avatars/placeholder-m.jpg'
|
||||
import Icon from '@core/components/BaseIcon/src/Icon.vue'
|
||||
import { useSettingsStore } from '@core/stores/settings'
|
||||
import { useStaticApiListsStore } from '@/store/staticApisStore'
|
||||
import { useUserStore } from '@/store/userStore'
|
||||
import { inputRules, inputLenRules } from '@/utils/inputRules'
|
||||
import type { User } from '@/model/user'
|
||||
import { createUser, updateMyInformation, updateUser } from '@/api/user'
|
||||
import { message } from 'ant-design-vue/es'
|
||||
import { onMounted, ref } from 'vue'
|
||||
import type { FormInstance } from 'ant-design-vue'
|
||||
import { cloneDeep } from 'lodash'
|
||||
import { useWindowSize } from '@vueuse/core'
|
||||
import {getConfigApp} from "@/utils/config";
|
||||
const { prefixCls } = usePrefix('basic-header')
|
||||
const layoutStore = useLayoutStore()
|
||||
const store = useStaticApiListsStore()
|
||||
const userStore = useUserStore()
|
||||
const settingsStore = useSettingsStore()
|
||||
|
||||
|
||||
const { width } = useWindowSize()
|
||||
//my info modal
|
||||
const loading = ref<boolean>(false)
|
||||
const myInfoVisible = ref<boolean>(false)
|
||||
const formRef = ref<FormInstance>()
|
||||
const form = ref<User>({
|
||||
fname: '',
|
||||
lname: '',
|
||||
mobile: '',
|
||||
post_user: '',
|
||||
manager_id: '',
|
||||
responsible_id: '',
|
||||
section: '',
|
||||
section_id: undefined,
|
||||
process_id: '',
|
||||
qc_id: undefined,
|
||||
user_type: undefined,
|
||||
permission: []
|
||||
})
|
||||
onMounted(() => {
|
||||
form.value = cloneDeep(userStore?.userInfo) as User
|
||||
|
||||
|
||||
})
|
||||
//submit user
|
||||
async function ok() {
|
||||
formRef.value?.validateFields().then(async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
await updateMyInformation(form.value)
|
||||
userStore.getMyInfo()
|
||||
message.success('اطلاعات با موفقیت ویرایش شد')
|
||||
myInfoVisible.value = false
|
||||
} catch (e) {
|
||||
// message.error('خطا در بارگذاری اطلاعات')
|
||||
console.error(e)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//const temp = 12
|
||||
function handleCollapseSideMenu() {
|
||||
layoutStore.sideMenu.collapsed = !layoutStore.sideMenu.collapsed
|
||||
}
|
||||
|
||||
function handleShowSettings() {
|
||||
settingsStore.showSettingsDrawer = !settingsStore.showSettingsDrawer
|
||||
}
|
||||
|
||||
function clearLocalStorage() {
|
||||
localStorage.clear()
|
||||
location.reload()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
@prefix: ~'@{prefixCls}-basic-header';
|
||||
|
||||
.@{prefix} {
|
||||
padding: unset;
|
||||
//height: unset;
|
||||
//@apply flex flex-col justify-center ;
|
||||
//height: 64px;
|
||||
//line-height: unset;
|
||||
border-bottom: 2px solid #eee;
|
||||
// height: @header-height;
|
||||
background-color: #fff;
|
||||
//@apply backdrop-blur bg-red-200;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user