Merge branch 'master' of http://gitea.zianxin.com/zianxin-tec/biz-pc-cloud
This commit is contained in:
commit
347edcab76
2 files changed
+127
-107
No files matched your search
@@ -2,7 +2,11 @@
|
|||||||
<div class="layout-navbars-breadcrumb-user pr15" :style="{ flex: layoutUserFlexNum }">
|
<div class="layout-navbars-breadcrumb-user pr15" :style="{ flex: layoutUserFlexNum }">
|
||||||
<el-dropdown :show-timeout="70" :hide-timeout="50" trigger="click" @command="onLanguageChange">
|
<el-dropdown :show-timeout="70" :hide-timeout="50" trigger="click" @command="onLanguageChange">
|
||||||
<div class="layout-navbars-breadcrumb-user-icon">
|
<div class="layout-navbars-breadcrumb-user-icon">
|
||||||
<i class="iconfont" :class="state.disabledI18n === 'en' ? 'icon-fuhao-yingwen' : 'icon-fuhao-zhongwen'" :title="$t('user.title1')"></i>
|
<i
|
||||||
|
class="iconfont"
|
||||||
|
:class="state.disabledI18n === 'en' ? 'icon-fuhao-yingwen' : 'icon-fuhao-zhongwen'"
|
||||||
|
:title="$t('user.title1')"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<template #dropdown>
|
<template #dropdown>
|
||||||
<el-dropdown-menu>
|
<el-dropdown-menu>
|
||||||
@@ -38,6 +42,18 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-popover>
|
</el-popover>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="layout-navbars-breadcrumb-user-icon">
|
||||||
|
<el-popover placement="bottom" trigger="click" :persistent="false">
|
||||||
|
<template #reference>
|
||||||
|
<el-icon><Phone /></el-icon>
|
||||||
|
</template>
|
||||||
|
<template #default>
|
||||||
|
<div>联系热线:</div>
|
||||||
|
<div>18367908152</div>
|
||||||
|
<div>15657370065</div>
|
||||||
|
</template>
|
||||||
|
</el-popover>
|
||||||
|
</div>
|
||||||
<div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
|
<div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
|
||||||
<i
|
<i
|
||||||
class="iconfont"
|
class="iconfont"
|
||||||
@@ -55,9 +71,9 @@
|
|||||||
</span>
|
</span>
|
||||||
<template #dropdown>
|
<template #dropdown>
|
||||||
<el-dropdown-menu>
|
<el-dropdown-menu>
|
||||||
<el-dropdown-item command="/home">{{ $t('user.dropdown1') }}</el-dropdown-item>
|
<el-dropdown-item command="/home">{{ $t("user.dropdown1") }}</el-dropdown-item>
|
||||||
<el-dropdown-item command="personal">{{ $t('user.dropdown2') }}</el-dropdown-item>
|
<el-dropdown-item command="personal">{{ $t("user.dropdown2") }}</el-dropdown-item>
|
||||||
<el-dropdown-item divided command="logOut">{{ $t('user.dropdown5') }}</el-dropdown-item>
|
<el-dropdown-item divided command="logOut">{{ $t("user.dropdown5") }}</el-dropdown-item>
|
||||||
</el-dropdown-menu>
|
</el-dropdown-menu>
|
||||||
</template>
|
</template>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
@@ -68,168 +84,168 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="layoutBreadcrumbUser">
|
<script setup lang="ts" name="layoutBreadcrumbUser">
|
||||||
import { logout } from '/@/api/login';
|
import { logout } from "/@/api/login"
|
||||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
import { ElMessage, ElMessageBox } from "element-plus"
|
||||||
import screenfull from 'screenfull';
|
import screenfull from "screenfull"
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from "vue-i18n"
|
||||||
import { useUserInfo } from '/@/stores/userInfo';
|
import { useUserInfo } from "/@/stores/userInfo"
|
||||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
import { useThemeConfig } from "/@/stores/themeConfig"
|
||||||
import other from '/@/utils/other';
|
import other from "/@/utils/other"
|
||||||
import mittBus from '/@/utils/mitt';
|
import mittBus from "/@/utils/mitt"
|
||||||
import { Local, Session } from '/@/utils/storage';
|
import { Local, Session } from "/@/utils/storage"
|
||||||
import { formatAxis } from '/@/utils/formatTime';
|
import { formatAxis } from "/@/utils/formatTime"
|
||||||
import { useMsg } from '/@/stores/msg';
|
import { useMsg } from "/@/stores/msg"
|
||||||
import { fetchUserMessageList } from '/@/api/admin/message';
|
import { fetchUserMessageList } from "/@/api/admin/message"
|
||||||
|
|
||||||
// 引入组件
|
// 引入组件
|
||||||
const GlobalWebsocket = defineAsyncComponent(() => import('/@/components/Websocket/index.vue'));
|
const GlobalWebsocket = defineAsyncComponent(() => import("/@/components/Websocket/index.vue"))
|
||||||
const UserNews = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/userNews.vue'));
|
const UserNews = defineAsyncComponent(() => import("/@/layout/navBars/breadcrumb/userNews.vue"))
|
||||||
const Search = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/search.vue'));
|
const Search = defineAsyncComponent(() => import("/@/layout/navBars/breadcrumb/search.vue"))
|
||||||
const PersonalDrawer = defineAsyncComponent(() => import('/@/views/admin/system/user/personal.vue'));
|
const PersonalDrawer = defineAsyncComponent(() => import("/@/views/admin/system/user/personal.vue"))
|
||||||
|
|
||||||
// 定义变量内容
|
// 定义变量内容
|
||||||
const { locale, t } = useI18n();
|
const { locale, t } = useI18n()
|
||||||
const router = useRouter();
|
const router = useRouter()
|
||||||
const stores = useUserInfo();
|
const stores = useUserInfo()
|
||||||
const storesThemeConfig = useThemeConfig();
|
const storesThemeConfig = useThemeConfig()
|
||||||
const { userInfos } = storeToRefs(stores);
|
const { userInfos } = storeToRefs(stores)
|
||||||
const { themeConfig } = storeToRefs(storesThemeConfig);
|
const { themeConfig } = storeToRefs(storesThemeConfig)
|
||||||
const searchRef = ref();
|
const searchRef = ref()
|
||||||
const newsRef = ref();
|
const newsRef = ref()
|
||||||
const personalDrawerRef = ref();
|
const personalDrawerRef = ref()
|
||||||
|
|
||||||
interface State {
|
interface State {
|
||||||
[key: string]: boolean | string;
|
[key: string]: boolean | string
|
||||||
isScreenfull: boolean;
|
isScreenfull: boolean
|
||||||
disabledI18n: string;
|
disabledI18n: string
|
||||||
disabledSize: string;
|
disabledSize: string
|
||||||
}
|
}
|
||||||
|
|
||||||
const state = reactive<State>({
|
const state = reactive<State>({
|
||||||
isScreenfull: false,
|
isScreenfull: false,
|
||||||
disabledI18n: 'zh-cn',
|
disabledI18n: "zh-cn",
|
||||||
disabledSize: 'large',
|
disabledSize: "large",
|
||||||
});
|
})
|
||||||
|
|
||||||
// 是否开启websocket
|
// 是否开启websocket
|
||||||
const websocketEnable = ref(import.meta.env.VITE_WEBSOCKET_ENABLE === 'true');
|
const websocketEnable = ref(import.meta.env.VITE_WEBSOCKET_ENABLE === "true")
|
||||||
|
|
||||||
// 设置分割样式
|
// 设置分割样式
|
||||||
const layoutUserFlexNum = computed(() => {
|
const layoutUserFlexNum = computed(() => {
|
||||||
let num: string | number = '';
|
let num: string | number = ""
|
||||||
const { layout, isClassicSplitMenu } = themeConfig.value;
|
const { layout, isClassicSplitMenu } = themeConfig.value
|
||||||
const layoutArr: string[] = ['defaults', 'columns'];
|
const layoutArr: string[] = ["defaults", "columns"]
|
||||||
if (layoutArr.includes(layout) || (layout === 'classic' && !isClassicSplitMenu)) num = '1';
|
if (layoutArr.includes(layout) || (layout === "classic" && !isClassicSplitMenu)) num = "1"
|
||||||
else num = '';
|
else num = ""
|
||||||
return num;
|
return num
|
||||||
});
|
})
|
||||||
// 全屏点击时
|
// 全屏点击时
|
||||||
const onScreenfullClick = () => {
|
const onScreenfullClick = () => {
|
||||||
if (!screenfull.isEnabled) {
|
if (!screenfull.isEnabled) {
|
||||||
ElMessage.warning('暂不不支持全屏');
|
ElMessage.warning("暂不不支持全屏")
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
screenfull.toggle();
|
screenfull.toggle()
|
||||||
screenfull.on('change', () => {
|
screenfull.on("change", () => {
|
||||||
if (screenfull.isFullscreen) state.isScreenfull = true;
|
if (screenfull.isFullscreen) state.isScreenfull = true
|
||||||
else state.isScreenfull = false;
|
else state.isScreenfull = false
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
// 布局配置 icon 点击时
|
// 布局配置 icon 点击时
|
||||||
const onLayoutSetingClick = () => {
|
const onLayoutSetingClick = () => {
|
||||||
mittBus.emit('openSetingsDrawer');
|
mittBus.emit("openSetingsDrawer")
|
||||||
};
|
}
|
||||||
// 下拉菜单点击时
|
// 下拉菜单点击时
|
||||||
const onHandleCommandClick = (path: string) => {
|
const onHandleCommandClick = (path: string) => {
|
||||||
if (path === 'logOut') {
|
if (path === "logOut") {
|
||||||
ElMessageBox({
|
ElMessageBox({
|
||||||
closeOnClickModal: false,
|
closeOnClickModal: false,
|
||||||
closeOnPressEscape: false,
|
closeOnPressEscape: false,
|
||||||
title: t('user.logOutTitle'),
|
title: t("user.logOutTitle"),
|
||||||
message: t('user.logOutMessage'),
|
message: t("user.logOutMessage"),
|
||||||
showCancelButton: true,
|
showCancelButton: true,
|
||||||
confirmButtonText: t('user.logOutConfirm'),
|
confirmButtonText: t("user.logOutConfirm"),
|
||||||
cancelButtonText: t('user.logOutCancel'),
|
cancelButtonText: t("user.logOutCancel"),
|
||||||
buttonSize: 'default',
|
buttonSize: "default",
|
||||||
beforeClose: (action, instance, done) => {
|
beforeClose: (action, instance, done) => {
|
||||||
if (action === 'confirm') {
|
if (action === "confirm") {
|
||||||
instance.confirmButtonLoading = true;
|
instance.confirmButtonLoading = true
|
||||||
instance.confirmButtonText = t('user.logOutExit');
|
instance.confirmButtonText = t("user.logOutExit")
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
done();
|
done()
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
instance.confirmButtonLoading = false;
|
instance.confirmButtonLoading = false
|
||||||
}, 300);
|
}, 300)
|
||||||
}, 700);
|
}, 700)
|
||||||
} else {
|
} else {
|
||||||
done();
|
done()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then(async () => {
|
.then(async () => {
|
||||||
// 关闭全部的标签页
|
// 关闭全部的标签页
|
||||||
mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 3, ...router }));
|
mittBus.emit("onCurrentContextmenuClick", Object.assign({}, { contextMenuClickId: 3, ...router }))
|
||||||
// 调用后台接口
|
// 调用后台接口
|
||||||
await logout();
|
await logout()
|
||||||
// 清除缓存/token等
|
// 清除缓存/token等
|
||||||
Session.clear();
|
Session.clear()
|
||||||
// 使用 reload 时,不需要调用 resetRoute() 重置路由
|
// 使用 reload 时,不需要调用 resetRoute() 重置路由
|
||||||
window.location.reload();
|
window.location.reload()
|
||||||
})
|
})
|
||||||
.catch(() => {});
|
.catch(() => {})
|
||||||
} else if (path === 'personal') {
|
} else if (path === "personal") {
|
||||||
// 打开个人页面
|
// 打开个人页面
|
||||||
personalDrawerRef.value.open();
|
personalDrawerRef.value.open()
|
||||||
} else {
|
} else {
|
||||||
router.push(path);
|
router.push(path)
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
// 菜单搜索点击
|
// 菜单搜索点击
|
||||||
const onSearchClick = () => {
|
const onSearchClick = () => {
|
||||||
searchRef.value.openSearch();
|
searchRef.value.openSearch()
|
||||||
};
|
}
|
||||||
// 语言切换
|
// 语言切换
|
||||||
const onLanguageChange = (lang: string) => {
|
const onLanguageChange = (lang: string) => {
|
||||||
Local.remove('themeConfig');
|
Local.remove("themeConfig")
|
||||||
themeConfig.value.globalI18n = lang;
|
themeConfig.value.globalI18n = lang
|
||||||
Local.set('themeConfig', themeConfig.value);
|
Local.set("themeConfig", themeConfig.value)
|
||||||
locale.value = lang;
|
locale.value = lang
|
||||||
other.useTitle();
|
other.useTitle()
|
||||||
initI18nOrSize('globalI18n', 'disabledI18n');
|
initI18nOrSize("globalI18n", "disabledI18n")
|
||||||
};
|
}
|
||||||
// 锁屏
|
// 锁屏
|
||||||
const onLockClick = () => {
|
const onLockClick = () => {
|
||||||
themeConfig.value.isLockScreen = true;
|
themeConfig.value.isLockScreen = true
|
||||||
themeConfig.value.lockScreenTime = 0;
|
themeConfig.value.lockScreenTime = 0
|
||||||
Local.set('themeConfig', themeConfig.value);
|
Local.set("themeConfig", themeConfig.value)
|
||||||
};
|
}
|
||||||
|
|
||||||
// 初始化组件大小/i18n
|
// 初始化组件大小/i18n
|
||||||
const initI18nOrSize = (value: string, attr: string) => {
|
const initI18nOrSize = (value: string, attr: string) => {
|
||||||
state[attr] = Local.get('themeConfig')[value];
|
state[attr] = Local.get("themeConfig")[value]
|
||||||
};
|
}
|
||||||
|
|
||||||
// 获取到消息
|
// 获取到消息
|
||||||
const rollback = (msg: string) => {
|
const rollback = (msg: string) => {
|
||||||
useMsg().setMsg({ label: 'websocket消息', value: msg, time: formatAxis(new Date()) });
|
useMsg().setMsg({ label: "websocket消息", value: msg, time: formatAxis(new Date()) })
|
||||||
};
|
}
|
||||||
|
|
||||||
// 获取是否显示未读
|
// 获取是否显示未读
|
||||||
const isDot = ref(false);
|
const isDot = ref(false)
|
||||||
const getIsDot = () => {
|
const getIsDot = () => {
|
||||||
fetchUserMessageList({ category: '1', readFlag: '0' }).then((res) => {
|
fetchUserMessageList({ category: "1", readFlag: "0" }).then((res) => {
|
||||||
isDot.value = res.data.total !== 0;
|
isDot.value = res.data.total !== 0
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
// 页面加载时
|
// 页面加载时
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
if (Local.get('themeConfig')) {
|
if (Local.get("themeConfig")) {
|
||||||
initI18nOrSize('globalComponentSize', 'disabledSize');
|
initI18nOrSize("globalComponentSize", "disabledSize")
|
||||||
initI18nOrSize('globalI18n', 'disabledI18n');
|
initI18nOrSize("globalI18n", "disabledI18n")
|
||||||
}
|
}
|
||||||
|
|
||||||
getIsDot();
|
getIsDot()
|
||||||
});
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|||||||
@@ -159,10 +159,14 @@
|
|||||||
<span>{{ v.spuDetail.specsCapacity }}</span>
|
<span>{{ v.spuDetail.specsCapacity }}</span>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="w-full flex items-center justify-between">
|
<!-- <div class="w-full flex items-center justify-between">
|
||||||
<span>{{ v.spuDetail.specsTaste }}</span>
|
<span>味道:{{ v.spuDetail.specsTaste }}</span>
|
||||||
<span>{{ v.spuDetail.specsWeight }}</span>
|
<span>重量:{{ v.spuDetail.specsWeight }}</span>
|
||||||
<span>{{ v.spuDetail.categoryName }}</span>
|
<span>种类:{{ v.spuDetail.categoryName }}</span>
|
||||||
</div> -->
|
</div> -->
|
||||||
|
<div class="w-full flex items-center justify-between text-xs">
|
||||||
|
<span>库存:{{ v.spuDetail.repertoryCount || 0 }}</span>
|
||||||
|
<span>已售:{{ v.spuDetail.salesCount || 0 }}</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-else
|
v-else
|
||||||
|
|||||||
Reference in new issue
Block a user