hz/fe-manage
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git synced 2025-12-10 11:26:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/develop' into develop

Browse Source
This commit is contained in:
yuping
2022-12-26 16:28:48 +08:00
parent 31fb69331f 337b63bfb4
commit 0f3df97c1e
2 changed files with 746 additions and 420 deletions
Download Patch File Download Diff File Expand all files Collapse all files

363
src/App.vue
View File

@@ -1,22 +1,22 @@
<template> <template>
<div id="container" v-if="!isLogin"> <div id="container" v-if="!isLogin">
<nav-top /> <nav-top />
<div style="display: flex"> <div style="display: flex">
<nav-left /> <nav-left />
<div style="flex: 1; display: flex; flex-direction: column; width: 0"> <div style="flex: 1; display: flex; flex-direction: column; width: 0">
<open-pages /> <open-pages />
<bread-crumb /> <bread-crumb />
<main> <main>
<a-config-provider :locale="zhCN"> <a-config-provider :locale="zhCN">
<router-view /> <router-view />
</a-config-provider> </a-config-provider>
</main> </main>
</div> </div>
</div> </div>
</div> </div>
<div id="container" v-if="isLogin"> <div id="container" v-if="isLogin">
<router-view /> <router-view />
</div> </div>
</template> </template>
<script> <script>
import { computed, defineComponent, ref } from "vue"; import { computed, defineComponent, ref } from "vue";
@@ -32,99 +32,99 @@ import * as api1 from "@/api/index1";
import * as api2 from "@/api/index"; import * as api2 from "@/api/index";
export default defineComponent({ export default defineComponent({
components: { components: {
NavLeft, NavLeft,
NavTop, NavTop,
OpenPages, OpenPages,
BreadCrumb, BreadCrumb,
}, },
setup() { setup() {
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const store = useStore(); const store = useStore();
const isLogin = ref(false); const isLogin = ref(false);
// console.log("router", router.getRoutes(), route); // console.log("router", router.getRoutes(), route);
console.log("版本1.06------------"); console.log("版本1.07------------");
const routes = computed(() => { const routes = computed(() => {
return router.getRoutes().filter((e) => e.meta?.isLink); return router.getRoutes().filter((e) => e.meta?.isLink);
}); });
// watch( // watch(
// () => route.path, // () => route.path,
// () => { // () => {
// route.path === "/login" && (isLogin.value = true); // route.path === "/login" && (isLogin.value = true);
// } // }
// ); // );
const currentRouteName = computed(() => route.name); const currentRouteName = computed(() => route.name);
function init() { function init() {
console.log(store); console.log(store);
getUserInfo(); getUserInfo();
initDict("faceclassPic"); initDict("faceclassPic");
initDict("faceclassClass"); initDict("faceclassClass");
initDict("faceclassScene"); initDict("faceclassScene");
initDict("projectLevel"); initDict("projectLevel");
initDict("projectSys"); initDict("projectSys");
initDict("pathmapPic"); initDict("pathmapPic");
initDict("projectClass"); initDict("projectClass");
initDict("projectPic"); initDict("projectPic");
getMemberInfo(); getMemberInfo();
getOrgTree(); getOrgTree();
} }
async function getMemberInfo() { async function getMemberInfo() {
const list = localStorage.getItem("memberInitInfo"); const list = localStorage.getItem("memberInitInfo");
if (list) { if (list) {
store.commit("SET_MEMBER_INFO", JSON.parse(list)); store.commit("SET_MEMBER_INFO", JSON.parse(list));
return; return;
} }
const memberInitInfo = await api1 const memberInitInfo = await api1
.getMemberInfo({ keyWord: "", pageNo: 1, pageSize: 10 }) .getMemberInfo({ keyWord: "", pageNo: 1, pageSize: 10 })
.then((res) => res.data.data.rows); .then((res) => res.data.data.rows);
store.commit("SET_MEMBER_INFO", memberInitInfo); store.commit("SET_MEMBER_INFO", memberInitInfo);
localStorage.setItem("memberInitInfo", JSON.stringify(memberInitInfo)); localStorage.setItem("memberInitInfo", JSON.stringify(memberInitInfo));
} }
async function getUserInfo() { async function getUserInfo() {
const userInfo = await api2.userInfo(); const userInfo = await api2.userInfo();
store.commit("SET_USER", userInfo.data.data); store.commit("SET_USER", userInfo.data.data);
} }
async function initDict(key, localStory = false) { async function initDict(key, localStory = false) {
let list; let list;
if (localStory) { if (localStory) {
list = localStorage.getItem(key); list = localStorage.getItem(key);
if (list) { if (list) {
store.commit("SET_DICT", { key, data: JSON.parse(list) }); store.commit("SET_DICT", { key, data: JSON.parse(list) });
return; return;
} }
} }
list = await getDictList(key); list = await getDictList(key);
localStory && localStorage.setItem(key, JSON.stringify(list)); localStory && localStorage.setItem(key, JSON.stringify(list));
store.commit("SET_DICT", { key, data: list }); store.commit("SET_DICT", { key, data: list });
} }
const getDictList = (param) => const getDictList = (param) =>
api1 api1
.getDict({ .getDict({
pageNo: 1, pageNo: 1,
pageSize: 20, pageSize: 20,
setCode: param, setCode: param,
}) })
.then((res) => res.data.data.rows); .then((res) => res.data.data.rows);
//获取组织树 //获取组织树
const getOrgTree = () => { const getOrgTree = () => {
api.getOrgTreeInfo().then((res) => { api.getOrgTreeInfo().then((res) => {
store.commit("getOrgtreeList", res.data.data); store.commit("getOrgtreeList", res.data.data);
}); });
}; };
init(); init();
return { return {
isLogin, isLogin,
routes, routes,
name: currentRouteName, name: currentRouteName,
zhCN, zhCN,
}; };
}, },
}); });
</script> </script>
<style lang="scss"> <style lang="scss">
@@ -151,88 +151,89 @@ export default defineComponent({
//} //}
#app { #app {
// font-family: MicrosoftYaHei, Microsoft YaHei, Avenir, Helvetica, Arial, // font-family: MicrosoftYaHei, Microsoft YaHei, Avenir, Helvetica, Arial,
// sans-serif; // sans-serif;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
Microsoft YaHei, Arial, sans-serif; Microsoft YaHei, Arial, sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
color: #2c3e50; color: #2c3e50;
height: 100%; height: 100%;
} }
#container { #container {
margin: 0; margin: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
min-width: 1000px; min-width: 1000px;
min-height: 100%; min-height: 100%;
background-color: rgba(245, 247, 250, 1); background-color: rgba(245, 247, 250, 1);
main { main {
height: 0; height: 0;
flex: 1 1 auto; flex: 1 1 auto;
// flex-shrink: 0; // flex-shrink: 0;
display: flex; display: flex;
overflow-y: auto; overflow-y: auto;
// display: flex; // display: flex;
// flex: 1 1 auto; // flex: 1 1 auto;
width: calc(100% - 40px); width: calc(100% - 40px);
// margin-bottom: 20px; // margin-bottom: 20px;
margin: 0px 20px 20px 20px; margin: 0px 20px 20px 20px;
box-sizing: border-box; box-sizing: border-box;
background: #ffffff; background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07); box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
} }
.cus-btn { .cus-btn {
width: 100%; width: 100%;
height: 40px; height: 40px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-right: 16px; margin-right: 16px;
border: 1px solid #4ea6ff; border: 1px solid #4ea6ff;
border-radius: 8px; border-radius: 8px;
background: #4ea6ff; background: #4ea6ff;
cursor: pointer; cursor: pointer;
color: #fff; color: #fff;
} }
.white { .white {
background: #fff; background: #fff;
color: #4ea6ff; color: #4ea6ff;
} }
.cus-input { .cus-input {
height: 40px; height: 40px;
border-radius: 8px; border-radius: 8px;
} }
.cus-select {
height: 40px;
border-radius: 8px;
}
// @media screen and (max-width: 1366px) { .cus-select {
// .cmMain { height: 40px;
// width: 750px; border-radius: 8px;
// } }
// }
// @media screen and (min-width: 1367px) and (max-width: 1680px) { // @media screen and (max-width: 1366px) {
// .cmMain { // .cmMain {
// width: 1010px; // width: 750px;
// } // }
// } // }
// @media screen and (min-width: 1681px) and (max-width: 1920px) { // @media screen and (min-width: 1367px) and (max-width: 1680px) {
// .cmMain { // .cmMain {
// width: 1270px; // width: 1010px;
// } // }
// } // }
// @media screen and (min-width: 1921px) { // @media screen and (min-width: 1681px) and (max-width: 1920px) {
// .cmMain { // .cmMain {
// width: 1270px; // width: 1270px;
// } // }
// } // }
// @media screen and (min-width: 1921px) {
// .cmMain {
// width: 1270px;
// }
// }
} }
</style> </style>

803
src/components/student/TableStudent.vue
View File

@@ -1,92 +1,73 @@
<template> <template>
<div> <div>
<a-row <a-row type="flex" gutter="12" style="padding-left: 20px; margin-right: 0px">
type="flex" <a-col>
gutter="12" <a-form-item title="姓名：">
style="padding-left: 20px; margin-right: 0px" <a-input class="cus-input" v-model:value="tableParam.studentName" placeholder="请输入姓名" />
> </a-form-item>
<a-col> </a-col>
<a-form-item title="姓名：" > <a-col>
<a-input <a-button class="cus-btn" style="width: 100px" @click="getStuList">
class="cus-input" <template #icon>
v-model:value="tableParam.studentName" <img style="margin-right: 10px" src="../../assets/images/courseManage/search0.png" /></template>
placeholder="请输入姓名" 搜索
/> </a-button>
</a-form-item> </a-col>
</a-col> <a-col :span="2">
<a-col> <a-button class="cus-btn white" style="width: 100px" @click="reset">重置
<a-button class="cus-btn" style="width: 100px" @click="getStuList"> </a-button>
<template #icon> </a-col>
<img </a-row>
style="margin-right: 10px"
src="../../assets/images/courseManage/search0.png"
/></template>
搜索
</a-button>
</a-col>
<a-col :span="2">
<a-button class="cus-btn white" style="width: 100px" @click="reset"
>重置
</a-button>
</a-col>
</a-row>
<a-row <a-row type="flex" gutter="12" style="padding-left: 20px; margin-right: 0px">
type="flex" <a-col :span="1.5">
gutter="12" <CommonStudent :type="type" :id="id" @finash="submitCall" :stage="stage">
style="padding-left: 20px; margin-right: 0px" <a-button class="cus-btn">
> <template #icon><img style="margin-right: 10px"
<a-col :span="1.5"> src="../../assets/images/courseManage/add0.png" /></template>
<CommonStudent 添加学员
:type="type" </a-button>
:id="id" </CommonStudent>
@finash="submitCall" </a-col>
:stage="stage" <a-col :span="1.5">
> <a-button class="cus-btn white" @click="bathDel">
<a-button class="cus-btn"> <template #icon><img style="margin-right: 10px" src="../../assets/images/projectadd/delete.png" /></template>
<template #icon 批量删除
><img </a-button>
style="margin-right: 10px" </a-col>
src="../../assets/images/courseManage/add0.png" <a-col :span="1.5" v-if="type === 2">
/></template> <a-button class="cus-btn white" @click="showChangeModal">
添加学员 <template #icon></template>
</a-button> 批量调整关卡
</CommonStudent> </a-button>
</a-col> </a-col>
<a-col :span="1.5"> </a-row>
<a-button class="cus-btn white" @click="bathDel"> <div style="margin-top: 20px">
<template #icon <a-table :columns="tablecolumns" :data-source="tableData.list" :pagination="stuPagination"
><img :loading="tableData.loading" row-key="id" :row-selection="stuRowSelection">
style="margin-right: 10px" <template #action="{ record }">
src="../../assets/images/projectadd/delete.png" <div style="display:flex;justify-content: center;align-items: center;">
/></template> <!-- <div v-if="props.type == 1" @click="excellentStudent(record)"
批量删除 style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;">
</a-button> 优秀学员
</a-col> </div>
<a-col :span="1.5" v-if="type === 2">
<a-button class="cus-btn white" @click="showChangeModal"> <div @click="seeStudent(record)"
<template #icon></template> style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;">
批量调整关卡 查看
</a-button> </div>
</a-col>
</a-row> <div v-if="props.type == 2" @click="seeStudent(record)"
<div style="margin-top: 20px"> style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;">
<a-table 调整
:columns="tablecolumns" </div> -->
:data-source="tableData.list"
:pagination="stuPagination" <div @click="del(record.id)"
:loading="tableData.loading" style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;">
row-key="id" 删除
:row-selection="stuRowSelection" </div>
> </div>
<template #action="{ record }"> <!-- <a-row gutter="12">
<div
@click="del(record.id)"
style="color: #4ea6ff; font-size: 14px; text-align: center;margin-left: 20px;cursor: pointer;"
>
删除
</div>
<!-- <a-row gutter="12">
<a-col> <a-col>
<slot name="extension" v-bind:data="{ record }"></slot> <slot name="extension" v-bind:data="{ record }"></slot>
</a-col> </a-col>
@@ -104,221 +85,565 @@
</div> </div>
</a-col> </a-col>
</a-row> --> </a-row> -->
</template> </template>
</a-table> </a-table>
</div> </div>
</div> </div>
<!-- 批量调整关卡弹窗 --> <!-- 批量调整关卡弹窗 -->
<ChangeLevelModal v-model:visiblene="visiblene" :stage="stage" :ids="stuSelectKeys" @finash="submitCall"/> <ChangeLevelModal v-model:visiblene="visiblene" :stage="stage" :ids="stuSelectKeys" @finash="submitCall" />
<!-- 批量调整关卡弹窗 --> <!-- 批量调整关卡弹窗 -->
<!-- 取消学员弹窗 -->
<div>
<a-modal v-model:visible="canclestu" :footer="null" :closable="close" wrapClassName="canclestu" centered="true"
@cancel="closeModal1">
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon1"></div>
<span>提示</span>
</div>
<div class="body">
<span>您是否授予此学员优秀学员称号？</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1" @click="cancelyou">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="closeModal1">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
<!-- 取消学员弹窗 -->
<!-- 优秀学员弹窗 -->
<div>
<a-modal v-model:visible="canclestu1" :footer="null" :closable="close" wrapClassName="canclestu1" centered="true">
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon1"></div>
<span>提示</span>
</div>
<div class="body">
<span>您是否取消此学员优学员称号？</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="cancelcanyou">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="closeModal3">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
<!-- 查看学员 传入查看学员的id-->
<see-stu v-model:Seevisible="Seevisible" v-model:checkStuId="checkStuId" v-model:projectId="projectId" />
</template> </template>
<script setup> <script setup>
import { computed, defineProps, onMounted, ref, watch } from "vue"; import { computed, defineProps, onMounted, ref, watch } from "vue";
import { delStudentList, getStuPage } from "@/api/index1"; import { delStudentList, getStuPage } from "@/api/index1";
import CommonStudent from "@/components/student/CommonStudent"; import CommonStudent from "@/components/student/CommonStudent";
import ChangeLevelModal from "./ChangeLevelModal.vue"; import ChangeLevelModal from "./ChangeLevelModal.vue";
import {message} from "ant-design-vue"; import { message } from "ant-design-vue";
// import { topStudent } from "../../api/indexProjStu";
import SeeStu from "../../components/drawers/SeeStu";
const props = defineProps({ const props = defineProps({
type: Number, type: Number,
id: String, id: String,
columns: { columns: {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
stage: { stage: {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
visable: { visable: {
type: Boolean, type: Boolean,
default:false, default: false,
}, },
}); });
const tablecolumns = ref([ const tablecolumns = ref([
{ {
title: "姓名", title: "姓名",
dataIndex: "studentName", dataIndex: "studentName",
key: "studentName", key: "studentName",
width: "8%", width: "8%",
align: "left", align: "left",
className: "h", className: "h",
}, },
{ {
title: "工号", title: "工号",
dataIndex: "studentUserNo", dataIndex: "studentUserNo",
key: "studentUserNo", key: "studentUserNo",
width: "20%", width: "20%",
align: "center", align: "center",
className: "h", className: "h",
ellipsis: true, ellipsis: true,
}, },
{ {
title: "部门", title: "部门",
dataIndex: "studentDepartName", dataIndex: "studentDepartName",
key: "studentDepartName", key: "studentDepartName",
width: "15%", width: "15%",
align: "center", align: "center",
className: "h", className: "h",
ellipsis: true, ellipsis: true,
}, },
{ {
title: "加入方式", title: "加入方式",
dataIndex: "source", dataIndex: "source",
key: "source", key: "source",
width: 100, width: 100,
align: "center", align: "center",
customRender: ({ record: { source } }) => customRender: ({ record: { source } }) =>
({ 1: "快速添加", 2: "组织", 3: "受众" }[source]), ({ 1: "快速添加", 2: "组织", 3: "受众" }[source]),
}, },
...props.columns, ...props.columns,
{ {
title: "操作", title: "操作",
dataIndex: "operation", dataIndex: "operation",
key: "operation", key: "operation",
width: "20%", width: "20%",
align: "center", align: "center",
slots: { customRender: "action" }, slots: { customRender: "action" },
}, },
]); ]);
const tableParam = ref({ const tableParam = ref({
studentName: "", studentName: "",
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 10,
type: props.type, type: props.type,
pid: props.id, pid: props.id,
}); });
const stuSelectKeys = ref([]); const stuSelectKeys = ref([]);
const tableData = ref({ const tableData = ref({
list: [], list: [],
total: 0, total: 0,
loading: false, loading: false,
}); });
const stuRowSelection = computed(() => ({ const stuRowSelection = computed(() => ({
columnWidth: 20, columnWidth: 20,
selectedRowKeys: stuSelectKeys.value, selectedRowKeys: stuSelectKeys.value,
onChange: onStuSelectChange, onChange: onStuSelectChange,
preserveSelectedRowKeys: true, preserveSelectedRowKeys: true,
})); }));
onMounted(() => { onMounted(() => {
getStuList(); getStuList();
}); });
watch(props, () => { watch(props, () => {
if(!props.visable){ if (!props.visable) {
stuSelectKeys.value =[]; stuSelectKeys.value = [];
console.log("关闭了"); console.log("关闭了");
} }
console.log("props.visable",props.visable) console.log("props.visable", props.visable)
tableParam.value.pid = props.id; tableParam.value.pid = props.id;
getStuList(); getStuList();
}); });
function onStuSelectChange(e) { function onStuSelectChange(e) {
stuSelectKeys.value = e; stuSelectKeys.value = e;
} }
const stuPagination = computed(() => ({ const stuPagination = computed(() => ({
total: tableData.value.total, total: tableData.value.total,
showSizeChanger: false, showSizeChanger: false,
current: tableParam.value.pageNo, current: tableParam.value.pageNo,
pageSize: tableParam.value.pageSize, pageSize: tableParam.value.pageSize,
onChange: changePagination, onChange: changePagination,
})); }));
function changePagination(page) { function changePagination(page) {
tableParam.value.pageNo = page; tableParam.value.pageNo = page;
getStuList(); getStuList();
} }
function getStuList() { function getStuList() {
tableData.value.loading = true; tableData.value.loading = true;
getStuPage(tableParam.value).then((res) => { getStuPage(tableParam.value).then((res) => {
console.log("学员管理-获取学员", res.data); console.log("学员管理-获取学员", res.data);
tableData.value.total = res.data.data.total; tableData.value.total = res.data.data.total;
tableData.value.list = res.data.data.records; tableData.value.list = res.data.data.records;
tableData.value.loading = false; tableData.value.loading = false;
}); });
} }
function reset() { function reset() {
tableParam.value.studentName=""; tableParam.value.studentName = "";
getStuList(); getStuList();
} }
function bathDel() { function bathDel() {
if( stuSelectKeys.value && if (stuSelectKeys.value &&
stuSelectKeys.value.length === 0){ stuSelectKeys.value.length === 0) {
message.destroy(); message.destroy();
return message.warning("请先选中学员"); return message.warning("请先选中学员");
} }
stuSelectKeys.value && stuSelectKeys.value &&
stuSelectKeys.value.length && stuSelectKeys.value.length &&
delStudentList({ delStudentList({
ids: stuSelectKeys.value, ids: stuSelectKeys.value,
}).then(() => { }).then(() => {
getStuList(); getStuList();
}); });
} }
function del(id) { function del(id) {
id && id &&
delStudentList({ delStudentList({
ids: [id], ids: [id],
}).then(() => { }).then(() => {
getStuList(); getStuList();
}); });
} }
function submitCall(flag) { function submitCall(flag) {
tableData.value.loading = true; tableData.value.loading = true;
flag && getStuList(); flag && getStuList();
} }
// 调整关卡; // 调整关卡;
const visiblene = ref(false); const visiblene = ref(false);
const showChangeModal = () => { const showChangeModal = () => {
if(!stuSelectKeys.value.length){ if (!stuSelectKeys.value.length) {
message.error("请选择学员") message.error("请选择学员")
return return
} }
visiblene.value = true; visiblene.value = true;
}; };
// 优秀学员
const canclestu = ref(false)
const canclestu1 = ref(false)
// function excellentStudent(record) {
// console.log(record)
// if (record.topFlag) {
// // 当该名学员是优秀学员时候
// canclestu1.value = true;
// } else {
// // 当该名学员不是优秀学员时候
// canclestu.value = true;
// }
// }
// 优秀学员-弹框关闭
function cancelyou() {
canclestu.value = false;
}
// 优秀学员-设置优秀学员
function closeModal1() {
canclestu.value = false;
// 授予优秀学员操作
}
// 取消优秀学员-弹框关闭
function cancelcanyou() {
canclestu1.value = false;
}
// 取消优秀学员-取消优秀学员
function closeModal3() {
canclestu1.value = false;
// 取消优秀学员操作
}
// 查看学员
const Seevisible = ref(false)
const checkStuId = ref(null)
const projectId = ref(null)
// function seeStudent(record) {
// console.log(record)
// checkStuId.value = record.id;
// projectId.value = props.id;
// Seevisible.value = true;
// console.log(props.type)
// console.log(checkStuId.value, projectId.value)
// }
</script> </script>
<style> <style>
.studentopea1 { .studentopea1 {
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
color: #387df7; color: #387df7;
line-height: 22px; line-height: 22px;
padding-right: 8px; padding-right: 8px;
border-right: 1px solid #e9e9e9; border-right: 1px solid #e9e9e9;
cursor: pointer; cursor: pointer;
} }
.cus-btn { .cus-btn {
width: 100%; width: 100%;
height: 40px; height: 40px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-right: 16px; margin-right: 16px;
border: 1px solid #4ea6ff; border: 1px solid #4ea6ff;
border-radius: 8px; border-radius: 8px;
background: #4ea6ff; background: #4ea6ff;
cursor: pointer; cursor: pointer;
color: #fff; color: #fff;
} }
.white { .white {
background: #fff; background: #fff;
color: #4ea6ff; color: #4ea6ff;
} }
.cus-input { .cus-input {
height: 40px; height: 40px;
border-radius: 8px; border-radius: 8px;
}
.del_header {
position: absolute;
width: calc(100%);
height: 40px;
background: linear-gradient(rgba(78, 166, 255, 0.2) 0%, rgba(78, 166, 255, 0) 100%);
}
.delete {
z-index: 9999;
width: 424px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
position: absolute;
left: 50%;
top: 10%;
transform: translate(-50%, -50%);
}
.body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
}
.del_main {
width: 100%;
position: relative;
}
.del_main>.header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
}
.del-icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/notice.png);
background-size: 100% 100%;
}
.icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
background-size: 100% 100%;
}
.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
}
.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
}
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
.ant-modal-close {
margin-right: 18px;
margin-top: 5px;
}
.ant-modal-content {
width: 424px !important;
height: 258px !important;
}
.ant-modal-body {
width: 424px !important;
height: 258px !important;
padding: 0 !important;
position: relative;
top: 105px !important;
}
.ant-modal-body>.delete {
z-index: 999;
width: 424px;
height: 258px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
}
.ant-modal-body>.del_header {
position: absolute;
width: calc(100%);
height: 68px;
background: linear-gradient(rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%);
}
.ant-modal-body>.del_main {
width: 100%;
position: relative;
}
.ant-modal-body>.del_main>.header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
}
.ant-modal-body>.del_main>.header>.icon1 {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
background-size: 100% 100%;
}
.ant-modal-body>.del_main>.header>.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
.ant-modal-body>.del_main>.body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
position: relative;
}
.ant-modal-body>.del_main>.body>.back {
position: absolute;
top: 30px;
font-size: 12px;
font-weight: 400;
color: #666666;
}
.ant-modal-body>.del_main>.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
}
.ant-modal-body>.del_main>.del_btnbox>.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer;
}
.ant-modal-body>.del_main>.del_btnbox>.del_btn>.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
.ant-modal-body>.del_main>.del_btnbox>.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
margin-right: 14px;
}
.ant-modal-body>.del_main>.del_btnbox>.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
.canclestu>.ant-modal {
width: 424px !important;
height: 258px !important;
} }
</style> </style>