|
|
@@ -1,324 +1,64 @@
|
|
|
-<script setup lang="ts">
|
|
|
-import { ref, getCurrentInstance, reactive } from "vue";
|
|
|
-import { useRouter } from "vue-router";
|
|
|
-import request, { download } from '~/utils/request';
|
|
|
-import { pick } from 'lodash-es';
|
|
|
-import { ElMessage } from 'element-plus'
|
|
|
-import type { FormInstance, FormRules } from 'element-plus'
|
|
|
-import type { AxiosRequestConfig } from 'axios'
|
|
|
-
|
|
|
-// #region (constant)
|
|
|
-const TABLE_KEY = 'xkk_id'
|
|
|
-const URL_CUT = '/xdjx/kbgl_kbcssz'
|
|
|
-const URL_CUT_REF = ref(URL_CUT)
|
|
|
-const URL_SUBMIT_KEY = URL_CUT.split('/').join('_').slice(1)
|
|
|
-const instance = getCurrentInstance()
|
|
|
-const router = useRouter()
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (variable)
|
|
|
-const loading_table = ref(true)
|
|
|
-let whichDialogSubmit:'add'|'edit'
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (type)
|
|
|
-type TYPE_TABLE_FIELD = {
|
|
|
- [TABLE_KEY]: string;
|
|
|
- 'xkk_kblx': string; // 课表类型名称
|
|
|
- 'xkk_csmc': string; // 参数名称
|
|
|
- 'xkk_cjr': string; // 创建人
|
|
|
-}
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (props)
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (query row)
|
|
|
-const queryForm_Data = ref<Partial<TYPE_TABLE_FIELD> & { keyword?: string }>({})
|
|
|
-
|
|
|
-const handleQueryFormBtn_search = () => {
|
|
|
- queryApi()
|
|
|
- }
|
|
|
-const handleQueryFormBtn_clear = () => {
|
|
|
- queryForm_Data.value = {}
|
|
|
- }
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (table selection)
|
|
|
-const multipleSelection = ref<TYPE_TABLE_FIELD[]>([])
|
|
|
-const handleSelectionChange = (val:TYPE_TABLE_FIELD[]) => {
|
|
|
- multipleSelection.value = val
|
|
|
-}
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (table row)
|
|
|
-const handleTableRowBtn_import = async ({ file }: { file: File }) => {
|
|
|
- const res = await API_MAP['import']({ file })
|
|
|
- if(res.code === '1'){
|
|
|
- queryApi()
|
|
|
- ElMessage.success(res.msg)
|
|
|
- }
|
|
|
- }
|
|
|
-const handleTableRowBtn_export = () => {
|
|
|
- if(multipleSelection.value.length===0) return ElMessage.info('请先勾选导出文件');exportApi({[TABLE_KEY]:multipleSelection.value.map((item: TYPE_TABLE_FIELD)=>item[TABLE_KEY])?.join()})
|
|
|
- }
|
|
|
-const handleTableRowBtn_add = () => {
|
|
|
- whichDialogSubmit = 'add'
|
|
|
- dialogForm_Data.value = {}
|
|
|
- dialogVisible_addOrEdit.value = true
|
|
|
- }
|
|
|
-const handleTableRowBtn_delete = async () => {
|
|
|
- await deleteApi(multipleSelection.value.map((item: TYPE_TABLE_FIELD)=>item[TABLE_KEY]))
|
|
|
- queryApi()
|
|
|
- }
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (table body)
|
|
|
-const tableData = ref<TYPE_TABLE_FIELD[]>([])
|
|
|
-const DetailName = '-KBGL-KBCSSZ'
|
|
|
-const DetailParam = 'aid'
|
|
|
-
|
|
|
-const handleTableColBtn_edit = async (scope:{row:TYPE_TABLE_FIELD}) => {
|
|
|
- whichDialogSubmit = 'edit'
|
|
|
- const res = await detailApi(scope.row[TABLE_KEY])
|
|
|
- dialogForm_Data.value = (res.data.one_info)
|
|
|
- dialogVisible_addOrEdit.value = true
|
|
|
- }
|
|
|
-const handleTableColBtn_audit = (scope:{row:TYPE_TABLE_FIELD}) => {
|
|
|
- whichDialogSubmit = 'edit'
|
|
|
- dialogForm_Data.value = pick(scope.row, [`${TABLE_KEY}`, ...Object.keys(dialogForm_Rules_audit)])
|
|
|
- dialogVisible_audit.value = true
|
|
|
- }
|
|
|
-const handleTableColBtn_detail = (scope:{row:TYPE_TABLE_FIELD}) => {
|
|
|
- router.push({ name:DetailName, params:{ [DetailParam]:scope.row[TABLE_KEY]} })
|
|
|
- }
|
|
|
-const handleTableColBtn_delete = async (scope:{row:TYPE_TABLE_FIELD}) => {
|
|
|
- const resp = await deleteApi(scope.row[TABLE_KEY]);if(resp.code!=='1')return;ElMessage.success('删除成功');
|
|
|
- queryApi()
|
|
|
- }
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (pagination)
|
|
|
-const total = ref(0)
|
|
|
-const limit = ref(10)
|
|
|
-
|
|
|
-const currentPage=ref(1)
|
|
|
-function handleCurrentChange(){
|
|
|
- queryApi()
|
|
|
-}
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (dialog base)
|
|
|
-const dialogForm_Data = ref<Partial<TYPE_TABLE_FIELD> & { keyword?: string }>({})
|
|
|
-
|
|
|
-const handleDialogFormBtn_submit = async (formRefKey:string, extendData?: Partial<TYPE_TABLE_FIELD>) => {
|
|
|
- const isValid = await (instance?.refs[formRefKey] as FormInstance).validate((valid:boolean) => valid)
|
|
|
- if (isValid) {
|
|
|
- const resp = await API_MAP[whichDialogSubmit](<TYPE_TABLE_FIELD>({...dialogForm_Data.value,...extendData}))
|
|
|
- if(resp.code!=='1')return;ElMessage.success('操作成功');handleDialogFormBtn_cancel()
|
|
|
- queryApi()
|
|
|
- }
|
|
|
- }
|
|
|
-const handleDialogFormBtn_cancel = (formRefKey?:string) => {
|
|
|
- dialogVisible_addOrEdit.value = false
|
|
|
- dialogVisible_audit.value = false
|
|
|
- }
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (dialog add/edit)
|
|
|
-const dialogVisible_addOrEdit = ref<boolean>(false)
|
|
|
-
|
|
|
-const dialogForm_Ref_addOrEdit= ref<FormInstance>()
|
|
|
-const dialogForm_Rules_addOrEdit = reactive({
|
|
|
- 'xkk_kblx':{required : true ,message:'课表类型名称不能为空', trigger: 'submit'},
|
|
|
- 'xkk_csmc':{required : true ,message:'参数名称不能为空', trigger: 'submit'},
|
|
|
- 'xkk_cjr':{required : true ,message:'创建人不能为空', trigger: 'submit'},
|
|
|
-})
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (dialog audit)
|
|
|
-const dialogVisible_audit = ref<boolean>(false)
|
|
|
-
|
|
|
-const dialogForm_Field_audit= reactive<{
|
|
|
- FLAG:keyof TYPE_TABLE_FIELD,
|
|
|
- REASON?:keyof TYPE_TABLE_FIELD
|
|
|
-}>({
|
|
|
- FLAG:'xkk_id',
|
|
|
- REASON:'xkk_id'
|
|
|
-})
|
|
|
-
|
|
|
-const dialogForm_Ref_audit= ref<FormInstance>()
|
|
|
-const dialogForm_Rules_audit = reactive<FormRules>({
|
|
|
- 'xkk_kblx':{required : true ,message:'课表类型名称不能为空', trigger: 'submit'},
|
|
|
- 'xkk_csmc':{required : true ,message:'参数名称不能为空', trigger: 'submit'},
|
|
|
- 'xkk_cjr':{required : true ,message:'创建人不能为空', trigger: 'submit'},
|
|
|
-})
|
|
|
-
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (request api):
|
|
|
-function queryApi(){
|
|
|
- loading_table.value = true
|
|
|
- return request({
|
|
|
- url: URL_CUT + '/index',
|
|
|
- data: {
|
|
|
- ...queryForm_Data.value,
|
|
|
- limit: limit.value,
|
|
|
- page: currentPage.value
|
|
|
- }
|
|
|
- }).then((response:{data:{total_rows:string,page_data:TYPE_TABLE_FIELD[]}}) => {
|
|
|
- const { data } = response
|
|
|
- total.value = parseInt(data.total_rows)
|
|
|
- tableData.value = data.page_data
|
|
|
- return response
|
|
|
- }).then(() => {
|
|
|
- loading_table.value = false
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-function addApi(data:TYPE_TABLE_FIELD){
|
|
|
- return request({
|
|
|
- url: URL_CUT + '/add',
|
|
|
- data: {
|
|
|
- [URL_SUBMIT_KEY]:data,
|
|
|
- }
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-function editApi(data:Partial<TYPE_TABLE_FIELD>){
|
|
|
- return request({
|
|
|
- url: URL_CUT + '/edit',
|
|
|
- data: {
|
|
|
- [TABLE_KEY]:data[TABLE_KEY],
|
|
|
- [URL_SUBMIT_KEY]:pick(data,['xkk_kblx','xkk_csmc','xkk_cjr',]),
|
|
|
- }
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-function deleteApi(id:string|string[]){
|
|
|
- return request({
|
|
|
- url: URL_CUT + '/delete',
|
|
|
- data: {
|
|
|
- [TABLE_KEY]:id,
|
|
|
- }
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-function detailApi(id:string){
|
|
|
- return request({
|
|
|
- url: URL_CUT + '/detail',
|
|
|
- data: {
|
|
|
- [TABLE_KEY]:id,
|
|
|
- }
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-function importApi(data:{file:File}){
|
|
|
- return request({
|
|
|
- $type: 'import',
|
|
|
- url: URL_CUT + '/import',
|
|
|
- data
|
|
|
- } as AxiosRequestConfig)
|
|
|
-}
|
|
|
-
|
|
|
-function exportApi(d){
|
|
|
- return download(URL_CUT + '/index', {...queryForm_Data.value,...d})
|
|
|
-}
|
|
|
-
|
|
|
-const API_MAP = {
|
|
|
- query:queryApi,
|
|
|
- add:addApi,
|
|
|
- edit:editApi,
|
|
|
- delete:deleteApi,
|
|
|
- detail:detailApi,
|
|
|
- import:importApi,
|
|
|
- export:exportApi,
|
|
|
-}
|
|
|
-// #endregion
|
|
|
-
|
|
|
-// #region (page init)
|
|
|
-function init(){
|
|
|
- queryApi()
|
|
|
-}
|
|
|
-init()
|
|
|
-// #endregion
|
|
|
+<script setup lang='ts'>
|
|
|
+
|
|
|
+// 周次可选值 年级可选值 班级可选值 学科可选值
|
|
|
+// 名称 填写值 名称 填写值 名称 填写值 语文 语文
|
|
|
+// 第1周 1 一年级 1 1班 1 数学 数学
|
|
|
+// 第2周 2 二年级 2 2班 2 外语 外语
|
|
|
+// 第3周 3 三年级 3 3班 3 政治 政治
|
|
|
+// 第4周 4 四年级 4 4班 4 物理 物理
|
|
|
+// 第5周 5 五年级 5 5班 5 生物 生物
|
|
|
+// 第6周 6 六年级 6 6班 6 地理 地理
|
|
|
+// 第7周 7 初一/七年级 7 7班 7 历史 历史
|
|
|
+// 第8周 8 初二/八年级 8 8班 8 化学 化学
|
|
|
+// 第9周 9 初三/九年级 9 9班 9 体育 体育
|
|
|
+// 第10周 10 高一 11 10班 10 音乐 音乐
|
|
|
+// 第11周 11 高二 12 11班 11 美术 美术
|
|
|
+// 第12周 12 高三 13 12班 12 信息技术 信息技术
|
|
|
+// 第13周 13 中职一 17 13班 13 科学 科学
|
|
|
+// 第14周 14 中职二 18 14班 14 社会 社会
|
|
|
+// 第15周 15 中职三 19 15班 15 心理与法制 心理与法制
|
|
|
+// ... ... 中职四 21 ... ... 劳动 劳动
|
|
|
+// 第30周 30 大学 20 50班 50 通用技术 通用技术
|
|
|
+// 将上面数据转换成下面的格式
|
|
|
+const tableData = [
|
|
|
+ { zc_k: '第1周', zc_v: 1, nj_k: '一年级', nj_v: 1, bj_k: '1班', bj_v: 1, xk_k: '语文', xk_v: '语文' },
|
|
|
+ { zc_k: '第2周', zc_v: 2, nj_k: '二年级', nj_v: 2, bj_k: '2班', bj_v: 2, xk_k: '数学', xk_v: '数学' },
|
|
|
+ { zc_k: '第3周', zc_v: 3, nj_k: '三年级', nj_v: 3, bj_k: '3班', bj_v: 3, xk_k: '外语', xk_v: '外语' },
|
|
|
+ { zc_k: '第4周', zc_v: 4, nj_k: '四年级', nj_v: 4, bj_k: '4班', bj_v: 4, xk_k: '政治', xk_v: '政治' },
|
|
|
+ { zc_k: '第5周', zc_v: 5, nj_k: '五年级', nj_v: 5, bj_k: '5班', bj_v: 5, xk_k: '物理', xk_v: '物理' },
|
|
|
+ { zc_k: '第6周', zc_v: 6, nj_k: '六年级', nj_v: 6, bj_k: '6班', bj_v: 6, xk_k: '生物', xk_v: '生物' },
|
|
|
+ { zc_k: '第7周', zc_v: 7, nj_k: '初一/七年级', nj_v: 7, bj_k: '7班', bj_v: 7, xk_k: '地理', xk_v: '地理' },
|
|
|
+ { zc_k: '第8周', zc_v: 8, nj_k: '初二/八年级', nj_v: 8, bj_k: '8班', bj_v: 8, xk_k: '历史', xk_v: '历史' },
|
|
|
+ { zc_k: '第9周', zc_v: 9, nj_k: '初三/九年级', nj_v: 9, bj_k: '9班', bj_v: 9, xk_k: '化学', xk_v: '化学' },
|
|
|
+ { zc_k: '第10周', zc_v: 10, nj_k: '高一', nj_v: 11, bj_k: '10班', bj_v: 10, xk_k: '体育', xk_v: '体育' },
|
|
|
+ { zc_k: '第11周', zc_v: 11, nj_k: '高二', nj_v: 12, bj_k: '11班', bj_v: 11, xk_k: '音乐', xk_v: '音乐' },
|
|
|
+ { zc_k: '第12周', zc_v: 12, nj_k: '高三', nj_v: 13, bj_k: '12班', bj_v: 12, xk_k: '美术', xk_v: '美术' },
|
|
|
+ { zc_k: '第13周', zc_v: 13, nj_k: '中职一', nj_v: 17, bj_k: '13班', bj_v: 13, xk_k: '信息技术', xk_v: '信息技术' },
|
|
|
+ { zc_k: '第14周', zc_v: 14, nj_k: '中职二', nj_v: 18, bj_k: '14班', bj_v: 14, xk_k: '科学', xk_v: '科学' },
|
|
|
+ // { zc_k: '第15周', zc_v: 15, nj_k: '中职三', nj_v: 19, bj_k: '15班', bj_v: 15, xk_k: '社会', xk_v: '社会' },
|
|
|
+ { zc_k: '...', zc_v: '...', nj_k: '中职三', nj_v: 21, bj_k: '...', bj_v: '...', xk_k: '心理与法制', xk_v: '心理与法制' },
|
|
|
+ { zc_k: '第30周', zc_v: 30, nj_k: '大学', nj_v: 20, bj_k: '30班', bj_v: 30, xk_k: '劳动', xk_v: '劳动' },
|
|
|
+]
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <div class="card flex-grow flex flex-col">
|
|
|
- <el-form inline :model="queryForm_Data">
|
|
|
- <el-form-item label="关键字"><el-input v-model="queryForm_Data.keyword" clearable /></el-form-item>
|
|
|
- <!-- <el-form-item label="课表类型名称"><el-input v-model="queryForm_Data.xkk_kblx" clearable /></el-form-item>
|
|
|
- <el-form-item label="参数名称"><el-input v-model="queryForm_Data.xkk_csmc" clearable /></el-form-item>
|
|
|
- <el-form-item label="创建人"><el-input v-model="queryForm_Data.xkk_cjr" clearable /></el-form-item> -->
|
|
|
- <el-form-item>
|
|
|
- <el-button @click="handleQueryFormBtn_search" type="primary">搜索</el-button>
|
|
|
- <el-button @click="handleQueryFormBtn_clear" type="warning">清空</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <div class="divider"></div>
|
|
|
- <div>
|
|
|
- <!-- <import-button @success="queryApi" :url="URL_CUT_REF"></import-button>
|
|
|
- <el-button @click="handleTableRowBtn_export" type="success">导出</el-button> -->
|
|
|
- <el-button @click="handleTableRowBtn_add" type="primary">新增</el-button>
|
|
|
- <el-button @click="handleTableRowBtn_delete" type="danger">删除</el-button>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="divider"></div>
|
|
|
- <div class="flex-auto">
|
|
|
- <el-table :data="tableData" @selection-change="handleSelectionChange" v-loading="loading_table"
|
|
|
- element-loading-background="#ffffff70">
|
|
|
- <el-table-column type="selection"></el-table-column><el-table-column type="index" label="序号" width="60" :index="(i: number) => (currentPage - 1) * limit + i + 1" />
|
|
|
- <el-table-column prop="xkk_csmc" label="参数名称" width="auto" show-overflow-tooltip></el-table-column>
|
|
|
- <el-table-column prop="xkk_cjr" label="创建人" width="auto" show-overflow-tooltip></el-table-column>
|
|
|
- <el-table-column prop="xkk_kblx" label="课表类型名称" width="auto" show-overflow-tooltip></el-table-column>
|
|
|
- <el-table-column label="操作" fixed="right">
|
|
|
- <template #default="scope">
|
|
|
- <el-button link :auto-insert-space="false" @click="handleTableColBtn_edit(scope)" type="primary" >编辑</el-button>
|
|
|
- <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_audit(scope)" type="primary" >审核</el-button> -->
|
|
|
- <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_detail(scope)" type="primary" >详情</el-button> -->
|
|
|
- <el-button link :auto-insert-space="false" @click="handleTableColBtn_delete(scope)" type="primary" >删除</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="flex justify-end mt-10 py-4">
|
|
|
- <el-pagination :page-size="limit" v-model:current-page="currentPage" @current-change="handleCurrentChange"
|
|
|
- background layout="total, prev, pager, next" :total="total" />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <el-dialog v-model="dialogVisible_addOrEdit" append-to-body destroy-on-close>
|
|
|
- <el-form :model="dialogForm_Data" ref="dialogForm_Ref_addOrEdit" :rules="dialogForm_Rules_addOrEdit" label-width="120px">
|
|
|
- <el-form-item label="参数名称" prop="xkk_csmc"><el-input v-model="dialogForm_Data.xkk_csmc" clearable /></el-form-item>
|
|
|
- <el-form-item label="创建人" prop="xkk_cjr"><el-input v-model="dialogForm_Data.xkk_cjr" clearable /></el-form-item>
|
|
|
- <el-form-item label="课表类型" prop="xkk_kblx">
|
|
|
- <remote-dictionary-select to="KBLX" v-model="dialogForm_Data.xkk_kblx" clearable />
|
|
|
- </el-form-item>
|
|
|
- <div class="flex justify-center">
|
|
|
- <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_addOrEdit')" type="primary">提交</el-button>
|
|
|
- <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_addOrEdit')" type="default">取消</el-button>
|
|
|
- </div>
|
|
|
- </el-form>
|
|
|
- </el-dialog>
|
|
|
-
|
|
|
- <el-dialog v-model="dialogVisible_audit" append-to-body destroy-on-close>
|
|
|
- <el-form :model="dialogForm_Data" ref="dialogForm_Ref_audit" :rules="dialogForm_Rules_audit" label-width="120px">
|
|
|
- <el-form-item label="状态">
|
|
|
- <el-radio-group v-model="dialogForm_Data[dialogForm_Field_audit.FLAG]">
|
|
|
- <el-radio label="1">通过</el-radio>
|
|
|
- <el-radio label="2">未通过</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </el-form-item>
|
|
|
- <!-- <el-form-item label="原因" v-show="dialogForm_Data[dialogForm_Field_audit.FLAG] === '1'">
|
|
|
- <el-input type="textarea" v-model="dialogForm_Data[dialogForm_Field_audit.REASON]" :rows="5" />
|
|
|
- </el-form-item> -->
|
|
|
- <div class="flex justify-center">
|
|
|
- <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_audit')" type="primary">提交</el-button>
|
|
|
- <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_audit')" type="default">取消</el-button>
|
|
|
- </div>
|
|
|
- </el-form>
|
|
|
- </el-dialog>
|
|
|
-</template>
|
|
|
+ <el-table :data="tableData" style="width: 100%">
|
|
|
+ <el-table-column label="周次可选值">
|
|
|
+ <el-table-column prop="zc_k" label="名称" width="auto" />
|
|
|
+ <el-table-column prop="zc_v" label="填写值" width="auto" />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="年级可选值">
|
|
|
+ <el-table-column prop="nj_k" label="名称" width="auto" />
|
|
|
+ <el-table-column prop="nj_v" label="填写值" width="auto" />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="班级可选值">
|
|
|
+ <el-table-column prop="bj_k" label="名称" width="auto" />
|
|
|
+ <el-table-column prop="bj_v" label="填写值" width="auto" />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="学科可选值">
|
|
|
+ <el-table-column prop="xk_k" label="名称" width="auto" />
|
|
|
+ <el-table-column prop="xk_v" label="填写值" width="auto" />
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+</template>
|
zhuf