# Conflicts:
#	.env.development
This commit is contained in:
zjf committed 2025-01-17 14:17:31 +08:00
commit ea2daab109
10 files changed
+198 -157

No files matched your search

+43 -29
View File
@@ -1,52 +1,66 @@
<template> <template>
<el-select style="width: 100%;" v-model="state.selectId" :placeholder="props.placeholder" clearable <el-select
@visible-change="(e: boolean) => e && getDictOptions()"> style="width: 100%"
<el-option v-for="v in state.dictList" :key="v.code" :label="v.label" :value="v.value" /> v-model="state.selectId"
</el-select> :placeholder="props.placeholder"
clearable
@visible-change="(e: boolean) => e && getDictOptions()"
>
<el-option v-for="v in state.dictList" :key="v.code" :label="v.label" :value="v.value" />
</el-select>
</template> </template>
<script setup lang="ts" name="dict-select"> <script setup lang="ts" name="dict-select">
import { reactive, computed, defineModel, withDefaults, defineProps } from 'vue'; import { reactive } from "vue"
import { dict } from '/@/stores/dict'; import { dict } from "/@/stores/dict"
import { getDicts } from '/@/api/admin/dict'; import { getDicts } from "/@/api/admin/dict"
const selectId = defineModel() const selectId = defineModel()
export type Props = { export type Props = {
dictCode: string, dictCode: string
placeholder?: string, placeholder?: string
} }
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {
placeholder: "请选择", placeholder: "请选择",
}) })
const state = reactive<any>({ const state = reactive<any>({
selectId: selectId, selectId: selectId,
dictList: [] dictList: [],
}) })
watch(selectId, (newVal, oldValue) => { watch(
if (newVal == oldValue) return selectId,
state.selectId = newVal (newVal, oldValue) => {
getDictOptions() if (newVal == oldValue) return
}, { immediate: true }) state.selectId = newVal
getDictOptions()
},
{ immediate: true },
)
async function getDictOptions() { async function getDictOptions() {
if (!props.dictCode) return [] if (!props.dictCode) return []
const dicts = dict().getDict(props.dictCode) const dicts = dict().getDict(props.dictCode)
if (dicts) { if (dicts) {
state.dictList = dicts state.dictList = dicts
return return
} }
const res = await getDicts(props.dictCode) const res = await getDicts(props.dictCode)
if (!res) return [] if (!res) return []
state.dictList = res.data.map((p: any) => ({ label: p.label, value: p.value, elTagType: p.listClass, elTagClass: p.cssClass })); state.dictList = res.data.map((p: any) => ({
dict().setDict(props.dictCode, state.dictList); label: p.label,
value: p.value,
elTagType: p.listClass,
elTagClass: p.cssClass,
}))
dict().setDict(props.dictCode, state.dictList)
} }
</script> </script>
<style scoped> <style scoped>
.el-tag+.el-tag { .el-tag + .el-tag {
margin-left: 10px; margin-left: 10px;
} }
</style> </style>
+1 -1
View File
@@ -25,7 +25,7 @@
</template> </template>
<script setup lang="ts" name="select-merchant"> <script setup lang="ts" name="select-merchant">
import { reactive, computed, defineModel, withDefaults, defineProps } from "vue" import { reactive } from "vue"
import { fetchList as getCanteenCategory } from "/@/api/canteen/canteenCategory" import { fetchList as getCanteenCategory } from "/@/api/canteen/canteenCategory"
const selectId = defineModel() const selectId = defineModel()
+1 -1
View File
@@ -25,7 +25,7 @@
</template> </template>
<script setup lang="ts" name="select-merchant"> <script setup lang="ts" name="select-merchant">
import { reactive, computed, defineModel, withDefaults, defineProps } from "vue" import { reactive } from "vue"
import * as cocApi from "/@/api/canteen/canteenOnlineCategory" import * as cocApi from "/@/api/canteen/canteenOnlineCategory"
const selectId = defineModel() const selectId = defineModel()
+54 -43
View File
@@ -1,73 +1,84 @@
<template> <template>
<el-tree-select class="w100" v-model="state.selectId" :data="state.options" <el-tree-select
@visible-change="(e: boolean) => e && getOptions()" class="w100"
:props="{ value: 'id', label: 'name', children: 'children' }" clearable check-strictly v-model="state.selectId"
:render-after-expand="false" :placeholder="props.placeholder" /> :data="state.options"
@visible-change="(e: boolean) => e && getOptions()"
:props="{ value: 'id', label: 'name', children: 'children' }"
clearable
check-strictly
:render-after-expand="false"
:placeholder="props.placeholder"
/>
</template> </template>
<script setup lang="ts" name="select-dept"> <script setup lang="ts" name="select-dept">
import { reactive, computed, defineModel, withDefaults, defineProps } from 'vue' import { reactive } from "vue"
import * as deptApi from "/@/api/admin/dept"; import * as deptApi from "/@/api/admin/dept"
const selectId = defineModel() const selectId = defineModel()
export type Props = { export type Props = {
placeholder?: string, placeholder?: string
} }
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {
placeholder: "请选择", placeholder: "请选择",
}) })
const queryForm = reactive<any>({ const queryForm = reactive<any>({
name: "", name: "",
current: 1, current: 1,
size: 10, size: 10,
}) })
const state = reactive<any>({ const state = reactive<any>({
loading: true, loading: true,
selectId: selectId, selectId: selectId,
options: [] options: [],
}) })
watch(selectId, (newVal, oldValue) => { watch(
if (newVal == oldValue) return selectId,
state.selectId = newVal (newVal, oldValue) => {
getOptions() if (newVal == oldValue) return
}, { immediate: true }) state.selectId = newVal
getOptions()
},
{ immediate: true },
)
async function getOptions() { async function getOptions() {
try { try {
state.loading = true state.loading = true
const _pa = { const _pa = {
...queryForm ...queryForm,
} }
const { data } = await deptApi.deptTree(_pa) const { data } = await deptApi.deptTree(_pa)
state.options = data ?? [] state.options = data ?? []
} finally { } finally {
setTimeout(() => state.loading = false, 500); setTimeout(() => (state.loading = false), 500)
} }
} }
function remoteSearch(params: string) { function remoteSearch(params: string) {
if (params != queryForm.name) { if (params != queryForm.name) {
queryForm.name = params queryForm.name = params
getOptions() getOptions()
} }
} }
function filterTreeData(treeData: Array<any>) { function filterTreeData(treeData: Array<any>) {
return treeData.filter(item => { return treeData.filter((item) => {
if (item.children && item.children.length) { if (item.children && item.children.length) {
item.disabled = true; item.disabled = true
item.children = filterTreeData(item.children) item.children = filterTreeData(item.children)
} }
return item return item
}) })
} }
function clear() { function clear() {
state.selectId = null state.selectId = null
getOptions() getOptions()
} }
</script> </script>
+1 -1
View File
@@ -25,7 +25,7 @@
</template> </template>
<script setup lang="ts" name="select-merchant"> <script setup lang="ts" name="select-merchant">
import { reactive, defineModel, withDefaults, defineProps } from "vue" import { reactive } from "vue"
import * as mchApi from "/@/api/wallet/mch-manage" import * as mchApi from "/@/api/wallet/mch-manage"
const selectId = defineModel() const selectId = defineModel()
+1 -1
View File
@@ -21,7 +21,7 @@
</template> </template>
<script setup lang="ts" name="select-user"> <script setup lang="ts" name="select-user">
import { reactive, computed, defineModel, withDefaults, defineProps } from "vue" import { reactive } from "vue"
import * as userApi from "/@/api/admin/user" import * as userApi from "/@/api/admin/user"
const selectId = defineModel() const selectId = defineModel()
+63 -51
View File
@@ -1,79 +1,91 @@
<template> <template>
<el-select style="width: 100%;" v-model="state.selectId" :placeholder="props.placeholder" clearable <el-select
remote-show-suffix filterable remote :remote-method="remoteSearch" :loading="state.loading" style="width: 100%"
@visible-change="(e: boolean) => e && getOptions()"> v-model="state.selectId"
<el-option v-for="v in state.options" :key="v.id" :label="`${v.name}`" :value="v.id"> :placeholder="props.placeholder"
<div class="flex items-center"> clearable
<div class="color-primary">{{ v.name }}</div> remote-show-suffix
<div class="flex items-center just ml5"> filterable
<el-tag size="small"> remote
{{ state.walletType.find((i: any) => i.value == v.uniqueCode)?.label }} :remote-method="remoteSearch"
</el-tag> :loading="state.loading"
</div> @visible-change="(e: boolean) => e && getOptions()"
</div> >
</el-option> <el-option v-for="v in state.options" :key="v.id" :label="`${v.name}`" :value="v.id">
</el-select> <div class="flex items-center">
<div class="color-primary">{{ v.name }}</div>
<div class="flex items-center just ml5">
<el-tag size="small">
{{ state.walletType.find((i: any) => i.value == v.uniqueCode)?.label }}
</el-tag>
</div>
</div>
</el-option>
</el-select>
</template> </template>
<script setup lang="ts" name="select-wallet-type"> <script setup lang="ts" name="select-wallet-type">
import { reactive, computed, defineModel, withDefaults, defineProps } from 'vue' import { reactive } from "vue"
import * as walletTypeApi from '/@/api/wallet/wallet-type' import * as walletTypeApi from "/@/api/wallet/wallet-type"
import { useDict } from '/@/hooks/dict' import { useDict } from "/@/hooks/dict"
const selectId = defineModel() const selectId = defineModel()
export type Props = { export type Props = {
placeholder?: string, placeholder?: string
} }
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {
placeholder: "请选择", placeholder: "请选择",
}) })
const queryForm = reactive<any>({ const queryForm = reactive<any>({
name: "", name: "",
current: 1, current: 1,
size: 10, size: 10,
}) })
const state = reactive<any>({ const state = reactive<any>({
loading: true, loading: true,
selectId: selectId, selectId: selectId,
options: [], options: [],
walletType: [] walletType: [],
}) })
watch(selectId, (newVal, oldValue) => { watch(
if (newVal == oldValue) return selectId,
state.selectId = newVal (newVal, oldValue) => {
getOptions() if (newVal == oldValue) return
}, { immediate: true }) state.selectId = newVal
getOptions()
},
{ immediate: true },
)
async function getOptions() { async function getOptions() {
try { try {
state.loading = true state.loading = true
const _pa = { const _pa = {
...queryForm ...queryForm,
} }
const { data } = await walletTypeApi.fetchList(_pa) const { data } = await walletTypeApi.fetchList(_pa)
state.options = data.records ?? [] state.options = data.records ?? []
const { wallet_type } = useDict('wallet_type') const { wallet_type } = useDict("wallet_type")
state.walletType = wallet_type state.walletType = wallet_type
} finally { } finally {
setTimeout(() => state.loading = false, 500); setTimeout(() => (state.loading = false), 500)
} }
} }
function remoteSearch(params: string) { function remoteSearch(params: string) {
if (params != queryForm.name) { if (params != queryForm.name) {
queryForm.name = params queryForm.name = params
getOptions() getOptions()
} }
} }
function clear() { function clear() {
state.selectId = null state.selectId = null
getOptions() getOptions()
} }
</script>
</script>
+1 -1
View File
@@ -20,7 +20,7 @@
</template> </template>
<script setup lang="ts" name="select-hard-group"> <script setup lang="ts" name="select-hard-group">
import { reactive, defineModel, withDefaults, defineProps } from "vue" import { reactive } from "vue"
import * as hardGroup from "/@/api/hard/hard-group" import * as hardGroup from "/@/api/hard/hard-group"
const selectId = defineModel() const selectId = defineModel()
+3 -2
View File
@@ -337,10 +337,11 @@ const handleClickSelect = async () => {
selectDialogVisible.value = true selectDialogVisible.value = true
selectObjs.value = [...selectedFood.value] selectObjs.value = [...selectedFood.value]
await getDataListAndSelect() // 获取菜品数据并且勾选表格行
await getDataListAndSelect() // 获取菜品数据并且勾选表格行
// 获取菜品分类数据
try { try {
const res = await getCanteenCategory() const res = await getCanteenCategory({ current: 1, size: 999999 })
categoryOptions.value = res.data.records categoryOptions.value = res.data.records
} catch (error) { } catch (error) {
categoryOptions.value = [] categoryOptions.value = []
+30 -27
View File
@@ -2,7 +2,10 @@
<el-card class="card" v-loading="loading"> <el-card class="card" v-loading="loading">
<el-row> <el-row>
<el-col :span="4" v-for="(item, index) in navMenuList" :key="index"> <el-col :span="4" v-for="(item, index) in navMenuList" :key="index">
<div :class="['nav-menu-item-top', item.id == currentActiveMenuId ? 'nav-menu-item-active' : '']" @click="currentActiveMenuId = item.id"> <div
:class="['nav-menu-item-top', item.id == currentActiveMenuId ? 'nav-menu-item-active' : '']"
@click="currentActiveMenuId = item.id"
>
<el-image class="nav-menu-item-icon" :src="imageBaseUrl + item.menuPic" fit="cover" /> <el-image class="nav-menu-item-icon" :src="imageBaseUrl + item.menuPic" fit="cover" />
<div class="nav-menu-item-name">{{ $t(item.name) }}</div> <div class="nav-menu-item-name">{{ $t(item.name) }}</div>
</div> </div>
@@ -10,7 +13,7 @@
</el-row> </el-row>
<br /> <br />
<el-row v-if="currentActiveMenuId" style="background-color: #e2eff677; border-radius: 1rem; padding: 2rem 6rem"> <el-row v-if="currentActiveMenuId" style="background-color: #e2eff677; border-radius: 1rem; padding: 2rem 6rem">
<el-col v-for="(item, index) in navMenuListBottom" :key="index" :span="!item.meta?.isHide ? 3 : 0"> <el-col v-for="(item, index) in navMenuListBottom" :key="index" :span="!item.meta?.isHide ? 4 : 0">
<div v-if="!item.meta?.isHide" class="nav-menu-item-bottom" @click="handleClickBottomMenu(item)"> <div v-if="!item.meta?.isHide" class="nav-menu-item-bottom" @click="handleClickBottomMenu(item)">
<el-image class="nav-menu-item-icon" :src="imageBaseUrl + item.menuPic" fit="cover" /> <el-image class="nav-menu-item-icon" :src="imageBaseUrl + item.menuPic" fit="cover" />
<div class="nav-menu-item-name">{{ $t(item.name) }}</div> <div class="nav-menu-item-name">{{ $t(item.name) }}</div>
@@ -21,55 +24,55 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'; import { ref } from "vue"
import { ElMessage } from 'element-plus'; import { ElMessage } from "element-plus"
import { useMenuApi } from '/@/api/admin/menu'; import { useMenuApi } from "/@/api/admin/menu"
const router = useRouter(); const router = useRouter()
const menuApi = useMenuApi(); const menuApi = useMenuApi()
const loading = ref(false); const loading = ref(false)
const navMenuList = ref<any>([]); const navMenuList = ref<any>([])
const currentActiveMenuId = ref(''); const currentActiveMenuId = ref("")
const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH; const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH
// 获取菜单列表 // 获取菜单列表
const getNavMenuList = async () => { const getNavMenuList = async () => {
loading.value = true; loading.value = true
try { try {
const res = await menuApi.getAdminMenu().finally(() => (loading.value = false)); const res = await menuApi.getAdminMenu().finally(() => (loading.value = false))
if (res.code == 0 && res.data.length > 0) { if (res.code == 0 && res.data.length > 0) {
navMenuList.value = res.data; navMenuList.value = res.data
} }
} catch (error) { } catch (error) {
navMenuList.value = []; navMenuList.value = []
ElMessage.error('加载错误'); ElMessage.error("加载错误")
loading.value = false; loading.value = false
} }
}; }
const navMenuListBottom = computed(() => { const navMenuListBottom = computed(() => {
if (navMenuList.value) { if (navMenuList.value) {
const currentMenuItem = navMenuList.value.find((item: any) => item.id == currentActiveMenuId.value); const currentMenuItem = navMenuList.value.find((item: any) => item.id == currentActiveMenuId.value)
if (currentMenuItem && currentMenuItem.children) return currentMenuItem.children; if (currentMenuItem && currentMenuItem.children) return currentMenuItem.children
} else { } else {
return []; return []
} }
}); })
// 点击菜单项 // 点击菜单项
const handleClickBottomMenu = (item: any) => { const handleClickBottomMenu = (item: any) => {
router.push(item.path); router.push(item.path)
}; }
onMounted(async () => { onMounted(async () => {
await getNavMenuList(); await getNavMenuList()
}); })
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.card { .card {
padding: 5vw; padding: 5vw;
height: 100%; height: calc(100vh - 85px);
background-image: linear-gradient(0deg, #ffffff 0%, #e4ebff 100%); background-image: linear-gradient(0deg, #ffffff 0%, #e4ebff 100%);
} }
.nav-menu-item-top { .nav-menu-item-top {