| | |
| | | const add = ref(false) |
| | | const adda = ref(false) |
| | | |
| | | import { useI18n } from 'vue-i18n' |
| | | const { t } = useI18n() |
| | | let language = ref(localStorage.getItem('lang') || 'zh') |
| | | const editingUser = ref({}); // 用于存储当前编辑的用户数据 |
| | | import request from "@/utils/request" |
| | | import { ref, onMounted } from "vue"; |
| | |
| | | }; |
| | | // 删除 |
| | | const opena = async(row) => { |
| | | try { |
| | | try { |
| | | const confirmResult = await ElMessageBox.confirm( |
| | | '是否删除该菜单?', |
| | | '提示', |
| | | t('customer.demenu'), |
| | | t('customer.prompt'), |
| | | { |
| | | confirmButtonText: '是', |
| | | cancelButtonText: '取消', |
| | | confirmButtonText: t('customer.yes'), |
| | | cancelButtonText: t('customer.cancel'), |
| | | type: 'warning', |
| | | } |
| | | ); |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | // 用户点击了“是”,现在调用删除接口 |
| | | const response = await request.post("/loadGlass/sys/menu/deleteMenu", { |
| | |
| | | } |
| | | }; |
| | | |
| | | // const gridOptions = reactive({ |
| | | // border: "full",//表格加边框 |
| | | // keepSource: true,//保持源数据 |
| | | // align: 'center',//文字居中 |
| | | // stripe:true,//斑马纹 |
| | | // rowConfig: {isCurrent: true, isHover: true,height: 50},//鼠标移动或选择高亮 |
| | | // id: 'OrderList', |
| | | // showFooter: true,//显示脚 |
| | | // printConfig: {}, |
| | | // importConfig: {}, |
| | | // exportConfig: {}, |
| | | // scrollY:{ enabled: true },//开启虚拟滚动 |
| | | // showOverflow:true, |
| | | // columnConfig: { |
| | | // resizable: true, |
| | | // useKey: true |
| | | // }, |
| | | // filterConfig: { //筛选配置项 |
| | | // remote: true |
| | | // }, |
| | | // customConfig: { |
| | | // storage: true |
| | | // }, |
| | | // editConfig: { |
| | | // trigger: 'click', |
| | | // mode: 'row', |
| | | // showStatus: true |
| | | // }, |
| | | // data: [ |
| | | // { |
| | | // 'id': '1', |
| | | // 'long': '5', |
| | | // 'wide': '1005', |
| | | // 'thick': '183.6', |
| | | // } |
| | | // ] |
| | | |
| | | // }) |
| | | </script> |
| | | |
| | | <template> |
| | | <div style="height: 700px;"> |
| | | <el-button type="primary" style="margin-top: 10px;margin-left: 10px;" size="mini" id="searchButton" @click="add = true">添加菜单</el-button> |
| | | <div style="height: 600px;"> |
| | | <el-button type="primary" style="margin-top: 10px;margin-left: 10px;" size="mini" id="searchButton" @click="add = true">{{ $t('customer.addmenu') }}</el-button> |
| | | <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading"> |
| | | <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;max-height: 650px;"> |
| | | <el-table |
| | | :data="tableData" |
| | | height="650" |
| | | height="550" |
| | | @expand-change="handleExpandChange" |
| | | row-key="id" |
| | | :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}" |
| | |
| | | row-key="id" |
| | | :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}" |
| | | > |
| | | <el-table-column prop="menuName" label="二级菜单栏" align="center" min-width="140" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"/> |
| | | <el-table-column prop="url" label="链接" align="center" min-width="160"/> |
| | | <el-table-column prop="id" align="center" label="排序" min-width="140"/> |
| | | <el-table-column fixed="right" label="操作" align="center"> |
| | | <el-table-column prop="menuName" :label="$t('customer.semenu')" align="center" min-width="140" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"/> |
| | | <el-table-column prop="url" :label="$t('customer.link')" align="center" min-width="160"/> |
| | | <el-table-column prop="id" align="center" :label="$t('customer.sort')" min-width="140"/> |
| | | <el-table-column fixed="right" :label="$t('customer.operate')" align="center"> |
| | | <template #default="scope"> |
| | | <el-button size="mini" type="text" plain @click="handleEdit(scope.row)">编辑</el-button> |
| | | <el-button size="mini" type="text" plain @click="opena(scope.row)">删除</el-button> |
| | | <el-button size="mini" type="text" plain @click="handleEdit(scope.row)">{{ $t('customer.exit') }}</el-button> |
| | | <el-button size="mini" type="text" plain @click="opena(scope.row)">{{ $t('customer.delete') }}</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="menuName" label="一级菜单栏" align="center" min-width="120" /> |
| | | <el-table-column prop="url" label="链接" align="center" min-width="200"/> |
| | | <el-table-column prop="id" align="center" label="排序" min-width="180" /> |
| | | <el-table-column fixed="right" label="操作" align="center" width="200"> |
| | | <el-table-column prop="menuName" :label="$t('customer.firstmenu')" align="center" min-width="120" /> |
| | | <el-table-column prop="url" :label="$t('customer.link')" align="center" min-width="200"/> |
| | | <el-table-column prop="id" align="center" :label="$t('customer.sort')" min-width="180" /> |
| | | <el-table-column fixed="right" :label="$t('customer.operate')" align="center" width="200"> |
| | | <template #default="scope"> |
| | | <el-button size="mini" type="text" plain @click="handleEdit(scope.row)">编辑</el-button> |
| | | <el-button size="mini" type="text" plain @click="opena(scope.row)">删除</el-button> |
| | | <el-button size="mini" type="text" plain @click="handleEdit(scope.row)">{{ $t('customer.exit') }}</el-button> |
| | | <el-button size="mini" type="text" plain @click="opena(scope.row)">{{ $t('customer.delete') }}</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | <el-dialog v-model="add" top="23vh" width="37%" title="添加菜单" > |
| | | <el-dialog v-model="add" top="23vh" width="37%" :title="$t('customer.addmenu')"> |
| | | <div style="margin-left: -50px;margin-top: 10px;margin-bottom: 10px;"> |
| | | <el-form size="mini" label-width="150px"> |
| | | <el-form label-width="100px" label-position="right"> |
| | |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item label="菜单栏:" :required="true" style="width: 25vw"> |
| | | <el-input v-model="menuName" autocomplete="off" /> |
| | | <el-form-item :label="$t('customer.menu')" :required="true" style="width: 25vw"> |
| | | <el-input v-model="menuName" autocomplete="off" :placeholder="$t('customer.inmenu')"/> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item label="链接:" :required="true" style="width: 25vw"> |
| | | <el-input v-model="url" autocomplete="off" /> |
| | | <el-form-item :label="$t('customer.linka')" :required="true" style="width: 25vw"> |
| | | <el-input v-model="url" autocomplete="off" :placeholder="$t('customer.inlink')"/> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item label="排序:" :required="true" style="width: 25vw"> |
| | | <el-input v-model="parentId" autocomplete="off" /> |
| | | <el-form-item :label="$t('customer.sorta')" :required="true" style="width: 25vw"> |
| | | <el-input v-model="parentId" autocomplete="off" :placeholder="$t('customer.insort')"/> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <template #footer> |
| | | <div id="dialog-footer"> |
| | | <el-button type="primary" @click="getTableRow"> |
| | | 确认 |
| | | {{ $t('customer.sure') }} |
| | | </el-button> |
| | | <el-button @click="add = false">取消</el-button> |
| | | <el-button @click="add = false">{{ $t('customer.cancel') }}</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | <el-dialog v-model="adda" top="23vh" width="37%" title="修改菜单" > |
| | | <el-dialog v-model="adda" top="23vh" width="37%" :title="$t('customer.exmene')"> |
| | | <div style="margin-left: -50px;margin-top: 10px;margin-bottom: 10px;"> |
| | | <el-form :model="editingUser" ref="formRef" size="mini" label-width="150px"> |
| | | <el-form label-width="100px" label-position="right"> |
| | |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item label="菜单栏:" :required="true" style="width: 25vw"> |
| | | <el-input v-model="editingUser.menuName" autocomplete="off" /> |
| | | <el-form-item :label="$t('customer.menu')" :required="true" style="width: 25vw"> |
| | | <el-input v-model="editingUser.menuName" autocomplete="off" :placeholder="$t('customer.inmenu')"/> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item label="链接:" :required="true" style="width: 25vw"> |
| | | <el-input v-model="editingUser.url" autocomplete="off" /> |
| | | <el-form-item :label="$t('customer.linka')" :required="true" style="width: 25vw"> |
| | | <el-input v-model="editingUser.url" autocomplete="off" :placeholder="$t('customer.inlink')"/> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item label="排序:" :required="true" style="width: 25vw"> |
| | | <el-input v-model="editingUser.parentId" autocomplete="off" /> |
| | | <el-form-item :label="$t('customer.sorta')" :required="true" style="width: 25vw"> |
| | | <el-input v-model="editingUser.parentId" autocomplete="off" :placeholder="$t('customer.insort')"/> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <template #footer> |
| | | <div id="dialog-footer"> |
| | | <el-button type="primary" @click="getTableRowa"> |
| | | 确认 |
| | | {{ $t('customer.sure') }} |
| | | </el-button> |
| | | <el-button @click="adda = false">取消</el-button> |
| | | <el-button @click="adda = false">{{ $t('customer.cancel') }}</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |