|
@@ -1,5 +1,4 @@
|
|
|
<template>
|
|
|
-
|
|
|
<!-- 模态框 -->
|
|
|
<n-modal v-model:show="showModal" block-scroll close-on-esc trap-focus>
|
|
|
<n-card style="width: 600px" title="添加班级" :bordered="false" size="huge" role="dialog" aria-modal="true">
|
|
@@ -20,6 +19,24 @@
|
|
|
</n-card>
|
|
|
</n-modal>
|
|
|
|
|
|
+ <n-modal v-model:show="showModalUpdate" block-scroll close-on-esc trap-focus>
|
|
|
+ <n-card style="width: 600px" title="更新" :bordered="false" size="huge" role="dialog" aria-modal="true">
|
|
|
+ <n-form ref="formRefUpdate" :model="modelUpdateRef" :rules="rules">
|
|
|
+ <n-form-item path="name" label="班级名称">
|
|
|
+ <n-input v-model:value="modelUpdateRef.name" @keydown.enter.prevent />
|
|
|
+ </n-form-item>
|
|
|
+ <n-row :gutter="[0, 24]">
|
|
|
+ <n-col :span="24">
|
|
|
+ <div style="display: flex; justify-content: flex-end">
|
|
|
+ <n-button :disabled="modelUpdateRef.name === null" round type="primary" @click="handleUpdateClick">
|
|
|
+ 提交
|
|
|
+ </n-button>
|
|
|
+ </div>
|
|
|
+ </n-col>
|
|
|
+ </n-row>
|
|
|
+ </n-form>
|
|
|
+ </n-card>
|
|
|
+ </n-modal>
|
|
|
<n-grid x-gap="300" :cols="2">
|
|
|
<n-gi>
|
|
|
<n-input placeholder="搜索">
|
|
@@ -39,29 +56,32 @@
|
|
|
<div>
|
|
|
<n-data-table :bordered="false" :single-line="false" :columns="columns" :data="data" :pagination="pagination" />
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- 删除弹出确定 -->
|
|
|
+ <!-- <n-popconfirm
|
|
|
+ @positive-click="handlePositiveClick"
|
|
|
+ @negative-click="handleNegativeClick"
|
|
|
+ >
|
|
|
+ <template #trigger>
|
|
|
+ <n-button>引用</n-button>
|
|
|
+ </template>
|
|
|
+ 一切都将一去杳然,任何人都无法将其捕获。
|
|
|
+ </n-popconfirm> -->
|
|
|
</template>
|
|
|
<script lang="ts">
|
|
|
import {
|
|
|
FormInst,
|
|
|
FormItemInst,
|
|
|
FormItemRule,
|
|
|
- FormRules
|
|
|
+ FormRules,
|
|
|
+ messageDark,
|
|
|
} from 'naive-ui'
|
|
|
import { FlashOutline } from '@vicons/ionicons5'
|
|
|
-import { h, defineComponent } from 'vue'
|
|
|
-import { useMessage } from 'naive-ui'
|
|
|
-import { NButton } from 'naive-ui'
|
|
|
+import { h, defineComponent, ref, onMounted } from 'vue'
|
|
|
+import { NButton, useMessage } from 'naive-ui'
|
|
|
import type { DataTableColumns } from 'naive-ui'
|
|
|
-import { selectTotal, addClass,deleteClass } from '~/src/service/api/lesson'
|
|
|
-import { ref } from 'vue'
|
|
|
-import {
|
|
|
- onBeforeMount,
|
|
|
- onMounted,
|
|
|
- onBeforeUpdate,
|
|
|
- onUpdated,
|
|
|
- onBeforeUnmount,
|
|
|
- onUnmounted,
|
|
|
-} from 'vue'
|
|
|
+import { selectTotal, addClass, deleteClass, updateClass } from '~/src/service/api/lesson'
|
|
|
+import { setTimeout } from 'timers/promises'
|
|
|
//获取所有班级类
|
|
|
type RowData = {
|
|
|
id: number
|
|
@@ -72,14 +92,27 @@ type RowData = {
|
|
|
createUid?: number
|
|
|
modifyTime: string
|
|
|
disabled?: string
|
|
|
+ tag?: []
|
|
|
}
|
|
|
const tableData = ref([]);
|
|
|
-async function getTableData() {
|
|
|
+function getTableData() {
|
|
|
selectTotal().then(r => {
|
|
|
tableData.value = r.data;
|
|
|
+ // console.log(tableData.value);
|
|
|
+
|
|
|
+ //由于不能自定义添加标签,所以我们给数据添加一个tags来进行遍历按钮数据
|
|
|
+ // let obj= Object.assign(tableData.value, { tags: ['删除', '更新'] });
|
|
|
+ for (let i = 0; i < tableData.value.length; i++) {
|
|
|
+ // console.log(tableData.value[i]);
|
|
|
+ Object.assign(tableData.value[i], { tags: ['删除', '更新'] });
|
|
|
+ }
|
|
|
+ // console.log(tableData.value);
|
|
|
+
|
|
|
})
|
|
|
-}
|
|
|
|
|
|
+
|
|
|
+}
|
|
|
+let showModalUpdate = ref(false);
|
|
|
const createColumns = ({
|
|
|
sendMail
|
|
|
}: {
|
|
@@ -104,24 +137,44 @@ const createColumns = ({
|
|
|
},
|
|
|
{
|
|
|
title: '操作',
|
|
|
- key: 'actions',
|
|
|
+ key: 'tags',
|
|
|
render(row) {
|
|
|
- return h(
|
|
|
- NButton,
|
|
|
- {
|
|
|
- size: 'small',
|
|
|
- onClick: () => sendMail(row)
|
|
|
- },
|
|
|
- { default: () => '删除' }
|
|
|
- )
|
|
|
+ const tags = row.tags.map((tagKey) => {
|
|
|
+ return h(
|
|
|
+ NButton,
|
|
|
+ {
|
|
|
+ onClick: async () => {
|
|
|
+ if (tagKey == "删除") {
|
|
|
+ deleteData(row.id);
|
|
|
+ sendMail(tagKey);
|
|
|
+ }
|
|
|
+ else if (tagKey == "更新") {
|
|
|
+
|
|
|
+ showModalUpdate.value = true;
|
|
|
+ // UpdateClass(row);
|
|
|
+
|
|
|
+ UpdateClassParams = row;
|
|
|
+ // sendMail(tagKey);
|
|
|
+ modelUpdateRef.value.name = row.name;
|
|
|
+
|
|
|
+ }
|
|
|
+ // deleteData(row.id);
|
|
|
+ // console.log(row, tagKey);
|
|
|
+ // getTableData();
|
|
|
+ // sendMail(tagKey);
|
|
|
+
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ default: () => tagKey
|
|
|
+ }
|
|
|
+ )
|
|
|
+ })
|
|
|
+ return tags
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
}
|
|
|
-//---|
|
|
|
-// deleteClass().then(r=>{
|
|
|
-// console.log(r);
|
|
|
-// })
|
|
|
|
|
|
//增加班级类
|
|
|
type easEduClass = {
|
|
@@ -145,33 +198,78 @@ let params: easEduClass = {
|
|
|
createUid: 0,
|
|
|
disabled: null
|
|
|
}
|
|
|
-async function AddClassInter(params) {
|
|
|
+function AddClassInter(params) {
|
|
|
if (params != "") {
|
|
|
addClass(params).then(r => {
|
|
|
console.log(r);
|
|
|
})
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
//|
|
|
|
//删除班级
|
|
|
+function deleteData(id: number) {
|
|
|
+ deleteClass(id).then(r => {
|
|
|
+ console.log(r);
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+//!更新班级类
|
|
|
+let UpdateClassParams = {
|
|
|
+ id: 0,
|
|
|
+ name: "",
|
|
|
+ manageId: 0,
|
|
|
+ assistantId: 0,
|
|
|
+ createTime: "",
|
|
|
+ modifyTime: "",
|
|
|
+ createUid: "",
|
|
|
+ disabled: ""
|
|
|
+}
|
|
|
+//获取时间函数
|
|
|
+function getLocalTime() {
|
|
|
+ let date = new Date();
|
|
|
+ const year = date.getFullYear();
|
|
|
+ const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需要加1并补0
|
|
|
+ const day = String(date.getDate()).padStart(2, '0'); // 日需要补0
|
|
|
+ const hours = String(date.getHours()).padStart(2, '0');
|
|
|
+ const minutes = String(date.getMinutes()).padStart(2, '0');
|
|
|
+ const seconds = String(date.getSeconds()).padStart(2, '0');
|
|
|
+ return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
|
|
+}
|
|
|
+const modelUpdateRef = ref({
|
|
|
+ name: null,
|
|
|
+})
|
|
|
|
|
|
|
|
|
+function UpdateClass(params: UpdateClassParams) {
|
|
|
+ // updateClass(params);
|
|
|
+ //更改时间为获取当前时间
|
|
|
+ params.modifyTime = getLocalTime();
|
|
|
+ // console.log(params.modifyTime);//2023-08-09 09:31:26
|
|
|
+
|
|
|
+}
|
|
|
export default defineComponent({
|
|
|
|
|
|
setup() {
|
|
|
- onMounted(async() => {
|
|
|
+ onMounted(async () => {
|
|
|
getTableData();
|
|
|
});
|
|
|
+
|
|
|
const showModal = ref(false);
|
|
|
const formRef = ref<FormInst | null>(null)
|
|
|
+ const formRefUpdate = ref<FormInst | null>(null)
|
|
|
const rPasswordFormItemRef = ref<FormItemInst | null>(null)
|
|
|
const message = useMessage()
|
|
|
+ const getDeleteInfo = () => {
|
|
|
+ console.log(message);
|
|
|
+ message.success("删除成功")
|
|
|
+ }
|
|
|
const modelRef = ref({
|
|
|
name: null,
|
|
|
})
|
|
|
+
|
|
|
const rules: FormRules = {
|
|
|
name: [
|
|
|
{
|
|
@@ -186,10 +284,35 @@ export default defineComponent({
|
|
|
}
|
|
|
],
|
|
|
}
|
|
|
+ async function handleUpdateClick() {
|
|
|
+ // console.log(modelUpdateRef.value.name);
|
|
|
+ //点击更新按钮之后
|
|
|
+ UpdateClassParams.name = modelUpdateRef.value.name;
|
|
|
+ UpdateClassParams.modifyTime = getLocalTime();
|
|
|
+ console.log(UpdateClassParams);
|
|
|
+ updateClass(UpdateClassParams).then(r => {
|
|
|
+ console.log(r);
|
|
|
+ })
|
|
|
+ message.success('更新成功');
|
|
|
+ showModalUpdate.value=!showModalUpdate;
|
|
|
+
|
|
|
+ }
|
|
|
return {
|
|
|
+ handleUpdateClick,
|
|
|
+ showModalUpdate,
|
|
|
+ handlePositiveClick() {
|
|
|
+ message.info('是的')
|
|
|
+ },
|
|
|
+ handleNegativeClick() {
|
|
|
+ message.info('并不')
|
|
|
+ },
|
|
|
+ message,
|
|
|
+ getDeleteInfo,
|
|
|
formRef,
|
|
|
+ formRefUpdate,
|
|
|
rPasswordFormItemRef,
|
|
|
model: modelRef,
|
|
|
+ modelUpdateRef,
|
|
|
rules,
|
|
|
async handleValidateButtonClick() {
|
|
|
//点击添加
|
|
@@ -209,7 +332,7 @@ export default defineComponent({
|
|
|
data: tableData,
|
|
|
columns: createColumns({
|
|
|
sendMail(rowData) {
|
|
|
- message.info('send mail to ' + rowData.name)
|
|
|
+ message.success(`${rowData}成功`)
|
|
|
}
|
|
|
}),
|
|
|
pagination: {
|