删除无用页面
This commit is contained in:
parent
2839cfed41
commit
ac5f95d248
@ -1,456 +0,0 @@
|
||||
<template>
|
||||
<div class="login-container">
|
||||
<div class="login-container-title">{{$t('login.title')}}</div>
|
||||
<img style=" position: absolute;
|
||||
top: 20px;
|
||||
left: 40px;
|
||||
width: 200px;" src="@/assets/login/uplogo.png" alt="">
|
||||
<!-- <div class="login-container-left">
|
||||
<el-image
|
||||
:src="loginImg"
|
||||
fit="cover"
|
||||
/>
|
||||
</div> -->
|
||||
<div class="login-container-content">
|
||||
<el-form
|
||||
ref="loginFormRef"
|
||||
:model="loginData"
|
||||
:rules="loginRules"
|
||||
class="login-form"
|
||||
auto-complete="on"
|
||||
label-position="left"
|
||||
>
|
||||
<!-- <div class="mb-[30px]">
|
||||
<img src="@/assets/login/logo.png" style="display: inline-block;" alt="">
|
||||
</div> -->
|
||||
<div class="title-container">
|
||||
<h3 class="title">欢迎登录!</h3>
|
||||
</div>
|
||||
|
||||
<el-form-item prop="username" style="margin-bottom: 45px;">
|
||||
<!-- <span class="svg-container">
|
||||
<img src="@/assets/login/username.png" alt="">
|
||||
</span> -->
|
||||
<el-input
|
||||
ref="username"
|
||||
clearable
|
||||
v-model="loginData.username"
|
||||
:placeholder="$t('login.username')"
|
||||
name="username"
|
||||
type="text"
|
||||
tabindex="1"
|
||||
auto-complete="on"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-tooltip
|
||||
:disabled="capslockTooltipDisabled"
|
||||
content="Caps lock is On"
|
||||
placement="right"
|
||||
>
|
||||
<el-form-item prop="password" style="margin-bottom:20px;">
|
||||
<!-- <span class="svg-container">
|
||||
<img src="@/assets/login/password.png" alt="">
|
||||
</span> -->
|
||||
<el-input
|
||||
ref="passwordRef"
|
||||
:key="passwordType"
|
||||
v-model="loginData.password"
|
||||
:type="passwordType"
|
||||
:placeholder="$t('login.password')"
|
||||
name="password"
|
||||
tabindex="2"
|
||||
auto-complete="on"
|
||||
@keyup="checkCapslock"
|
||||
@blur="capslockTooltipDisabled = true"
|
||||
@keyup.enter="handleLogin"
|
||||
/>
|
||||
<span
|
||||
class="show-pwd"
|
||||
@click="showPwd"
|
||||
>
|
||||
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
|
||||
</span>
|
||||
</el-form-item>
|
||||
</el-tooltip>
|
||||
<div style="text-align: left;margin-bottom: 40px;">
|
||||
<el-checkbox
|
||||
v-model="remember"
|
||||
:label="$t('login.remember')"
|
||||
size="large"
|
||||
/>
|
||||
</div>
|
||||
<el-button
|
||||
size="default"
|
||||
:loading="loading"
|
||||
type="primary"
|
||||
style="width: 100%;height: 50px; margin-bottom: 10px;background-color: rgb(8,186,124);border: none;border-radius: 100px;"
|
||||
@click.prevent="handleLogin"
|
||||
>{{ $t('login.login') }}
|
||||
</el-button>
|
||||
</el-form>
|
||||
|
||||
<div
|
||||
v-if="showCopyright == true"
|
||||
class="copyright"
|
||||
>
|
||||
<p>{{ $t('login.copyright') }}</p>
|
||||
<p>{{ $t('login.icp') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="login-containe-footer">
|
||||
<div style="font-size: 16px;">杭州明眸慧眼科技有限公司</div>
|
||||
<div style="margin-top: 5px;">浙江省杭州市余杭区祥茂路166号华滋科欣设计创意园4号楼</div>
|
||||
<div style="margin-top: 5px;">400-6588695</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, toRefs, watch, nextTick } from 'vue';
|
||||
import loginImg from '@/assets/images/u287.gif';
|
||||
import { getCaptcha } from '@/api/auth';
|
||||
|
||||
// 组件依赖
|
||||
import { ElForm, ElInput } from 'element-plus';
|
||||
import router from '@/router';
|
||||
import SvgIcon from '@/components/SvgIcon/index.vue';
|
||||
import Cookies from 'js-cookie';
|
||||
// API依赖
|
||||
import { useRoute } from 'vue-router';
|
||||
import { LoginData } from '@/api/auth/types';
|
||||
|
||||
//密码加密
|
||||
import { encrypt,decrypt } from '@/utils/rsaEncrypt';
|
||||
|
||||
// 状态管理依赖
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
|
||||
// 国际化
|
||||
import { useI18n } from 'vue-i18n';
|
||||
const { t } = useI18n();
|
||||
|
||||
const userStore = useUserStore();
|
||||
const route = useRoute();
|
||||
// 图片验证码
|
||||
const codeUrl = ref('');
|
||||
|
||||
const loginFormRef = ref(ElForm);
|
||||
const passwordRef = ref(ElInput);
|
||||
// 记住密码
|
||||
let remember = ref(false);
|
||||
|
||||
const state = reactive({
|
||||
redirect: '',
|
||||
loginData: {
|
||||
username: 'admin',
|
||||
password: '123456'
|
||||
} as LoginData,
|
||||
loginRules: {
|
||||
username: [{ required: true, trigger: 'blur', message: t('login.rulesUsername') }],
|
||||
password: [{ required: true, trigger: 'blur', message: t('login.rulesPassword') }]
|
||||
},
|
||||
loginImg: loginImg[0],
|
||||
loading: false,
|
||||
passwordType: 'password',
|
||||
// 大写提示禁用
|
||||
capslockTooltipDisabled: true,
|
||||
otherQuery: {},
|
||||
clientHeight: document.documentElement.clientHeight,
|
||||
showCopyright: true,
|
||||
showDialog: false,
|
||||
|
||||
cookiePass: ''
|
||||
});
|
||||
const {
|
||||
loginData,
|
||||
loginRules,
|
||||
loading,
|
||||
passwordType,
|
||||
capslockTooltipDisabled,
|
||||
showCopyright
|
||||
} = toRefs(state);
|
||||
|
||||
function checkCapslock(e: any) {
|
||||
const { key } = e;
|
||||
state.capslockTooltipDisabled =
|
||||
key && key.length === 1 && key >= 'A' && key <= 'Z';
|
||||
}
|
||||
|
||||
function showPwd() {
|
||||
if (passwordType.value === 'password') {
|
||||
passwordType.value = '';
|
||||
} else {
|
||||
passwordType.value = 'password';
|
||||
}
|
||||
nextTick(() => {
|
||||
passwordRef.value.focus();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录
|
||||
*/
|
||||
function handleLogin() {
|
||||
loginFormRef.value.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
const user = {
|
||||
username: state.loginData.username,
|
||||
password: state.loginData.password,
|
||||
};
|
||||
if (user.password !== state.cookiePass) {
|
||||
user.password = encrypt(user.password);
|
||||
}
|
||||
state.loading = true;
|
||||
userStore
|
||||
.login(user)
|
||||
.then(() => {
|
||||
Cookies.set('username', user.username);
|
||||
if (remember.value == true) {
|
||||
Cookies.set('password', user.password);
|
||||
Cookies.set('rememberMe', String(remember.value));
|
||||
}
|
||||
router.push({ path: state.redirect || '/', query: state.otherQuery });
|
||||
state.loading = false;
|
||||
})
|
||||
.catch(() => {
|
||||
// getCode();
|
||||
state.loading = false;
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
route,
|
||||
() => {
|
||||
const query = route.query;
|
||||
if (query) {
|
||||
state.redirect = query.redirect as string;
|
||||
state.otherQuery = getOtherQuery(query);
|
||||
}
|
||||
},
|
||||
{
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
|
||||
function getOtherQuery(query: any) {
|
||||
return Object.keys(query).reduce((acc: any, cur: any) => {
|
||||
if (cur !== 'redirect') {
|
||||
acc[cur] = query[cur];
|
||||
}
|
||||
return acc;
|
||||
}, {});
|
||||
}
|
||||
function getCookie() {
|
||||
const username = Cookies.get('username');
|
||||
let password = Cookies.get('password');
|
||||
const rememberMe = Cookies.get('rememberMe');
|
||||
rememberMe == 'true' ? (remember.value = Boolean(rememberMe)) : false;
|
||||
// 保存cookie里面的加密后的密码
|
||||
state.cookiePass = password === undefined ? '' : password;
|
||||
password = password === undefined ? state.loginData.password : password;
|
||||
state.loginData = {
|
||||
username: username === undefined ? state.loginData.username : username,
|
||||
password: decrypt(password)
|
||||
};
|
||||
remember.value = rememberMe === undefined ? false : Boolean(rememberMe)
|
||||
}
|
||||
onMounted(() => {
|
||||
getCookie();
|
||||
window.onresize = () => {
|
||||
if (state.clientHeight > document.documentElement.clientHeight) {
|
||||
state.showCopyright = false;
|
||||
} else {
|
||||
state.showCopyright = true;
|
||||
}
|
||||
};
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
$bg: #fff;
|
||||
$dark_gray: #889aa4;
|
||||
$light_gray: #eee;
|
||||
.login-container-center {
|
||||
width: 25%;
|
||||
height:100vh;
|
||||
// min-height: 400px;
|
||||
background-color: $bg;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
.login-container {
|
||||
background: url('../../assets/login/beijing.jpg') no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
min-height: 100%;
|
||||
width: 100%;
|
||||
background-color: $bg;
|
||||
overflow: hidden;
|
||||
// display: flex;
|
||||
// display: -webkit-flex;
|
||||
// align-items: center;
|
||||
// -webkit-align-items: center;
|
||||
position: relative;
|
||||
// justify-content: center;
|
||||
// -webkit-justify-content: center;
|
||||
.login-container-title{
|
||||
font-size: 36px;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
margin: 0 auto;
|
||||
margin-top: 2%;
|
||||
width: 455px;
|
||||
letter-spacing: 5px;
|
||||
}
|
||||
.login-container-content {
|
||||
width: 450px;
|
||||
height: 550px;
|
||||
background: #fff;
|
||||
min-width: 350px;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: center;
|
||||
-webkit-justify-content: center;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
left: 56%;
|
||||
margin-top: 90px;
|
||||
border-radius: 5px;
|
||||
.title-container{
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 28px;
|
||||
color: #333333;
|
||||
margin-bottom: 48px;
|
||||
.title{
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-form {
|
||||
width: 85%;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.svg-container {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 5px;
|
||||
padding: 0 10px;
|
||||
color: $dark_gray;
|
||||
vertical-align: text-bottom;
|
||||
font-size: 24px;
|
||||
color: #cccccc;
|
||||
z-index: 2;
|
||||
}
|
||||
.svg-container-refresh {
|
||||
padding-right: 5px;
|
||||
padding-left: 0;
|
||||
font-size: 26px;
|
||||
color: rgb(64, 158, 255);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.show-pwd {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 7px;
|
||||
font-size: 16px;
|
||||
color: $dark_gray;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.captcha {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
||||
img {
|
||||
height: 42px;
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-containe-footer{
|
||||
color: #000000;
|
||||
font-size: 14px;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
left: 0;
|
||||
// text-align: center;
|
||||
text-align: left;
|
||||
padding-left: 40px;
|
||||
|
||||
}
|
||||
.thirdparty-button {
|
||||
position: absolute;
|
||||
right: 40px;
|
||||
bottom: 6px;
|
||||
}
|
||||
:deep(.el-input){
|
||||
height:45px;
|
||||
}
|
||||
:deep(.el-form-item__content){
|
||||
position: relative;
|
||||
}
|
||||
:deep(.el-input__wrapper){
|
||||
padding-left: 0px;
|
||||
box-shadow:none;
|
||||
// border-bottom: 1px solid rgb(8,186,124);
|
||||
|
||||
border-bottom: 1px solid #dcdfe6;
|
||||
border-radius: 0px;
|
||||
}
|
||||
:deep(.el-button>span){
|
||||
font-size:18px;
|
||||
}
|
||||
:deep(){
|
||||
.el-form-item.is-error .el-input__wrapper, .el-form-item.is-error .el-input__wrapper.is-focus, .el-form-item.is-error .el-input__wrapper:focus, .el-form-item.is-error .el-input__wrapper:hover, .el-form-item.is-error .el-select__wrapper, .el-form-item.is-error .el-select__wrapper.is-focus, .el-form-item.is-error .el-select__wrapper:focus, .el-form-item.is-error .el-select__wrapper:hover, .el-form-item.is-error .el-textarea__inner, .el-form-item.is-error .el-textarea__inner.is-focus, .el-form-item.is-error .el-textarea__inner:focus, .el-form-item.is-error .el-textarea__inner:hover{
|
||||
box-shadow:none;
|
||||
border-bottom: 1px solid red;
|
||||
}
|
||||
.el-input__wrapper:hover{
|
||||
box-shadow:none;
|
||||
border-bottom: 1px solid rgb(8,186,124);
|
||||
}
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner{
|
||||
background-color: rgb(8,186,124);
|
||||
border-color: rgb(8,186,124);
|
||||
}
|
||||
.el-checkbox__inner:hover {
|
||||
border-color: rgb(8,186,124);
|
||||
}
|
||||
.el-checkbox__input.is-checked+.el-checkbox__label{
|
||||
color: rgb(8,186,124);
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 470px) {
|
||||
.thirdparty-button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1366px) {
|
||||
.title {
|
||||
margin: 0px auto 20px auto !important;
|
||||
}
|
||||
.login-code {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,456 +0,0 @@
|
||||
<template>
|
||||
<div class="login-container">
|
||||
<div class="login-container-title" style="width: 600px">木林森视力健康智慧管理体系</div>
|
||||
<img style=" position: absolute;
|
||||
top: 20px;
|
||||
left: 40px;
|
||||
width: 165px;" src="@/assets/login/hsllogo.png" alt="">
|
||||
<!-- <div class="login-container-left">
|
||||
<el-image
|
||||
:src="loginImg"
|
||||
fit="cover"
|
||||
/>
|
||||
</div> -->
|
||||
<div class="login-container-content">
|
||||
<el-form
|
||||
ref="loginFormRef"
|
||||
:model="loginData"
|
||||
:rules="loginRules"
|
||||
class="login-form"
|
||||
auto-complete="on"
|
||||
label-position="left"
|
||||
>
|
||||
<!-- <div class="mb-[30px]">
|
||||
<img src="@/assets/login/logo.png" style="display: inline-block;" alt="">
|
||||
</div> -->
|
||||
<div class="title-container">
|
||||
<h3 class="title">欢迎登录!</h3>
|
||||
</div>
|
||||
|
||||
<el-form-item prop="username" style="margin-bottom: 45px;">
|
||||
<!-- <span class="svg-container">
|
||||
<img src="@/assets/login/username.png" alt="">
|
||||
</span> -->
|
||||
<el-input
|
||||
ref="username"
|
||||
clearable
|
||||
v-model="loginData.username"
|
||||
:placeholder="$t('login.username')"
|
||||
name="username"
|
||||
type="text"
|
||||
tabindex="1"
|
||||
auto-complete="on"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-tooltip
|
||||
:disabled="capslockTooltipDisabled"
|
||||
content="Caps lock is On"
|
||||
placement="right"
|
||||
>
|
||||
<el-form-item prop="password" style="margin-bottom:20px;">
|
||||
<!-- <span class="svg-container">
|
||||
<img src="@/assets/login/password.png" alt="">
|
||||
</span> -->
|
||||
<el-input
|
||||
ref="passwordRef"
|
||||
:key="passwordType"
|
||||
v-model="loginData.password"
|
||||
:type="passwordType"
|
||||
:placeholder="$t('login.password')"
|
||||
name="password"
|
||||
tabindex="2"
|
||||
auto-complete="on"
|
||||
@keyup="checkCapslock"
|
||||
@blur="capslockTooltipDisabled = true"
|
||||
@keyup.enter="handleLogin"
|
||||
/>
|
||||
<span
|
||||
class="show-pwd"
|
||||
@click="showPwd"
|
||||
>
|
||||
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
|
||||
</span>
|
||||
</el-form-item>
|
||||
</el-tooltip>
|
||||
<div style="text-align: left;margin-bottom: 40px;">
|
||||
<el-checkbox
|
||||
v-model="remember"
|
||||
:label="$t('login.remember')"
|
||||
size="large"
|
||||
/>
|
||||
</div>
|
||||
<el-button
|
||||
size="default"
|
||||
:loading="loading"
|
||||
type="primary"
|
||||
style="width: 100%;height: 50px; margin-bottom: 10px;background-color: rgb(8,186,124);border: none;border-radius: 100px;"
|
||||
@click.prevent="handleLogin"
|
||||
>{{ $t('login.login') }}
|
||||
</el-button>
|
||||
</el-form>
|
||||
|
||||
<div
|
||||
v-if="showCopyright == true"
|
||||
class="copyright"
|
||||
>
|
||||
<p>{{ $t('login.copyright') }}</p>
|
||||
<p>{{ $t('login.icp') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="login-containe-footer">
|
||||
<div style="font-size: 16px;">中山市木林森健康照明科技有限责任公司</div>
|
||||
<div style="margin-top: 5px;">中山市小榄镇木林森大道2号</div>
|
||||
<div style="margin-top: 5px;">0760-89828888-3566</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, toRefs, watch, nextTick } from 'vue';
|
||||
import loginImg from '@/assets/images/u287.gif';
|
||||
import { getCaptcha } from '@/api/auth';
|
||||
|
||||
// 组件依赖
|
||||
import { ElForm, ElInput } from 'element-plus';
|
||||
import router from '@/router';
|
||||
import SvgIcon from '@/components/SvgIcon/index.vue';
|
||||
import Cookies from 'js-cookie';
|
||||
// API依赖
|
||||
import { useRoute } from 'vue-router';
|
||||
import { LoginData } from '@/api/auth/types';
|
||||
|
||||
//密码加密
|
||||
import { encrypt,decrypt } from '@/utils/rsaEncrypt';
|
||||
|
||||
// 状态管理依赖
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
|
||||
// 国际化
|
||||
import { useI18n } from 'vue-i18n';
|
||||
const { t } = useI18n();
|
||||
|
||||
const userStore = useUserStore();
|
||||
const route = useRoute();
|
||||
// 图片验证码
|
||||
const codeUrl = ref('');
|
||||
|
||||
const loginFormRef = ref(ElForm);
|
||||
const passwordRef = ref(ElInput);
|
||||
// 记住密码
|
||||
let remember = ref(false);
|
||||
|
||||
const state = reactive({
|
||||
redirect: '',
|
||||
loginData: {
|
||||
username: 'admin',
|
||||
password: '123456'
|
||||
} as LoginData,
|
||||
loginRules: {
|
||||
username: [{ required: true, trigger: 'blur', message: t('login.rulesUsername') }],
|
||||
password: [{ required: true, trigger: 'blur', message: t('login.rulesPassword') }]
|
||||
},
|
||||
loginImg: loginImg[0],
|
||||
loading: false,
|
||||
passwordType: 'password',
|
||||
// 大写提示禁用
|
||||
capslockTooltipDisabled: true,
|
||||
otherQuery: {},
|
||||
clientHeight: document.documentElement.clientHeight,
|
||||
showCopyright: true,
|
||||
showDialog: false,
|
||||
|
||||
cookiePass: ''
|
||||
});
|
||||
const {
|
||||
loginData,
|
||||
loginRules,
|
||||
loading,
|
||||
passwordType,
|
||||
capslockTooltipDisabled,
|
||||
showCopyright
|
||||
} = toRefs(state);
|
||||
|
||||
function checkCapslock(e: any) {
|
||||
const { key } = e;
|
||||
state.capslockTooltipDisabled =
|
||||
key && key.length === 1 && key >= 'A' && key <= 'Z';
|
||||
}
|
||||
|
||||
function showPwd() {
|
||||
if (passwordType.value === 'password') {
|
||||
passwordType.value = '';
|
||||
} else {
|
||||
passwordType.value = 'password';
|
||||
}
|
||||
nextTick(() => {
|
||||
passwordRef.value.focus();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录
|
||||
*/
|
||||
function handleLogin() {
|
||||
loginFormRef.value.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
const user = {
|
||||
username: state.loginData.username,
|
||||
password: state.loginData.password,
|
||||
};
|
||||
if (user.password !== state.cookiePass) {
|
||||
user.password = encrypt(user.password);
|
||||
}
|
||||
state.loading = true;
|
||||
userStore
|
||||
.login(user)
|
||||
.then(() => {
|
||||
Cookies.set('username', user.username);
|
||||
if (remember.value == true) {
|
||||
Cookies.set('password', user.password);
|
||||
Cookies.set('rememberMe', String(remember.value));
|
||||
}
|
||||
router.push({ path: state.redirect || '/', query: state.otherQuery });
|
||||
state.loading = false;
|
||||
})
|
||||
.catch(() => {
|
||||
// getCode();
|
||||
state.loading = false;
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
route,
|
||||
() => {
|
||||
const query = route.query;
|
||||
if (query) {
|
||||
state.redirect = query.redirect as string;
|
||||
state.otherQuery = getOtherQuery(query);
|
||||
}
|
||||
},
|
||||
{
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
|
||||
function getOtherQuery(query: any) {
|
||||
return Object.keys(query).reduce((acc: any, cur: any) => {
|
||||
if (cur !== 'redirect') {
|
||||
acc[cur] = query[cur];
|
||||
}
|
||||
return acc;
|
||||
}, {});
|
||||
}
|
||||
function getCookie() {
|
||||
const username = Cookies.get('username');
|
||||
let password = Cookies.get('password');
|
||||
const rememberMe = Cookies.get('rememberMe');
|
||||
rememberMe == 'true' ? (remember.value = Boolean(rememberMe)) : false;
|
||||
// 保存cookie里面的加密后的密码
|
||||
state.cookiePass = password === undefined ? '' : password;
|
||||
password = password === undefined ? state.loginData.password : password;
|
||||
state.loginData = {
|
||||
username: username === undefined ? state.loginData.username : username,
|
||||
password: decrypt(password)
|
||||
};
|
||||
remember.value = rememberMe === undefined ? false : Boolean(rememberMe)
|
||||
}
|
||||
onMounted(() => {
|
||||
getCookie();
|
||||
window.onresize = () => {
|
||||
if (state.clientHeight > document.documentElement.clientHeight) {
|
||||
state.showCopyright = false;
|
||||
} else {
|
||||
state.showCopyright = true;
|
||||
}
|
||||
};
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
$bg: #fff;
|
||||
$dark_gray: #889aa4;
|
||||
$light_gray: #eee;
|
||||
.login-container-center {
|
||||
width: 25%;
|
||||
height:100vh;
|
||||
// min-height: 400px;
|
||||
background-color: $bg;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
.login-container {
|
||||
background: url('../../assets/login/beijing.jpg') no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
min-height: 100%;
|
||||
width: 100%;
|
||||
background-color: $bg;
|
||||
overflow: hidden;
|
||||
// display: flex;
|
||||
// display: -webkit-flex;
|
||||
// align-items: center;
|
||||
// -webkit-align-items: center;
|
||||
position: relative;
|
||||
// justify-content: center;
|
||||
// -webkit-justify-content: center;
|
||||
.login-container-title{
|
||||
font-size: 36px;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
margin: 0 auto;
|
||||
margin-top: 2%;
|
||||
width: 455px;
|
||||
letter-spacing: 5px;
|
||||
}
|
||||
.login-container-content {
|
||||
width: 450px;
|
||||
height: 550px;
|
||||
background: #fff;
|
||||
min-width: 350px;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: center;
|
||||
-webkit-justify-content: center;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
left: 56%;
|
||||
margin-top: 90px;
|
||||
border-radius: 5px;
|
||||
.title-container{
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 28px;
|
||||
color: #333333;
|
||||
margin-bottom: 48px;
|
||||
.title{
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-form {
|
||||
width: 85%;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.svg-container {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 5px;
|
||||
padding: 0 10px;
|
||||
color: $dark_gray;
|
||||
vertical-align: text-bottom;
|
||||
font-size: 24px;
|
||||
color: #cccccc;
|
||||
z-index: 2;
|
||||
}
|
||||
.svg-container-refresh {
|
||||
padding-right: 5px;
|
||||
padding-left: 0;
|
||||
font-size: 26px;
|
||||
color: rgb(64, 158, 255);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.show-pwd {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 7px;
|
||||
font-size: 16px;
|
||||
color: $dark_gray;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.captcha {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
||||
img {
|
||||
height: 42px;
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-containe-footer{
|
||||
color: #000000;
|
||||
font-size: 14px;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
left: 0;
|
||||
// text-align: center;
|
||||
text-align: left;
|
||||
padding-left: 40px;
|
||||
|
||||
}
|
||||
.thirdparty-button {
|
||||
position: absolute;
|
||||
right: 40px;
|
||||
bottom: 6px;
|
||||
}
|
||||
:deep(.el-input){
|
||||
height:45px;
|
||||
}
|
||||
:deep(.el-form-item__content){
|
||||
position: relative;
|
||||
}
|
||||
:deep(.el-input__wrapper){
|
||||
padding-left: 0px;
|
||||
box-shadow:none;
|
||||
// border-bottom: 1px solid rgb(8,186,124);
|
||||
|
||||
border-bottom: 1px solid #dcdfe6;
|
||||
border-radius: 0px;
|
||||
}
|
||||
:deep(.el-button>span){
|
||||
font-size:18px;
|
||||
}
|
||||
:deep(){
|
||||
.el-form-item.is-error .el-input__wrapper, .el-form-item.is-error .el-input__wrapper.is-focus, .el-form-item.is-error .el-input__wrapper:focus, .el-form-item.is-error .el-input__wrapper:hover, .el-form-item.is-error .el-select__wrapper, .el-form-item.is-error .el-select__wrapper.is-focus, .el-form-item.is-error .el-select__wrapper:focus, .el-form-item.is-error .el-select__wrapper:hover, .el-form-item.is-error .el-textarea__inner, .el-form-item.is-error .el-textarea__inner.is-focus, .el-form-item.is-error .el-textarea__inner:focus, .el-form-item.is-error .el-textarea__inner:hover{
|
||||
box-shadow:none;
|
||||
border-bottom: 1px solid red;
|
||||
}
|
||||
.el-input__wrapper:hover{
|
||||
box-shadow:none;
|
||||
border-bottom: 1px solid rgb(8,186,124);
|
||||
}
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner{
|
||||
background-color: rgb(8,186,124);
|
||||
border-color: rgb(8,186,124);
|
||||
}
|
||||
.el-checkbox__inner:hover {
|
||||
border-color: rgb(8,186,124);
|
||||
}
|
||||
.el-checkbox__input.is-checked+.el-checkbox__label{
|
||||
color: rgb(8,186,124);
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 470px) {
|
||||
.thirdparty-button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1366px) {
|
||||
.title {
|
||||
margin: 0px auto 20px auto !important;
|
||||
}
|
||||
.login-code {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,438 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { ElForm, ElMessageBox, ElMessage } from 'element-plus';
|
||||
import { queryvisionExamineItemTree,addVisionExamineItem,updateVisionExamineItem,delVisionExamineItem } from "@/api/regionmodule/VisionExamineItem";
|
||||
//定义表格数据
|
||||
const tableData: any = ref([]);
|
||||
function gteTabledata() {
|
||||
const params = {
|
||||
name: '',
|
||||
}
|
||||
loading.value = true
|
||||
queryvisionExamineItemTree(params).then((res) => {
|
||||
tableData.value = res.data
|
||||
loading.value = false
|
||||
}).catch(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
const itemInfoRef = ref();
|
||||
const loading = ref(false);
|
||||
//定义搜索框文本
|
||||
const menuname = ref('')
|
||||
//点击搜索
|
||||
function search() {
|
||||
menuname.value = menuname.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: menuname.value
|
||||
}
|
||||
queryvisionExamineItemTree(params).then((res:any) => {
|
||||
tableData.value = res.data
|
||||
})
|
||||
|
||||
}
|
||||
//目录添加
|
||||
const title = ref('')
|
||||
const itemInfo: any = ref({
|
||||
item_code: '',
|
||||
item_name: '',
|
||||
parentid: '00'
|
||||
})
|
||||
const dialogVisible = ref(false)
|
||||
//关闭目录
|
||||
function handleClose() {
|
||||
dialogVisible.value = false;
|
||||
isConclusion.value = false
|
||||
if (itemInfoRef.value != null) itemInfoRef.value.resetFields();
|
||||
}
|
||||
|
||||
//表格规则定义
|
||||
const rules = ref({
|
||||
item_code: [
|
||||
{ required: true, message: '请输入编码', trigger: 'blur' }
|
||||
],
|
||||
item_name: [
|
||||
{ required: true, message: '请输入名称', trigger: 'blur' }
|
||||
]
|
||||
})
|
||||
//添加子目录
|
||||
function addchilder(row: any) {
|
||||
regiontitle.value = '新增项目指标'
|
||||
isSwitch.value = false
|
||||
itemInfo.value = {
|
||||
item_code: '',
|
||||
item_name: '',
|
||||
parentid: row.id,
|
||||
parentname: row.item_name
|
||||
}
|
||||
dialogVisible.value = true
|
||||
}
|
||||
//新增目录-确认按钮
|
||||
function expertsubmit(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (itemInfo.value.id) {
|
||||
let params = {
|
||||
id:itemInfo.value.id,
|
||||
itemCode: itemInfo.value.item_code,
|
||||
itemName: itemInfo.value.item_name,
|
||||
introduction: itemInfo.value.introduction,
|
||||
parentid: itemInfo.value.parentid
|
||||
}
|
||||
updateVisionExamineItem(params).then(() => {
|
||||
gteTabledata()
|
||||
dialogVisible.value = false
|
||||
ElMessage({
|
||||
message: '修改成功',
|
||||
type: 'success',
|
||||
})
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
let params = {
|
||||
itemCode: itemInfo.value.item_code,
|
||||
itemName: itemInfo.value.item_name,
|
||||
parentid: itemInfo.value.parentid,
|
||||
introduction: itemInfo.value.introduction
|
||||
}
|
||||
addVisionExamineItem(params).then(() => {
|
||||
gteTabledata()
|
||||
dialogVisible.value = false
|
||||
ElMessage({
|
||||
message: '新建成功',
|
||||
type: 'success',
|
||||
})
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
const regiontitle = ref('')
|
||||
|
||||
//修改信息
|
||||
function handleEdit(row: any, type:any) {
|
||||
isSwitch.value = false
|
||||
itemInfo.value = JSON.parse(JSON.stringify(row))
|
||||
regiontitle.value = type
|
||||
dialogVisible.value = true
|
||||
}
|
||||
//新增信息
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
regiontitle.value = '新增项目'
|
||||
itemInfo.value = {
|
||||
code: '',
|
||||
name: '',
|
||||
parent_id: '0',
|
||||
type: '2',
|
||||
education_bureau: '',
|
||||
status: '01'
|
||||
}
|
||||
dialogVisible.value = true
|
||||
}
|
||||
//删除
|
||||
function handleDelete(row: any) {
|
||||
ElMessageBox.confirm('确定删除此条信息吗?', '删除提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
const params = {
|
||||
ids: row.id
|
||||
}
|
||||
delVisionExamineItem(params).then(() => {
|
||||
gteTabledata()
|
||||
ElMessage({
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
|
||||
var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
|
||||
var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
gteTabledata()
|
||||
})
|
||||
|
||||
const itemResultsData: any = ref([])// 结论列表
|
||||
const isConclusion:any = ref(false)
|
||||
// 打开项目结论
|
||||
function resultsClick(row:any){
|
||||
isSwitch.value = false
|
||||
regiontitle.value = row.item_name + '指标判定规则'
|
||||
itemInfo.value = JSON.parse(JSON.stringify(row));
|
||||
itemResultsData.value = []
|
||||
if(row.item_results !=null && row.item_results != ''){
|
||||
itemResultsData.value = JSON.parse(row.item_results);
|
||||
}
|
||||
isConclusion.value = true
|
||||
}
|
||||
//新增参数
|
||||
function addparameter() {
|
||||
itemResultsData.value.push({
|
||||
code:'',
|
||||
name:'',
|
||||
rule:''
|
||||
})
|
||||
}
|
||||
//修改数据
|
||||
function delectparams(index: any) {
|
||||
itemResultsData.value.splice(index,1)
|
||||
}
|
||||
|
||||
//指标判定规则
|
||||
function saveparam() {
|
||||
if(itemResultsData.value.length <=0){
|
||||
ElMessage({
|
||||
message: '请添加结论!',
|
||||
type: 'warning',
|
||||
})
|
||||
return
|
||||
}
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
let params = {
|
||||
id:itemInfo.value.id,
|
||||
itemResults:JSON.stringify(itemResultsData.value) ,
|
||||
}
|
||||
updateVisionExamineItem(params).then(() => {
|
||||
gteTabledata()
|
||||
isConclusion.value = false
|
||||
ElMessage({
|
||||
message: '修改成功',
|
||||
type: 'success',
|
||||
})
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<div class="collectiontemplate-box">
|
||||
<section class="detail-box">
|
||||
<div style="display: flex;display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; margin-bottom:10px">
|
||||
<div style="display: flex;display: -webkit-flex;">
|
||||
<el-input v-model="menuname" placeholder="请输入名称" clearable style="width:200px;margin-right:10px"
|
||||
@keyup.enter="search()" />
|
||||
<el-button type="primary" @click="search()">搜索</el-button>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
<el-button type="primary" @click="addClick">
|
||||
<img src="@/assets/MenuIcon/jscz_xz.png" alt="" style="margin-right: 4px;">新增项目</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="draggable">
|
||||
<el-table v-loading="loading" ref="multipleTable" :data="tableData" default-expand-all tooltip-effect="dark"
|
||||
style="width: 100%;height: calc(100vh - 190px)" row-key="id" border
|
||||
:header-cell-style="{ background: 'rgb(250 250 250)', color: '#383838', height: '50px' }">
|
||||
<el-table-column label="编号" width="250" prop="item_code" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<div style="margin-left: 20px;">{{ scope.row.item_code }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="名称" prop="item_name" width="120" show-overflow-tooltip />
|
||||
<el-table-column label="说明" prop="introduction" min-width="200" />
|
||||
<el-table-column prop="creator" label="创建人" width="100" align="center"></el-table-column>
|
||||
<el-table-column prop="create_time" label="创建日期" width="180" align="center">
|
||||
<template #default="scope">
|
||||
{{ dateFormat(scope.row.create_time) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="160" fixed="right" align="center"
|
||||
style="display: flex; display: -webkit-flex;">
|
||||
<template #default="scope">
|
||||
<span
|
||||
style="display: flex;display: -webkit-flex; justify-content: space-around;-webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" alt="" title="修改" v-if="scope.row.parentid=='00'"
|
||||
@click="handleEdit(scope.row,'修改项目')" style="cursor: pointer;">
|
||||
<img v-else src="@/assets/MenuIcon/lbcz_xg.png" alt="" title="修改"
|
||||
@click="handleEdit(scope.row,'修改项目指标')" style="cursor: pointer;">
|
||||
<img v-if="scope.row.parentid =='00'" src="@/assets/tableicon/u213.png" alt=""
|
||||
title="新增项目指标" @click="addchilder(scope.row)" style="cursor: pointer;">
|
||||
<img v-else src="@/assets/tableicon/u213_disabled.png" alt=""
|
||||
title="新增项目指标" style="cursor: pointer;">
|
||||
|
||||
<img v-if="scope.row.parentid !='00'" src="@/assets/tableicon/u215.png" alt=""
|
||||
title="判断规则" @click="resultsClick(scope.row)" style="cursor: pointer;">
|
||||
<img v-else src="@/assets/tableicon/u215_disabled.png" alt=""
|
||||
title="判断规则" style="cursor: pointer;">
|
||||
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" alt="" v-if="scope.row.status == '09'"
|
||||
title="删除">
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" alt="" v-else title="删除"
|
||||
@click="handleDelete(scope.row)" style="cursor: pointer; ">
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</section>
|
||||
<!-- 新增目录 -->
|
||||
<el-dialog v-model="dialogVisible" :close-on-click-modal="false" :before-close="handleClose" :title="regiontitle " draggable
|
||||
append-to-body width="620px" class="dialogClass">
|
||||
<el-form ref="itemInfoRef" :model="itemInfo" :rules="rules" label-width="90px">
|
||||
<div v-if="regiontitle == '新增项目' || regiontitle == '修改项目' ">
|
||||
<el-form-item label="编码" prop="item_code">
|
||||
<el-input v-model="itemInfo.item_code" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="名称" prop="item_name">
|
||||
<el-input v-model="itemInfo.item_name" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="项目介绍" prop="introduction">
|
||||
<el-input type="textarea" v-model="itemInfo.introduction" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-form-item label="所属项目" prop="code">
|
||||
<el-input v-model="itemInfo.parentname" placeholder="" style="width: 100%;" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="编码" prop="item_code">
|
||||
<el-input v-model="itemInfo.item_code" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="指标名称" prop="item_name">
|
||||
<el-input v-model="itemInfo.item_name" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="说明" prop="introduction">
|
||||
<el-input type="textarea" v-model="itemInfo.introduction" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
</el-form>
|
||||
<span class="dialog-footer"
|
||||
style="display: flex; display: -webkit-flex; justify-content: flex-end;-webkit-justify-content: flex-end;">
|
||||
<el-button @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" @click="expertsubmit(itemInfoRef)">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="isConclusion" :close-on-click-modal="false" :before-close="handleClose" :title="regiontitle " draggable
|
||||
append-to-body width="800px" class="dialogClass">
|
||||
<el-table border :data="itemResultsData" v-loading="loading" class="w-full !h-[400px]"
|
||||
:header-cell-style="{ background: '#f8f8f8', color: '#505050', height: '43px' }">
|
||||
<el-table-column type="index" label="序号" align="center" width="60" />
|
||||
<el-table-column prop="code" label="结论编号" width="100">
|
||||
<template #default="scope">
|
||||
<el-input class="!w-full" clearable v-model="scope.row.code" placeholder=" " />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" label="结论名称" width="170">
|
||||
<template #default="scope">
|
||||
<el-input class="!w-full" clearable v-model="scope.row.name" placeholder=" " />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="rule" label="区间范围">
|
||||
<template #default="scope">
|
||||
<el-input class="!w-full" clearable v-model="scope.row.rule" placeholder=" " />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="操作" width="90" align="center" fixed="right">
|
||||
<template #header>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<div>操作</div>
|
||||
<el-button class="ml-[4px] !text-[16px] font-blod" type="primary" size="small" circle
|
||||
@click="addparameter">+</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div style="display: flex;justify-content: space-around;">
|
||||
|
||||
<img title="删除" @click="delectparams(scope.$index)" style="cursor: pointer;" src="@/assets/tableicon/del.svg">
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<span class="dialog-footer" style="margin-top:10px ;">
|
||||
<el-button @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" @click="saveparam">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.detail-box {
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
padding: 5px 20px 0px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.el-tooltip) {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.delicon {
|
||||
width: 20px;
|
||||
height: 25px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
// margin-left: 20px;
|
||||
|
||||
}
|
||||
|
||||
.delicon:hover {
|
||||
// background-color: red;
|
||||
|
||||
.delIcon {
|
||||
display: block !important;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
:deep(.el-table__expand-icon) {
|
||||
margin-left: 15px;
|
||||
margin-right: -10px !important;
|
||||
}
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
|
||||
</style>
|
@ -1,482 +0,0 @@
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'VisionInstitutionDoctor' // 视力筛查服务机构_医生
|
||||
};
|
||||
</script>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import { queryInstitutionDoctorPage, addVisionInstitutionDoctor,updateVisionInstitutionDoctor,delVisionInstitutionDoctor } from "@/api/regionmodule/VisionInstitutionDoctor";
|
||||
const emit = defineEmits([ 'returnClick']);
|
||||
const props:any = defineProps({
|
||||
institutionId: {
|
||||
required: false,
|
||||
type: String,
|
||||
default: ""
|
||||
}
|
||||
})
|
||||
const multipleSelection = ref([]);
|
||||
//定义医生填写规则
|
||||
const moderules = reactive<FormRules>({
|
||||
name: [{ required: true, message: "请输入医生名称", trigger: "blur" }],
|
||||
mobile: [{ pattern: /^1(3|4|5|6|7|8|9)\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }],
|
||||
});
|
||||
function handleSelectionChange(val: any) {
|
||||
multipleSelection.value = val;
|
||||
}
|
||||
const queryInfo :any = ref({
|
||||
name:'',
|
||||
current:1,
|
||||
size:10,
|
||||
total:0
|
||||
})
|
||||
const tableData =ref([])
|
||||
const loading = ref(false)
|
||||
//获取医生列表
|
||||
function getData(){
|
||||
queryInfo.value.name = queryInfo.value.name.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: queryInfo.value.name,
|
||||
institutionId: institutionId.value,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
queryInstitutionDoctorPage(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
//新建医生数组
|
||||
const info:any = ref({
|
||||
institution_id: "", //学校id
|
||||
code: "", // 医生代码
|
||||
name: "", // 医生名称
|
||||
gender:"",
|
||||
birth_date:"",
|
||||
mobile:"",
|
||||
wechat:"",
|
||||
email:"",
|
||||
certificate:"",
|
||||
license:"", //从业执照
|
||||
signature:""
|
||||
});
|
||||
const title = ref("") // 弹框标题
|
||||
const dialogVisible = ref(false)
|
||||
//新建医生
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
const infoagin = ref({
|
||||
id: null,
|
||||
institutionId: institutionId.value, //区域ID (医生所在城市
|
||||
code: "", // 医生代码
|
||||
name: "", // 医生名称
|
||||
gender:"",
|
||||
birth_date:"",
|
||||
mobile:"",
|
||||
wechat:"",
|
||||
email:"",
|
||||
certificate:"",
|
||||
signature:"",
|
||||
license:"", //从业执照
|
||||
|
||||
});
|
||||
info.value = infoagin.value;
|
||||
title.value = "新增医生";
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//修改医生
|
||||
function editHandle(row: any) {
|
||||
isSwitch.value = false
|
||||
title.value = "修改医生";
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//删除医生
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定删除此医生吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delVisionInstitutionDoctor(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
// 多选删除医生
|
||||
function delClick() {
|
||||
ElMessageBox.confirm("确定删除已选择的医生吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let id = [] as any[];
|
||||
multipleSelection.value.forEach((item: any) => {
|
||||
id.push(item.id)
|
||||
})
|
||||
let params = {
|
||||
ids: id.join(','),
|
||||
};
|
||||
delVisionInstitutionDoctor(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " ";
|
||||
}
|
||||
}
|
||||
const institutionId = ref("")
|
||||
onMounted(() => {
|
||||
institutionId.value = props.institutionId
|
||||
getData()
|
||||
});
|
||||
|
||||
const infoForm = ref();
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
function confirmClick(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (info.value.id) {
|
||||
const data:any = {
|
||||
id:info.value.id,
|
||||
institutionId: info.value.institution_id, //学校ID
|
||||
code: info.value.code, // 医生代码
|
||||
name: info.value.name, // 医生名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email, // 微信号
|
||||
certificate:info.value.certificate, //资格证书
|
||||
license:info.value.license, //从业执照
|
||||
signature:info.value.signature //电子签名
|
||||
|
||||
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gende==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
updateVisionInstitutionDoctor(data).then((item:any) => {
|
||||
if(item.code == '0'){
|
||||
dialogVisible.value = false;
|
||||
ElMessage({
|
||||
message: "修改成功",
|
||||
type: "success",
|
||||
});
|
||||
getData();
|
||||
}
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
const data:any = {
|
||||
institutionId: info.value.institution_id, //学校ID
|
||||
code: info.value.code, // 医生代码
|
||||
name: info.value.name, // 医生名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email, // 微信号
|
||||
certificate:info.value.certificate, //资格证书
|
||||
license:info.value.license, //从业执照
|
||||
signature:info.value.signature //电子签名
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gende==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
addVisionInstitutionDoctor(data).then((item:any) => {
|
||||
if(item.code == '0'){
|
||||
dialogVisible.value = false;
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "新增成功",
|
||||
type: "success",
|
||||
});
|
||||
}
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* 上传Base64图片方法
|
||||
*/
|
||||
function uploadChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.license =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
function uploadQecodeChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.signature =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
|
||||
function delLicense(){
|
||||
info.value.license = ""
|
||||
}
|
||||
function delsignature(){
|
||||
info.value.signature = ""
|
||||
}
|
||||
function returnClick(){
|
||||
emit('returnClick')
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="">
|
||||
<div class="schoolStudent-title" style="margin-right: 20px;">
|
||||
<div class="class_order">{{ props.classInfo.grade_name }}{{ props.classInfo.class_name }}</div>
|
||||
<div class="return" @click="returnClick">
|
||||
<img src="@/assets/tableicon/u549.png" alt="">
|
||||
<div style="padding-left: 2px;padding-top: 2px;">返回</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="schoolStudent-line" style="width:calc(100% - 25px) ;margin-left: 5px;"></div>
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div>
|
||||
<el-input v-model="queryInfo.name" placeholder="请输入医生姓名" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button type="primary" @click="addClick"><img style="margin-right:5px;" src="@/assets/MenuIcon/jscz_xz.png" alt=""> 新增</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%; height:calc(100% - 105px);" row-key="id" border
|
||||
@selection-change="handleSelectionChange" default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}"
|
||||
>
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column prop="code" label="医生代码" min-width="140"></el-table-column>
|
||||
<el-table-column prop="name" label="医生姓名" width="100"></el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="80">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.gender == '0'">不详</span>
|
||||
<span v-if="scope.row.gender == '1'">男</span>
|
||||
<span v-if="scope.row.gender == '2'">女</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="所属学校" min-width="140"></el-table-column>
|
||||
<el-table-column prop="certificate" label="资格证书" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.certificate == '0'">执业医师</span>
|
||||
<span v-if="scope.row.certificate == '1'">执业技师</span>
|
||||
<span v-if="scope.row.certificate == '2'">护士</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="gender" label="出生日期" width="120" align="center">
|
||||
<template #default="scope">
|
||||
{{ dateFormat(scope.row.birth_date) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mobile" label="手机号" width="120" align="center"></el-table-column>
|
||||
<el-table-column prop="license" label="从业执照" width="140">
|
||||
<template #default="scope">
|
||||
<img :src="scope.row.license" alt="" style="width: 70px;">
|
||||
<!-- <el-image
|
||||
style="width: 70px; height: 70px"
|
||||
:src="scope.row.license"
|
||||
:preview-src-list="[scope.row.license]"
|
||||
:initial-index="4"
|
||||
fit="cover"
|
||||
z-index="3000"
|
||||
/> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signature" label="电子签名" width="140">
|
||||
<template #default="scope">
|
||||
<img :src="scope.row.signature" alt="" style="width: 70px;">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="80">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" title="修改" style="cursor: pointer;"
|
||||
@click="editHandle(scope.row)" >
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="cursor: pointer;"
|
||||
@click="delHandle(scope.row)" >
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
<!-- 医生 弹框-->
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="title" draggable width="620px">
|
||||
|
||||
<el-form ref="infoForm" :model="info" label-width="100px" :rules="moderules">
|
||||
<el-form-item label="所属学校" prop="code">
|
||||
<el-input v-model="info.code" style="width: 100%" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="医生代码">
|
||||
<el-input v-model="info.code" style="width: 100%" placeholder="请输入医生代码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="医生姓名" prop="name">
|
||||
<el-input v-model="info.name" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-radio-group v-model="info.gender">
|
||||
<el-radio label="1">男</el-radio>
|
||||
<el-radio label="2">女</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="出生日期" prop="birth_date">
|
||||
<el-date-picker v-model="info.birth_date" type="date" placeholder="" style="width: 100%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="mobile" >
|
||||
<el-input v-model="info.mobile" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="info.email" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="微信号" prop="wechat">
|
||||
<el-input v-model="info.wechat" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="资格证书" prop="certificate">
|
||||
<el-radio-group v-model="info.certificate">
|
||||
<el-radio label="0">执业医师</el-radio>
|
||||
<el-radio label="1">执业技师</el-radio>
|
||||
<el-radio label="2">护士</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="上传图片" prop="organization_id">
|
||||
<div style="display: flex;">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.license">
|
||||
<img :src="info.license" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delLicense"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">从业执照</div>
|
||||
</div>
|
||||
|
||||
</el-upload>
|
||||
<el-upload
|
||||
style="margin-left: 10px;"
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadQecodeChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.signature">
|
||||
<img :src="info.signature" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delsignature"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">电子签名</div>
|
||||
</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer">
|
||||
<el-button style="padding: 10px 15px" @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" style="padding: 10px 15px" @click="confirmClick(infoForm)">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.schoolStudent-title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #282828;
|
||||
.class_order{
|
||||
padding-bottom: 5px;
|
||||
border-bottom:3px solid #409eff;
|
||||
}
|
||||
.return{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #409EFF;
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
border: 1px solid #C6E2FF;
|
||||
background: rgb(236, 245, 255);
|
||||
border-radius:4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.schoolStudent-line{
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: rgb(220, 223, 230);
|
||||
margin-top: -1px;
|
||||
}
|
||||
</style>
|
@ -1,423 +0,0 @@
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'region' // 现状分析
|
||||
};
|
||||
</script>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { ElForm, ElMessageBox, ElMessage } from 'element-plus';
|
||||
import { downloadFile } from '@/utils/index';
|
||||
import Page from '@/components/Pagination/page.vue';
|
||||
|
||||
import {
|
||||
queryRegionList,
|
||||
addRegion,
|
||||
updateRegion,
|
||||
delRegion,
|
||||
exportExcel
|
||||
} from '@/api/regionmodule/region';
|
||||
const queryInfo :any = ref({
|
||||
name:'',
|
||||
current:1,
|
||||
size:20,
|
||||
total:0
|
||||
})
|
||||
//定义表格数据
|
||||
const tableData: any = ref([]);
|
||||
function gteTabledata() {
|
||||
menuname.value = menuname.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: menuname.value,
|
||||
status:queryInfo.value.status,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
}
|
||||
loading.value = true
|
||||
queryRegionList(params).then((res) => {
|
||||
tableData.value = res.data.records
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
}).catch(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
const regionInfoRef = ref();
|
||||
const loading = ref(false);
|
||||
//定义搜索框文本
|
||||
const menuname = ref('')
|
||||
//点击搜索
|
||||
function search() {
|
||||
queryInfo.current = 1
|
||||
gteTabledata()
|
||||
}
|
||||
function resetdata(){
|
||||
menuname.value = ""
|
||||
queryInfo.value = {
|
||||
name:'',
|
||||
current:1,
|
||||
size:20,
|
||||
total:0
|
||||
}
|
||||
gteTabledata()
|
||||
}
|
||||
//目录添加
|
||||
const title = ref('')
|
||||
const regionInfo: any = ref({
|
||||
code: '',
|
||||
name: '',
|
||||
parent_id: '00',
|
||||
type: '2',
|
||||
education_bureau: '',
|
||||
status: '01'
|
||||
})
|
||||
const dialogVisible = ref(false)
|
||||
//关闭目录
|
||||
function handleClose() {
|
||||
dialogVisible.value = false;
|
||||
btnVisible.value = false;
|
||||
menuVisible.value = false;
|
||||
if (regionInfoRef.value != null) regionInfoRef.value.resetFields();
|
||||
}
|
||||
//表格规则定义
|
||||
const rules = ref({
|
||||
name: [
|
||||
{ required: true, message: '请输入区域名称', trigger: 'blur' }
|
||||
]
|
||||
})
|
||||
//添加子目录
|
||||
function addchilder(row: any,type:any,name:any) {
|
||||
regiontitle.value = name
|
||||
isSwitch.value = false
|
||||
parentName.value = row.name
|
||||
regionInfo.value = {
|
||||
code: '',
|
||||
name: '',
|
||||
parent_id: row.id,
|
||||
type: type,
|
||||
education_bureau: '',
|
||||
status: '01'
|
||||
}
|
||||
dialogVisible.value = true
|
||||
}
|
||||
//新增目录-确认按钮
|
||||
function expertsubmit() {
|
||||
if (regionInfo.value.name == '') {
|
||||
ElMessage({
|
||||
message: '请填写目录名称',
|
||||
type: 'error',
|
||||
})
|
||||
return false
|
||||
|
||||
}
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (regionInfo.value.id) {
|
||||
let params = {
|
||||
id:regionInfo.value.id,
|
||||
code: regionInfo.value.code,
|
||||
name: regionInfo.value.name,
|
||||
parentId: regionInfo.value.parent_id,
|
||||
type: regionInfo.value.type,
|
||||
educationBureau: regionInfo.value.education_bureau
|
||||
}
|
||||
updateRegion(params).then(() => {
|
||||
gteTabledata()
|
||||
dialogVisible.value = false
|
||||
ElMessage({
|
||||
message: '修改成功',
|
||||
type: 'success',
|
||||
})
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
let params = {
|
||||
code: regionInfo.value.code,
|
||||
name: regionInfo.value.name,
|
||||
parentId: regionInfo.value.parent_id,
|
||||
type: regionInfo.value.type,
|
||||
educationBureau: regionInfo.value.education_bureau,
|
||||
status: '01'
|
||||
}
|
||||
addRegion(params).then(() => {
|
||||
gteTabledata()
|
||||
dialogVisible.value = false
|
||||
ElMessage({
|
||||
message: '新建成功',
|
||||
type: 'success',
|
||||
})
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
}
|
||||
const menuVisible = ref(false)
|
||||
const regiontitle = ref('')
|
||||
const btnVisible = ref(false)
|
||||
|
||||
//修改信息
|
||||
function handleEdit(row: any) {
|
||||
isSwitch.value = false
|
||||
regionInfo.value = JSON.parse(JSON.stringify(row))
|
||||
regiontitle.value = '修改信息'
|
||||
dialogVisible.value = true
|
||||
}
|
||||
//新增信息
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
regiontitle.value = '新增省/直辖市'
|
||||
regionInfo.value = {
|
||||
code: '',
|
||||
name: '',
|
||||
parent_id: '00',
|
||||
type: '2',
|
||||
education_bureau: '',
|
||||
status: '01'
|
||||
}
|
||||
dialogVisible.value = true
|
||||
}
|
||||
function exportOut(){
|
||||
menuname.value = menuname.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name:menuname.value
|
||||
};
|
||||
exportExcel(params).then((response: any) => {
|
||||
downloadFile(response, '行政区域', 'xlsx')
|
||||
});
|
||||
}
|
||||
//删除
|
||||
function handleDelete(row: any) {
|
||||
ElMessageBox.confirm('确定删除此区域及此区域下的所有菜单吗?', '删除提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
const params = {
|
||||
id: row.id
|
||||
}
|
||||
delRegion(params).then(() => {
|
||||
gteTabledata()
|
||||
ElMessage({
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
}
|
||||
const parentName = ref("") // 上级区域名称
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
|
||||
var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
|
||||
var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
|
||||
}
|
||||
}
|
||||
|
||||
//状态改变
|
||||
function switchChange(row: any) {
|
||||
const elMessage = ref('')
|
||||
if (row.status == '00') {
|
||||
elMessage.value = "确定停用该行政区域吗?"
|
||||
} else if (row.status == '01') {
|
||||
elMessage.value = "确定启用该行政区域吗?"
|
||||
}
|
||||
ElMessageBox.confirm(elMessage.value, "提示信息", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
status: row.status,
|
||||
id: row.id,
|
||||
};
|
||||
updateRegion(params).then((res: any) => {
|
||||
if (res.code == 0) {
|
||||
gteTabledata()
|
||||
ElMessage({
|
||||
type: "success",
|
||||
message: "改变成功",
|
||||
})
|
||||
}
|
||||
}).catch(() => {
|
||||
if(row.status == "01"){
|
||||
row.status = "00"
|
||||
}else{
|
||||
row.status = "01"
|
||||
}
|
||||
})
|
||||
}).catch(() => {
|
||||
if(row.status == "01"){
|
||||
row.status = "00"
|
||||
}else{
|
||||
row.status = "01"
|
||||
}
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
gteTabledata()
|
||||
})
|
||||
</script>
|
||||
<template>
|
||||
<div class="collectiontemplate-box">
|
||||
<section class="detail-box">
|
||||
<div style="display: flex;display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; margin-bottom:10px">
|
||||
<div style="display: flex;display: -webkit-flex;">
|
||||
<el-input v-model="menuname" placeholder="请输入名称查询" clearable style="width:200px;margin-right:10px"
|
||||
@keyup.enter="search()" />
|
||||
<el-button type="primary" @click="search()">搜索</el-button>
|
||||
<el-button @click="resetdata">重置</el-button>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
<!-- <el-button type="primary" @click="addClick">
|
||||
<img src="@/assets/MenuIcon/jscz_xz.png" alt="" style="margin-right: 4px;">新增省/直辖市</el-button> -->
|
||||
<el-button type="primary" @click="exportOut"><img src="@/assets/MenuIcon/u455.png" alt="" style="margin-right: 5px;">导出</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="draggable">
|
||||
<el-table v-loading="loading" ref="multipleTable" :data="tableData" default-expand-all tooltip-effect="dark"
|
||||
style="width: 100%;height: calc(100vh - 240px)" row-key="id" border
|
||||
:header-cell-style="{ background: 'rgb(250 250 250)', color: '#383838', height: '50px' }">
|
||||
<el-table-column label="区域代码" width="150" prop="name" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<div>{{ scope.row.code }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="区域名称" prop="name" min-width="100" show-overflow-tooltip />
|
||||
<!-- <el-table-column label="上级ID" prop="parent_id" width="100" show-overflow-tooltip /> -->
|
||||
<el-table-column label="区域类型" prop="type" width="130" >
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.type == '1'">国家</span>
|
||||
<span v-if="scope.row.type == '2'">省/直辖市</span>
|
||||
<span v-if="scope.row.type == '3'">市/自治州</span>
|
||||
<span v-if="scope.row.type == '4'">区/县/县级市</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="教育局名称" prop="education_bureau" min-width="100" show-overflow-tooltip />
|
||||
<el-table-column label="地区地址" prop="custom1" min-width="100" show-overflow-tooltip />
|
||||
<el-table-column prop="creator" label="创建人" width="130"></el-table-column>
|
||||
<el-table-column prop="create_time" label="创建日期" width="180" align="center">
|
||||
<template #default="scope">
|
||||
{{ dateFormat(scope.row.create_time) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="160" fixed="right" align="center"
|
||||
style="display: flex; display: -webkit-flex;">
|
||||
<template #default="scope">
|
||||
<el-switch v-model="scope.row.status" active-value="01" inactive-value="00"
|
||||
@change="switchChange(scope.row)" style="margin-right: 4px"></el-switch>
|
||||
<span v-if="scope.row.status == '00'" class="effective">启用</span>
|
||||
<span v-else style="color: #d7d7d7">停用</span>
|
||||
<!-- <span
|
||||
style="display: flex;display: -webkit-flex; justify-content: space-around;-webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" alt="" title="修改"
|
||||
@click="handleEdit(scope.row)" style="cursor: pointer;">
|
||||
<img src="@/assets/MenuIcon/lbcz_zml.png" alt="" v-if="scope.row.type == '1'"
|
||||
title="添加省/直辖市" @click="addchilder(scope.row,'2','新增省/直辖市')" style="cursor: pointer;">
|
||||
<img src="@/assets/tableicon/u225.png" alt="" v-else-if="scope.row.type == '2'"
|
||||
title="添加市/自治州" @click="addchilder(scope.row,'3','新增市/自治州')" style="cursor: pointer;">
|
||||
<img src="@/assets/tableicon/u226.png" alt="" v-else-if="scope.row.type == '3'"
|
||||
title="添加区/县/县级市" @click="addchilder(scope.row,'4','新增区/县/县级市')" style="cursor: pointer;">
|
||||
<img src="@/assets/MenuIcon/lbcz_zml1.png" alt="" v-else
|
||||
style="cursor: pointer;">
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" alt="" v-if="scope.row.status == '09'"
|
||||
title="删除">
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" alt="" v-else title="删除"
|
||||
@click="handleDelete(scope.row)" style="cursor: pointer; ">
|
||||
</span> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="gteTabledata" />
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</section>
|
||||
<!-- 新增目录 -->
|
||||
<el-dialog v-model="dialogVisible" :close-on-click-modal="false" :before-close="handleClose" :title="regiontitle " draggable
|
||||
append-to-body width="620px" class="dialogClass">
|
||||
<el-form ref="regionInfoRef" :model="regionInfo" :rules="rules" label-width="90px">
|
||||
|
||||
<el-form-item label="上级区域" prop="code" v-if="regionInfo.type != '1' && regionInfo.type != '2' && regiontitle!='修改信息'">
|
||||
<el-input v-model="parentName" placeholder="" style="width: 100%;" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="区域代码" prop="code">
|
||||
<el-input v-model="regionInfo.code" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="区域名称" prop="name">
|
||||
<el-input v-model="regionInfo.name" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="教育局名称" prop="type">
|
||||
<el-input v-model="regionInfo.education_bureau" placeholder="" style="width: 100%;"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer"
|
||||
style="display: flex; display: -webkit-flex; justify-content: flex-end;-webkit-justify-content: flex-end;">
|
||||
<el-button @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" @click="expertsubmit">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.detail-box {
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
padding: 5px 20px 0px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.el-tooltip) {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.delicon {
|
||||
width: 20px;
|
||||
height: 25px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
// margin-left: 20px;
|
||||
|
||||
}
|
||||
|
||||
.delicon:hover {
|
||||
// background-color: red;
|
||||
|
||||
.delIcon {
|
||||
display: block !important;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
:deep(.el-table__expand-icon) {
|
||||
margin-left: 15px;
|
||||
margin-right: -10px !important;
|
||||
}
|
||||
</style>
|
@ -1,860 +0,0 @@
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'school'
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryRegion } from "@/api/regionmodule/region";
|
||||
import { querySchoolPage,addSchool,updateSchool,delSchool,exportExcel,downloadStudent,downloadSchoolTemplate } from "@/api/regionmodule/school";
|
||||
import { downloadFile } from '@/utils/index';
|
||||
import { publicTree } from '@/utils/validate';
|
||||
import { getDict } from '@/api/dict'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import * as XLSX from 'xlsx';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
const userStore = useUserStore();
|
||||
const url = userStore.webApiBaseUrl;
|
||||
//树形控件类型定义
|
||||
interface Tree {
|
||||
[x: string]: any;
|
||||
label: string;
|
||||
children?: Tree[];
|
||||
}
|
||||
//搜索内容
|
||||
const querystr = ref("");
|
||||
// 左侧树
|
||||
const treedata: any = ref([]);
|
||||
const defaultProps = { label: "name" };
|
||||
const handleNodeClick = (data: Tree) => {
|
||||
checkedtreeid.value = data.id;
|
||||
regionName.value = data.name;
|
||||
orgtype.value= data.type
|
||||
getData();
|
||||
};
|
||||
const infoForm = ref();
|
||||
const treeRef = ref();
|
||||
// 表格数组类型定义
|
||||
const tableData = ref([]);
|
||||
const checkedtreeid = ref("");
|
||||
const orgtype = ref("");
|
||||
|
||||
const loading = ref(false);
|
||||
const treeloading = ref(false);
|
||||
//新建学校数组
|
||||
const info:any = ref({
|
||||
id: "",
|
||||
region_id: "", //区域ID (学校所在城市
|
||||
code: "", // 学校代码
|
||||
name: "", // 学校名称
|
||||
education_code: "", // 教育机构编码
|
||||
org_type: "5", // 5- 学校
|
||||
teach_type:"", // 学校类型
|
||||
teacher_id: "", // 校长ID
|
||||
teacher_name: "", // 校长名称
|
||||
organization_id:"", // 筛查服务机构ID
|
||||
status:"01" // 01-初始创建 00-标志删除
|
||||
});
|
||||
const tempData:any = ref("")
|
||||
const title = ref("");
|
||||
const dialogVisible = ref(false);
|
||||
const regionName =ref(""); //行政区域名称
|
||||
const searchName =ref(""); //行政区域名称
|
||||
function searchInit(){
|
||||
treedata.value = publicTree(tempData.value,searchName.value)
|
||||
}
|
||||
//获取行政区域
|
||||
function getTree() {
|
||||
const params = {
|
||||
// name: searchName.value,
|
||||
status:'01'
|
||||
};
|
||||
treeloading.value = true
|
||||
queryRegion(params).then((res: any) => {
|
||||
tempData.value = JSON.parse(JSON.stringify(res.data))
|
||||
treedata.value = publicTree(res.data,"")
|
||||
treeloading.value = false
|
||||
checkedtreeid.value = ""
|
||||
if (checkedtreeid.value == "" &&treedata.value.length != 0) {
|
||||
checkedtreeid.value = res.data[0].id;
|
||||
orgtype.value= res.data[0].type
|
||||
regionName.value = res.data[0].name;
|
||||
}
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(checkedtreeid.value);
|
||||
});
|
||||
getData();
|
||||
})
|
||||
.catch((error:any)=>{
|
||||
treeloading.value = false
|
||||
})
|
||||
}
|
||||
const queryInfo :any = ref({
|
||||
current:1,
|
||||
size:10,
|
||||
total:0
|
||||
})
|
||||
//获取表格类型
|
||||
function getData() {
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: querystr.value,
|
||||
regionId: checkedtreeid.value,
|
||||
teachType:schoolType.value,
|
||||
type:orgtype.value,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
querySchoolPage(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
const multipleSelection = ref([]);
|
||||
//定义学校填写规则
|
||||
const moderules = reactive<FormRules>({
|
||||
code: [{ required: true, message: "请输入学校代码", trigger: "blur" }],
|
||||
name: [{ required: true, message: "请输入学校名称", trigger: "blur" }],
|
||||
teach_type: [{ required: true, message: "请选择办学类型", trigger: "change" }],
|
||||
custom1: [{ required: true, message: "请选择学校类型", trigger: "change" }]
|
||||
|
||||
|
||||
});
|
||||
function handleSelectionChange(val: any) {
|
||||
multipleSelection.value = val;
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
//新建学校-保存/修改
|
||||
function confirmClick(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
|
||||
if (info.value.id) {
|
||||
const data:any = {
|
||||
id:info.value.id,
|
||||
regionId: info.value.region_id, //区域ID (学校所在城市
|
||||
code: info.value.code, // 学校代码
|
||||
name: info.value.name, // 学校名称
|
||||
educationCode: info.value.education_code, // 教育机构编码
|
||||
orgType: "5", // 5- 学校
|
||||
teachType:info.value.teach_type,
|
||||
address:info.value.address,
|
||||
teacherId: info.value.teacher_id, // 校长ID
|
||||
teacherName: info.value.teacher_name, // 校长名称
|
||||
logo: info.value.logo,
|
||||
qrcode:info.value.qrcode,
|
||||
custom1:info.value.custom1
|
||||
};
|
||||
updateSchool(data).then((item) => {
|
||||
dialogVisible.value = false;
|
||||
ElMessage({
|
||||
message: "修改成功",
|
||||
type: "success",
|
||||
});
|
||||
getData();
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
const data:any = {
|
||||
regionId: info.value.region_id, //区域ID (学校所在城市
|
||||
code: info.value.code, // 学校代码
|
||||
name: info.value.name, // 学校名称
|
||||
educationCode: info.value.education_code, // 教育机构编码
|
||||
orgType: "5", // 5- 学校
|
||||
teachType:info.value.teach_type,
|
||||
teacherId: info.value.teacher_id, // 校长ID
|
||||
teacherName: info.value.teacher_name, // 校长名称
|
||||
status:"01", // 01-初始创建 00-标志删除
|
||||
address:info.value.address,
|
||||
logo: info.value.logo,
|
||||
qrcode:info.value.qrcode,
|
||||
custom1:info.value.custom1
|
||||
};
|
||||
addSchool(data).then((item) => {
|
||||
dialogVisible.value = false;
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "新增成功",
|
||||
type: "success",
|
||||
});
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
|
||||
|
||||
//新建学校
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
const infoagin = ref({
|
||||
id: null,
|
||||
region_id: checkedtreeid.value, //区域ID (学校所在城市
|
||||
code: "", // 学校代码
|
||||
name: "", // 学校名称
|
||||
education_code: "", // 教育机构编码
|
||||
org_type: "5", // 5- 学校
|
||||
teacher_id: "", // 校长ID
|
||||
teacher_name: "", // 校长名称
|
||||
teach_type:"", // 办学类型
|
||||
organization_id:"", // 筛查服务机构ID
|
||||
logo:"",
|
||||
qrcode:"",
|
||||
status:"01", // 01-初始创建 00-标志删除
|
||||
custom1:""
|
||||
});
|
||||
info.value = infoagin.value;
|
||||
title.value = "新增学校";
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//修改学校
|
||||
function editHandle(row: any) {
|
||||
isSwitch.value = false
|
||||
title.value = "修改学校";
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//删除学校
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定删除此学校吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delSchool(params).then((res:any) => {
|
||||
if(res.code=="0"){
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
}else{
|
||||
ElMessage({
|
||||
message: res.msg,
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
getTree();
|
||||
getDict({ dictcode: 'schoolType' }).then((res) => {
|
||||
schoolTypeList.value = res.data
|
||||
})
|
||||
});
|
||||
const vMove = {
|
||||
mounted(el: any) {
|
||||
el.onmousedown = function (e: any) {
|
||||
var init = e.clientX;
|
||||
var parent: any = document.getElementById("silderLeft");
|
||||
const initWidth: any = parent.offsetWidth;
|
||||
document.onmousemove = function (e) {
|
||||
var end = e.clientX;
|
||||
var newWidth = end - init + initWidth;
|
||||
parent.style.width = newWidth + "px";
|
||||
};
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function exportOut(){
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name:querystr.value,
|
||||
regionId:checkedtreeid.value,
|
||||
type:orgtype.value,
|
||||
regionName:regionName.value
|
||||
};
|
||||
exportExcel(params).then((response: any) => {
|
||||
downloadFile(response,regionName.value+ '-学校', 'xlsx')
|
||||
});
|
||||
}
|
||||
function downloadSchoolStudent(){
|
||||
downloadStudent({}).then((response: any) => {
|
||||
downloadFile(response, '学生基本信息导入模板', 'xlsx')
|
||||
});
|
||||
}
|
||||
function downloadSchool(){
|
||||
downloadSchoolTemplate({}).then((response: any) => {
|
||||
downloadFile(response, '学校基本信息导入模板', 'xlsx')
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
function uploadChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.logo =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
|
||||
function uploadQecodeChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.qrcode =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
|
||||
function delLogo(){
|
||||
info.value.logo = ""
|
||||
}
|
||||
function delQrcode(){
|
||||
info.value.qrcode = ""
|
||||
}
|
||||
const upload:any = ref(null)
|
||||
function handleSuccess(file: any) {
|
||||
if(file.code =="0"){
|
||||
ElMessage({
|
||||
message: "导入成功!",
|
||||
type: "success",
|
||||
});
|
||||
getData()
|
||||
upload.value.clearFiles()
|
||||
}else{
|
||||
ElMessage({
|
||||
message: "导入失败!",
|
||||
type: "error",
|
||||
});
|
||||
upload.value.clearFiles()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
const uploads:any = ref(null)
|
||||
|
||||
function handlePreview(){
|
||||
loading.value = true
|
||||
}
|
||||
|
||||
function handlesSuccess(file: any) {
|
||||
loading.value = false
|
||||
if(file.code == "0"){
|
||||
ElMessage({
|
||||
message: "导入成功!",
|
||||
type: "success",
|
||||
});
|
||||
getData()
|
||||
}else{
|
||||
errorData.value = []
|
||||
let msg = file.msg.split("!!<br>")
|
||||
msg.forEach(element => {
|
||||
errorData.value.push({name:element})
|
||||
});
|
||||
dialogTableVisible.value = true
|
||||
// ElMessage({
|
||||
// message: file.msg,
|
||||
// type: "error",
|
||||
// });
|
||||
}
|
||||
|
||||
upload.value.clearFiles()
|
||||
}
|
||||
function handleError(file: any){
|
||||
loading.value = false
|
||||
ElMessage({
|
||||
message: "导入失败!",
|
||||
type: "error",
|
||||
});
|
||||
upload.value.clearFiles()
|
||||
}
|
||||
|
||||
const dialogTableVisible = ref(false)
|
||||
const errorData:any = ref([])
|
||||
const schoolTypeList:any = ref([])
|
||||
const schoolType:any = ref("")
|
||||
function currency(list: any, itemcode: any) {
|
||||
let dictname = ''
|
||||
list.forEach((element: any) => {
|
||||
if (element.itemcode == itemcode) {
|
||||
dictname = element.dictname
|
||||
}
|
||||
})
|
||||
return dictname
|
||||
}
|
||||
function exportToExcel() {
|
||||
// 获取表格的 DOM 元素
|
||||
const table = document.querySelector('.school_table_error');
|
||||
|
||||
// 使用 html-to-xlsx 工具将表格转换为工作表
|
||||
const ws = XLSX.utils.table_to_sheet(table);
|
||||
// 设置列的宽度
|
||||
const colWidths = [
|
||||
{ wch: 5 },
|
||||
{ wch: 70 },
|
||||
];
|
||||
ws['!cols'] = colWidths;
|
||||
// 创建一个工作簿
|
||||
const wb = XLSX.utils.book_new();
|
||||
XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
|
||||
|
||||
// 导出 Excel 文件
|
||||
XLSX.writeFile(wb, '导入错误信息.xlsx');
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="faulttemplate-box">
|
||||
<aside id="silderLeft">
|
||||
<div class="lefttitle">
|
||||
<div class="line"></div>
|
||||
<div class="treetitle">行政区域</div>
|
||||
</div>
|
||||
<div style="padding:0 10px ;">
|
||||
<el-input v-model="searchName" placeholder="请输入行政区域" clearable style="width: 100%;margin-bottom: 10px;"
|
||||
@input="searchInit" />
|
||||
<el-tree v-loading="treeloading" default-expand-all
|
||||
ref="treeRef" node-key="id" :data="treedata" :highlight-current="true" :props="defaultProps"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick" style="height: calc(100vh - 245px); overflow: auto">
|
||||
</el-tree>
|
||||
</div>
|
||||
<div class="moveBtn" v-move>
|
||||
<div class="moveBtn-line" v-move></div>
|
||||
</div>
|
||||
</aside>
|
||||
<main class="silderRight">
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div style="display: flex;">
|
||||
<el-input v-model="querystr" placeholder="请输入学校名称" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-select style="width: 200px;margin-left: 10px;" clearable v-model="schoolType" placeholder="请选中办学类型"
|
||||
@change="getData">
|
||||
<el-option v-for="item in schoolTypeList" :key="item.itemcode" :label="item.dictname" :value="item.itemcode"/>
|
||||
</el-select>
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="right-nav">
|
||||
<el-button type="primary" @click="addClick"><img style="margin-right:5px;" src="@/assets/MenuIcon/jscz_xz.png" alt=""> 新增</el-button>
|
||||
<el-upload
|
||||
ref="upload"
|
||||
class="upload-demo"
|
||||
accept=".xlsx"
|
||||
:action=" url + '/base/school/importExcel/?regionId=' + checkedtreeid"
|
||||
:headers="{ token: getToken() }"
|
||||
:show-file-list="false"
|
||||
:on-success="handleSuccess">
|
||||
<el-button type="primary" style="margin: 0 10px;">
|
||||
<img src="@/assets/MenuIcon/u455.png" alt="" style="margin-right: 5px;">
|
||||
导入学校</el-button>
|
||||
</el-upload>
|
||||
<!-- <el-button type="primary" @click="downloadSchoolStudent"><img src="@/assets/MenuIcon/u458.png" alt="" style="margin-right: 5px;">下载学生模版</el-button> -->
|
||||
<el-button type="primary" @click="downloadSchool"><img src="@/assets/MenuIcon/u458.png" alt="" style="margin-right: 5px;">下载学校模版</el-button>
|
||||
<el-button type="primary" @click="exportOut"><img src="@/assets/MenuIcon/u458.png" alt="" style="margin-right: 5px;">导出</el-button>
|
||||
|
||||
|
||||
|
||||
<!-- <el-button :disabled="multipleSelection.length <= 0" :type="multipleSelection.length > 0 ? 'primary' : ''"
|
||||
@click="delClick"><el-icon>
|
||||
<Delete />
|
||||
</el-icon> 删除</el-button> -->
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%;height:calc(100vh - 260px); margin-bottom: 20px" row-key="id" border
|
||||
default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}" >
|
||||
<el-table-column prop="logo" label="学校logo" width="100" align="center">
|
||||
<template #default="scope">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
<img v-if="scope.row.logo != null&&scope.row.logo != ''" :src="scope.row.logo" style="width: 40px;height: 40px;" alt="">
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" label="学校代码" width="140"></el-table-column>
|
||||
<el-table-column prop="name" label="学校名称" min-width="120"></el-table-column>
|
||||
<el-table-column prop="education_code" label="教育机构编码" width="120"></el-table-column>
|
||||
<el-table-column prop="teacher_name" label="校长名称" width="90"></el-table-column>
|
||||
<el-table-column prop="teach_type" label="办学类型" width="170">
|
||||
<template #default="scope">{{ currency(schoolTypeList, scope.row.teach_type) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="custom1" label="学校类型" width="120">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.custom1 !=null && scope.row.custom1 !=''">
|
||||
{{ scope.row.custom1.split("-")[1] }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="address" label="学校地址" min-width="160"></el-table-column>
|
||||
<el-table-column prop="qrcode" label="公众号二维码" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
<img v-if="scope.row.qrcode != null&&scope.row.qrcode != ''" :src="scope.row.qrcode" style="width: 40px;height: 40px;" alt="">
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around;align-items: center; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" title="修改" style="cursor: pointer;"
|
||||
@click="editHandle(scope.row)" >
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="cursor: pointer;"
|
||||
@click="delHandle(scope.row)" >
|
||||
<!-- <el-upload
|
||||
ref="upload"
|
||||
accept=".xlsx"
|
||||
style="width: 16px; height: 16px;"
|
||||
:action=" url + '/base/school-student/importSchoolStudent/?schoolId=' + scope.row.id +'&schoolName=' + scope.row.name "
|
||||
:headers="{ token: getToken() }"
|
||||
:show-file-list="false"
|
||||
:before-upload="handlePreview"
|
||||
:on-success="handlesSuccess"
|
||||
:on-error="handleError">
|
||||
<img src="@/assets/tableicon/daochu.png" alt="" title="导入学生">
|
||||
</el-upload> -->
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
</main>
|
||||
<!-- 学校 弹框-->
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="title" draggable width="620px">
|
||||
|
||||
<el-form ref="infoForm" :model="info" label-width="100px" :rules="moderules">
|
||||
<!-- <el-form-item label="学校代码">
|
||||
<el-input v-model="info.code" style="width: 100%" placeholder="请输入学校代码"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="学校名称" prop="name">
|
||||
<el-input v-model="info.name" style="width: 100%" placeholder="请输入学校名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="教育机构编码" prop="education_code">
|
||||
<el-input v-model="info.education_code" style="width: 100%"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="校长id" prop="teacher_id">
|
||||
<el-input v-model="info.teacher_id" style="width: 100%"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="校长名称" prop="teacher_name">
|
||||
<el-input v-model="info.teacher_name" style="width: 100%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="办学类型" prop="teach_type">
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="info.teach_type"
|
||||
placeholder=""
|
||||
clearable
|
||||
filterable
|
||||
>
|
||||
<el-option
|
||||
v-for="item in schoolTypeList"
|
||||
:key="item.itemcode" :label="item.dictname" :value="item.itemcode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="学校地址" prop="organization_id">
|
||||
<el-input v-model="info.address" style="width: 100%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="学校类型" prop="custom1">
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="info.custom1"
|
||||
placeholder=""
|
||||
clearable
|
||||
filterable
|
||||
>
|
||||
<el-option :key="'1-幼儿园'" :label="'1-幼儿园'" :value="'1-幼儿园'"/>
|
||||
<el-option :key="'2-小学'" :label="'2-小学'" :value="'2-小学'"/>
|
||||
<el-option :key="'3-小学/初中'" :label="'3-小学/初中'" :value="'3-小学/初中'"/>
|
||||
<el-option :key="'4-初中'" :label="'4-初中'" :value="'4-初中'"/>
|
||||
<el-option :key="'5-初中/高中'" :label="'5-初中/高中'" :value="'5-初中/高中'"/>
|
||||
<el-option :key="'6-高中'" :label="'6-高中'" :value="'6-高中'"/>
|
||||
<el-option :key="'7-大学'" :label="'7-大学'" :value="'7-大学'"/>
|
||||
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
|
||||
|
||||
<el-form-item label="上传图片" prop="organization_id">
|
||||
<div style="display: flex;">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.logo">
|
||||
<img :src="info.logo" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delLogo"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">学校logo</div>
|
||||
</div>
|
||||
|
||||
</el-upload>
|
||||
<el-upload
|
||||
style="margin-left: 10px;"
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadQecodeChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.qrcode">
|
||||
<img :src="info.qrcode" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delQrcode"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">学校二维码</div>
|
||||
</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer">
|
||||
<el-button style="padding: 10px 15px" @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" style="padding: 10px 15px" @click="confirmClick(infoForm)">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog v-model="dialogTableVisible" title="导入错误信息列表" width="800">
|
||||
<el-button style="margin-bottom: 10px" type="primary" @click="exportToExcel">导出错误信息</el-button>
|
||||
<el-table class="school_table_error" :data="errorData" style="height: calc(100vh - 200px);" border>
|
||||
<el-table-column type="index" label="序号" width="90" />
|
||||
<el-table-column prop="name" label="内容" />
|
||||
</el-table>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.silderLeft-default {
|
||||
// :deep(.custom-tree-node, .treedelicon, .treeediticon) {
|
||||
// font-size: 16px !important;
|
||||
// }
|
||||
|
||||
// :deep(.custom-tree-large, .treedelicon, .treeediticon) {
|
||||
// font-size: 14px !important;
|
||||
// }
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
height: 100%;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
background-color: #f2f4f9;
|
||||
}
|
||||
|
||||
#silderLeft {
|
||||
width: 255px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
&:hover {
|
||||
.moveBtn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 拖动条 */
|
||||
.moveBtn {
|
||||
height: 100%;
|
||||
width: 15px;
|
||||
padding: 0 6px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -15px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.moveBtn-line {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
user-select: none;
|
||||
background-color: #60bfff;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
|
||||
.silderRight {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border-radius: 3px;
|
||||
padding: 15px;
|
||||
padding-bottom: 0px;
|
||||
margin-left: 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
// :deep(.el-tree-node.is-current > .el-tree-node__content) {
|
||||
// width: 100%;
|
||||
// height: 40px;
|
||||
// background-color: #409eff !important;
|
||||
// color: #fff !important;
|
||||
// }
|
||||
|
||||
// :deep(.el-tree-node__content) {
|
||||
// width: 100%;
|
||||
// height: 40px;
|
||||
// line-height: 40px;
|
||||
// }
|
||||
|
||||
// :deep(.el-tree-node__content:hover) {
|
||||
// background-color: #409eff19;
|
||||
// }
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
padding-right: 8px;
|
||||
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
.is-current .treeediticon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.is-current .treedelicon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treeediticon {
|
||||
color: #00cccc;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treedelicon {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
.treeediticon,
|
||||
.treedelicon {
|
||||
color: #fff;
|
||||
margin: 0 5px;
|
||||
}
|
||||
:deep(.el-table__cell){
|
||||
color: #383838;
|
||||
}
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
.right-nav{
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
}
|
||||
.lefttitle {
|
||||
min-width: 130px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px 15px;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #1B1B1B;
|
||||
border-bottom: 1px var(--el-border-color) var(--el-border-style);
|
||||
margin-bottom: 10px;
|
||||
.line{
|
||||
border-width: 0px;
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
margin-right: 7px;
|
||||
background: inherit;
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
:deep(.el-upload--picture-card){
|
||||
--el-upload-picture-card-size: 148px;
|
||||
background-color: var(--el-fill-color-lighter);
|
||||
border: 1px dashed var(--el-border-color-darker);
|
||||
border-radius: 6px;
|
||||
box-sizing: border-box;
|
||||
width: var(--el-upload-picture-card-size);
|
||||
height: var(--el-upload-picture-card-size);
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.newavatar-uploader-icon{
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
.newavatar-uploader-text{
|
||||
width: 100%;text-align: center;line-height: 20px;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #949494;
|
||||
}
|
||||
</style>
|
@ -1,900 +0,0 @@
|
||||
|
||||
<script lang="ts">
|
||||
// 班级管理
|
||||
export default {
|
||||
name: 'schoolClass' // 班级
|
||||
};
|
||||
</script>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryRegion } from "@/api/regionmodule/region";
|
||||
import { querySchoolList } from "@/api/regionmodule/school";
|
||||
import { querySchoolClassList, addSchoolClass,updateSchoolClass,delSchoolClass } from "@/api/regionmodule/schoolClass";
|
||||
import { querySchoolGradeList } from "@/api/regionmodule/schoolGrade"
|
||||
import { querySchoolTeacherList } from "@/api/regionmodule/schoolTeacher";
|
||||
import SchoolClass from "./schoolStudent.vue"
|
||||
import { publicTree } from '@/utils/validate';
|
||||
import { getToken } from '@/utils/auth'
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
const userStore = useUserStore();
|
||||
const url = userStore.webApiBaseUrl;
|
||||
const upload:any = ref(null)
|
||||
|
||||
function handlePreview(){
|
||||
loading.value = true
|
||||
}
|
||||
function handleSuccess(file: any) {
|
||||
loading.value = false
|
||||
ElMessage({
|
||||
message: "导入成功!",
|
||||
type: "success",
|
||||
});
|
||||
getData()
|
||||
upload.value.clearFiles()
|
||||
}
|
||||
function handleError(file: any){
|
||||
loading.value = false
|
||||
ElMessage({
|
||||
message: "导入失败!",
|
||||
type: "error",
|
||||
});
|
||||
upload.value.clearFiles()
|
||||
}
|
||||
const isHide =ref(false)
|
||||
function hideClick(item:any){
|
||||
// info.value = JSON.parse(JSON.stringify(item))
|
||||
classInfo.value= {
|
||||
school_id:schoolId.value,
|
||||
school_name:schoolName.value,
|
||||
grade_id: gradeId.value, //年级ID
|
||||
grade_code: gradeCode.value,//年级名称
|
||||
grade_name: gradeName.value,//年级名称
|
||||
class_id:item.id,
|
||||
class_code:item.code,
|
||||
class_name:item.name,
|
||||
class_order:item.class_order
|
||||
}
|
||||
isHide.value = true
|
||||
}
|
||||
const gradeData:any = ref([])
|
||||
const gradeName:any = ref("")
|
||||
const gradeCode:any = ref("")
|
||||
|
||||
function getGradeList(){
|
||||
let params = {
|
||||
schoolId: schoolId.value,
|
||||
};
|
||||
loading.value = true
|
||||
querySchoolGradeList(params).then((res:any) => {
|
||||
gradeId.value = ""
|
||||
gradeName.value = ""
|
||||
gradeCode.value = ""
|
||||
gradeData.value = res.data;
|
||||
if(res.data.length >0){
|
||||
gradeId.value = res.data[0].id
|
||||
gradeName.value = res.data[0].name
|
||||
gradeCode.value = res.data[0].code
|
||||
}
|
||||
getData()
|
||||
});
|
||||
}
|
||||
|
||||
const props1 = {
|
||||
checkStrictly: true,
|
||||
value:'id',
|
||||
label:'name'
|
||||
}
|
||||
//树形控件类型定义
|
||||
interface Tree {
|
||||
[x: string]: any;
|
||||
label: string;
|
||||
children?: Tree[];
|
||||
}
|
||||
//搜索内容
|
||||
const querystr = ref("");
|
||||
// 左侧树
|
||||
const cascaderdata: any = ref([]);
|
||||
const cascaderList:any = ref([]);
|
||||
const defaultProps = { label: "name" };
|
||||
const handleNodeClick = (data: Tree) => {
|
||||
schoolId.value = data.id;
|
||||
schoolName.value = data.name;
|
||||
getSchoolTeacher(data.id)
|
||||
getGradeList();
|
||||
};
|
||||
const infoForm = ref();
|
||||
const treeRef = ref();
|
||||
// 表格数组类型定义
|
||||
const tableData:any = ref([]);
|
||||
const loading = ref(false);
|
||||
const treeloading = ref(false);
|
||||
//新建班级数组
|
||||
const info:any = ref({
|
||||
grade_id: "", //学校id
|
||||
code: "", // 班级代码
|
||||
name: "", // 班级名称
|
||||
grade_type:"",
|
||||
org_type:"",
|
||||
teacher_id:"",
|
||||
teacher_name:""
|
||||
});
|
||||
const title = ref("");
|
||||
const dialogVisible = ref(false);
|
||||
const regionId =ref(""); //行政区域名称
|
||||
const regionType =ref("");
|
||||
//获取行政区域
|
||||
function getTree() {
|
||||
const params = {
|
||||
name: "",
|
||||
status:'01'
|
||||
};
|
||||
queryRegion(params).then((res: any) => {
|
||||
cascaderList.value = JSON.parse(JSON.stringify(res.data))
|
||||
cascaderdata.value = publicTree(res.data,"");
|
||||
})
|
||||
.catch((error:any)=>{
|
||||
treeloading.value = false
|
||||
})
|
||||
}
|
||||
const treeData:any = ref([])
|
||||
function getData(){
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
if(gradeId.value == ''){
|
||||
tableData.value = []
|
||||
loading.value = false
|
||||
return
|
||||
}
|
||||
let params = {
|
||||
name: querystr.value,
|
||||
gradeId: gradeId.value,
|
||||
};
|
||||
loading.value = true
|
||||
querySchoolClassList(params).then((res) => {
|
||||
tableData.value = res.data;
|
||||
loading.value = false
|
||||
}).catch(()=>{
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
const schoolId:any = ref("")
|
||||
const schoolName:any = ref("")
|
||||
//获取班级列表
|
||||
function getTreeData() {
|
||||
if(regionId.value == ''){
|
||||
treeData.value = []
|
||||
return
|
||||
}
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: "",
|
||||
regionId: regionId.value,
|
||||
type:regionType.value
|
||||
};
|
||||
treeloading.value = true
|
||||
querySchoolList(params).then((res) => {
|
||||
treeData.value = res.data;
|
||||
treeloading.value = false
|
||||
schoolId.value = ""
|
||||
schoolName.value = ""
|
||||
if (schoolId.value == "" &&cascaderdata.value.length != 0) {
|
||||
schoolId.value = res.data[0].id;
|
||||
schoolName.value = res.data[0].name;
|
||||
getSchoolTeacher(schoolId.value)
|
||||
}
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(schoolId.value);
|
||||
});
|
||||
getGradeList();
|
||||
}).catch(()=>{
|
||||
treeloading.value = false
|
||||
});
|
||||
}
|
||||
// 选中区域获取班级列表
|
||||
function handleChange(value:any){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
if(value.length != 0){
|
||||
regionId.value = value[value.length -1]
|
||||
for(let i=0;i<cascaderList.value.length;i++){
|
||||
if(regionId.value == cascaderList.value[i].id){
|
||||
regionType.value = cascaderList.value[i].type
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
getTreeData()
|
||||
}
|
||||
function cascaderClick(data:any){
|
||||
if(data.children == null){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
}
|
||||
regionId.value = data.id
|
||||
regionType.value = data.type
|
||||
getTreeData()
|
||||
}
|
||||
const multipleSelection = ref([]);
|
||||
//定义班级填写规则
|
||||
const moderules = reactive<FormRules>({
|
||||
code: [{ required: true, message: "请输入班级代码", trigger: "blur" }],
|
||||
name: [{ required: true, message: "请输入班级名称", trigger: "blur" }],
|
||||
class_order: [{ required: true, message: "请输入班级序号", trigger: "blur" }],
|
||||
class_type: [{ required: true, message: "请输入班级类型", trigger: "change" }],
|
||||
teacher_id: [{ required: true, message: "请选择班主任", trigger: "change" }],
|
||||
});
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
//新建班级-保存/修改
|
||||
function confirmClick(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (info.value.id) {
|
||||
const data:any = {
|
||||
id:info.value.id,
|
||||
gradeId: info.value.grade_id, //所在年级
|
||||
code: info.value.code, // 班级代码
|
||||
name: info.value.name, // 班级名称
|
||||
classOrder:info.value.class_order,
|
||||
classType:info.value.class_type,
|
||||
orgType:'7',
|
||||
teacherId:info.value.teacher_id,
|
||||
teacherName:info.value.teacher_name
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gende==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
updateSchoolClass(data).then((item) => {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
ElMessage({
|
||||
message: "修改成功",
|
||||
type: "success",
|
||||
});
|
||||
getData();
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
const data:any = {
|
||||
gradeId: info.value.grade_id, //学校ID
|
||||
code: info.value.code, // 班级代码
|
||||
name: info.value.name, // 班级名称
|
||||
classOrder:info.value.class_order,
|
||||
classType:info.value.class_type,
|
||||
orgType:'7',
|
||||
teacherId:info.value.teacher_id,
|
||||
teacherName:info.value.teacher_name
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gende==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
addSchoolClass(data).then((item) => {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "新增成功",
|
||||
type: "success",
|
||||
});
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
|
||||
|
||||
//新建班级
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
const infoagin = ref({
|
||||
id: null,
|
||||
grade_id: gradeId.value, //区域ID (班级所在城市
|
||||
code: "", // 班级代码
|
||||
name: "", // 班级名称
|
||||
class_order:"",
|
||||
class_type:"",
|
||||
org_type:"7",
|
||||
teacher_id:"",
|
||||
teacher_name:""
|
||||
|
||||
});
|
||||
info.value = infoagin.value;
|
||||
title.value = "新增班级";
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//修改班级
|
||||
function editHandle(row: any) {
|
||||
isSwitch.value = false
|
||||
title.value = "修改班级";
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//删除班级
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定删除此班级吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delSchoolClass(params).then((res:any) => {
|
||||
if(res.code=="0"){
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
}else{
|
||||
ElMessage({
|
||||
message: res.msg,
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
getTree();
|
||||
});
|
||||
const vMove = {
|
||||
mounted(el: any) {
|
||||
el.onmousedown = function (e: any) {
|
||||
var init = e.clientX;
|
||||
var parent: any = document.getElementById("silderLeft");
|
||||
const initWidth: any = parent.offsetWidth;
|
||||
document.onmousemove = function (e) {
|
||||
var end = e.clientX;
|
||||
var newWidth = end - init + initWidth;
|
||||
parent.style.width = newWidth + "px";
|
||||
};
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
const gradeId = ref("")
|
||||
function handleClick(e:any){
|
||||
|
||||
gradeId.value = e.props.name
|
||||
for( let i=0;i<gradeData.value.length; i++){
|
||||
if(e.props.name == gradeData.value[i].id){
|
||||
gradeName.value = gradeData.value[i].name
|
||||
gradeCode.value = gradeData.value[i].code
|
||||
}
|
||||
}
|
||||
getData()
|
||||
}
|
||||
function publicDict(list: any, itemcode: any) {
|
||||
let dictname = ''
|
||||
list.forEach((element: any) => {
|
||||
if (element.itemcode == itemcode) {
|
||||
dictname = element.dictname
|
||||
}
|
||||
})
|
||||
return dictname
|
||||
}
|
||||
|
||||
const classTypeList:any = ref([{
|
||||
itemcode:"1",
|
||||
dictname:"普通小学班"
|
||||
},{
|
||||
itemcode:"2",
|
||||
dictname:"少数民族小学班"
|
||||
},{
|
||||
itemcode:"3",
|
||||
dictname:"小学复式班"
|
||||
},{
|
||||
itemcode:"4",
|
||||
dictname:"小学教学点班"
|
||||
},{
|
||||
itemcode:"5",
|
||||
dictname:"小学特长班(文体艺智)"
|
||||
},{
|
||||
itemcode:"6",
|
||||
dictname:"小学视力残疾班"
|
||||
},{
|
||||
itemcode:"7",
|
||||
dictname:"小学听力残疾班"
|
||||
},{
|
||||
itemcode:"8",
|
||||
dictname:"小学智力残疾班"
|
||||
},{
|
||||
itemcode:"9",
|
||||
dictname:"普通初中班"
|
||||
},{
|
||||
itemcode:"10",
|
||||
dictname:"少数民族初中班"
|
||||
},{
|
||||
itemcode:"11",
|
||||
dictname:"初中复式班"
|
||||
},{
|
||||
itemcode:"12",
|
||||
dictname:"初中教学点班"
|
||||
},{
|
||||
itemcode:"13",
|
||||
dictname:"初中特长班(文体艺智)"
|
||||
},{
|
||||
itemcode:"14",
|
||||
dictname:"初中视力残疾班"
|
||||
},{
|
||||
itemcode:"15",
|
||||
dictname:"初中听力残疾班"
|
||||
},{
|
||||
itemcode:"16",
|
||||
dictname:"初中智力残疾班"
|
||||
},{
|
||||
itemcode:"17",
|
||||
dictname:"普通高中班"
|
||||
},{
|
||||
itemcode:"18",
|
||||
dictname:"少数名族高中班"
|
||||
},{
|
||||
itemcode:"19",
|
||||
dictname:"高中复式班"
|
||||
},{
|
||||
itemcode:"20",
|
||||
dictname:"高中教学点班"
|
||||
},{
|
||||
itemcode:"21",
|
||||
dictname:"高中特长班(文体艺智)"
|
||||
},{
|
||||
itemcode:"22",
|
||||
dictname:"高中残疾班"
|
||||
}])
|
||||
|
||||
const schoolTeacherData:any = ref([])
|
||||
function getSchoolTeacher(schoolId:any){
|
||||
let params ={
|
||||
name:'',
|
||||
schoolId:schoolId
|
||||
}
|
||||
querySchoolTeacherList(params).then((res) => {
|
||||
schoolTeacherData.value = res.data;
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function teacherChange(e:any){
|
||||
for(let i=0;i<schoolTeacherData.value.length;i++){
|
||||
if(schoolTeacherData.value[i].id == e){
|
||||
info.value.teacher_name = schoolTeacherData.value[i].name
|
||||
}
|
||||
}
|
||||
}
|
||||
function returnClick(e:any){
|
||||
isHide.value = false
|
||||
}
|
||||
const classInfo:any= ref({
|
||||
school_id: "",
|
||||
school_name: "",
|
||||
grade_id: "", //年级ID
|
||||
grade_name: "",//年级名称
|
||||
class_id: "",
|
||||
class_name: "",
|
||||
class_order: ""
|
||||
})
|
||||
const isCascader=ref(true)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="faulttemplate-box">
|
||||
<aside id="silderLeft" v-show="isHide == false">
|
||||
<div class="lefttitle">
|
||||
<div class="line"></div>
|
||||
<div class="treetitle">学校列表</div>
|
||||
</div>
|
||||
<div style="width:100% ;display: flex;">
|
||||
<el-cascader v-if="isCascader" style="width: 90%; margin: auto;" placeholder="请输入行政区域" v-model="regionId" @change="handleChange" :options="cascaderdata" :props="props1" :show-all-levels="false" filterable>
|
||||
<template #default="{ node, data }">
|
||||
<div @click.stop="cascaderClick(data)">{{ data.name }}</div>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</div>
|
||||
<el-tree v-loading="treeloading"
|
||||
ref="treeRef" node-key="id" :data="treeData" :highlight-current="true" :props="defaultProps"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick" style="height: calc(100vh - 245px); overflow: auto;margin-top: 10px;">
|
||||
</el-tree>
|
||||
|
||||
<div class="moveBtn" v-move>
|
||||
<div class="moveBtn-line" v-move></div>
|
||||
</div>
|
||||
</aside>
|
||||
<main class="silderRight" v-show="isHide == false">
|
||||
<el-tabs v-model="gradeId" class="demo-tabs tstab" @tab-click="handleClick" style="width:calc(100% - 20px);margin-left: 5px;">
|
||||
<el-tab-pane v-for="item in gradeData" :label="item.name" :name="item.id"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-row style="margin-bottom: 10px;width:calc(100% - 20px);margin-left: 5px;">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div>
|
||||
<el-input v-model="querystr" placeholder="请输入班级名称" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button :disabled="regionId==''" type="primary" @click="addClick"><img style="margin-right:5px;" src="@/assets/MenuIcon/jscz_xz.png" alt=""> 新增</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="schoolClassUi" v-loading="loading">
|
||||
<div class="schoolClassLis" v-for="item in tableData" :key="item.id">
|
||||
<img class="imgclass" src="@/assets/MenuIcon/lbcz_xg.png" title="修改" style="right: 50px;"
|
||||
@click="editHandle(item)" >
|
||||
<img class="imgclass" src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="right: 20px;"
|
||||
@click="delHandle(item)" >
|
||||
<div style="display:flex ;align-items: center;margin-bottom: 20px;">
|
||||
<div class="classicon"><svg t="1710840701610" class="icon" viewBox="0 0 1199 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4876" width="32" height="32"><path d="M721.808902 217.684596v-0.239565a38.51005 38.51005 0 0 0 38.549977-38.809506v-139.746164A38.490086 38.490086 0 0 0 721.868793 0.279492 38.929289 38.929289 0 0 0 682.759831 39.088998v139.746165a38.969216 38.969216 0 0 0 11.459185 27.470103 38.490086 38.490086 0 0 0 27.549958 11.359367z m-481.325717 0a38.929289 38.929289 0 0 0 39.108962-38.809506v-139.746164a39.108962 39.108962 0 0 0-78.217924 0v139.746164a38.929289 38.929289 0 0 0 39.108962 38.809506z" p-id="4877" fill="#ff9900"></path><path d="M962.531651 155.577408a62.027333 62.027333 0 0 0-61.887587-62.167079h-77.698867v69.873082a101.086386 101.086386 0 1 1-202.172772 0v-69.873082H341.559589v69.873082a101.086386 101.086386 0 1 1-202.172772 0v-69.873082H61.787768A61.887587 61.887587 0 0 0 0 151.005712v200.994912h962.531651V155.577408z" p-id="4878" fill="#ff9900"></path><path d="M962.531651 352.000624h0.918332v14.713275h-0.918332z" fill="#ff9900" p-id="4879"></path><path d="M0 366.713899v538.721463a61.887587 61.887587 0 0 0 61.787768 57.515528H707.714503a307.022323 307.022323 0 0 1 241.561227-496.398339c4.392022 0 8.764081 0.119782 13.096212 0.299456v-100.138108z m289.59398 200.735383q-1.577135 23.357573-4.691479 70.13261-3.154271 62.366717-4.691478 91.933013a310.296376 310.296376 0 0 0-31.203322-1.537208q6.208722-71.649855 9.323065-162.125514l31.263214 1.597099zM121.259743 796.553136a356.831848 356.831848 0 0 0 46.775038-6.24865V682.759831H129.005673v-37.392081h38.98918v-85.704326H125.931258v-38.98918h124.693506v38.98918h-43.640731v85.704326h34.297701v37.372117h-34.297701v102.933032c5.190572-1.058078 12.477336-2.096192 21.820365-3.09438a127.987523 127.987523 0 0 1 21.820366-3.094379q0 20.303121 1.537207 38.98918-48.292282 3.154271-124.693506 17.108923L121.259743 796.553136z m126.270641 46.73511q35.934728-38.929289 46.775038-79.515567 12.417445-38.929289 12.477336-112.196207v-151.165422h38.98918v152.742558q3.154271 143.379564-63.883961 215.08931a383.643148 383.643148 0 0 0-34.357593-24.954672z m252.521319 3.154271h-154.339657v-34.237811h59.252374v-116.907648h-45.23783v-37.392081h45.23783v-99.818688h-45.23783v-37.352154h130.862301v37.372117h-46.715146v99.818689h43.620767v37.372117h-43.620767v116.907648h56.098103v34.277738z" p-id="4880" fill="#ff9900"></path><path d="M1159.573743 825.04139h-26.511844a190.194529 190.194529 0 0 1-18.406566 44.199715l24.475543 24.535434a40.127113 40.127113 0 0 1 0 56.77687l-14.214182 14.214181a40.127113 40.127113 0 0 1-56.77687 0l-24.655216-24.655216a190.653695 190.653695 0 0 1-43.920223 18.10711v25.613476a40.16704 40.16704 0 0 1-40.16704 40.16704H939.293861a40.16704 40.16704 0 0 1-40.167041-40.16704v-25.753222a187.978555 187.978555 0 0 1-43.920223-18.10711l-24.655216 24.655216a40.127113 40.127113 0 0 1-56.77687 0l-14.214181-14.214181a40.127113 40.127113 0 0 1 0-56.77687l24.495506-24.535434a189.07656 189.07656 0 0 1-18.406566-44.119861h-26.551771a40.16704 40.16704 0 0 1-40.167041-40.16704v-20.063556a40.16704 40.16704 0 0 1 40.167041-40.167041h26.192424a188.437721 188.437721 0 0 1 17.78769-43.740549l-23.517283-23.617102a40.127113 40.127113 0 0 1 0-56.77687l14.15429-14.214181a40.127113 40.127113 0 0 1 56.77687 0l23.118008 23.118008a188.278011 188.278011 0 0 1 45.477395-19.025442v-26.951046a40.16704 40.16704 0 0 1 40.16704-40.16704h20.08352a40.16704 40.16704 0 0 1 40.167041 40.16704v26.931082a188.278011 188.278011 0 0 1 45.477394 19.025442l23.118009-23.118008a40.127113 40.127113 0 0 1 56.77687 0l14.214181 14.214181a40.127113 40.127113 0 0 1 0 56.77687L1115.453883 680.763457a193.468582 193.468582 0 0 1 17.78769 43.740549h26.192424a40.16704 40.16704 0 0 1 40.16704 40.167041v20.08352a40.127113 40.127113 0 0 1-40.107149 40.286823z m-209.459536-167.695397a118.1454 118.1454 0 0 0-0.618876 236.270836c65.301386 0 118.824167-52.883941 118.824167-118.1454s-53.562708-118.1454-118.884058-118.1454z m-0.738659 167.076521a50.2088 50.2088 0 1 1 50.168873-50.228764 50.228764 50.228764 0 0 1-50.168873 50.168873z" p-id="4881" fill="#ff9900"></path></svg></div>
|
||||
<div class="classtitle">{{ item.name }}</div>
|
||||
</div>
|
||||
<div style="display:flex ;align-items: center;margin-bottom: 15px;">
|
||||
<img src="@/assets/tableicon/u203.png" alt="">
|
||||
<div class="classtext">班级类型:{{ publicDict(classTypeList,item.class_type) }}</div>
|
||||
</div>
|
||||
<div style="display:flex ;align-items: center;">
|
||||
<img src="@/assets/tableicon/u197.png" alt="">
|
||||
<div class="classtext">班主任:{{ item.teacher_name }}</div>
|
||||
</div>
|
||||
<div class="classbutton" @click="hideClick(item)">查看学生</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<!-- 班级 弹框-->
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="title" draggable width="620px">
|
||||
<el-form ref="infoForm" :model="info" label-width="100px" :rules="moderules">
|
||||
<el-form-item label="所在年级" prop="code">
|
||||
<el-input v-model="gradeName" style="width: 100%" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="班级代码" prop="code">
|
||||
<el-input v-model="info.code" style="width: 100%" placeholder="请输入班级代码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="班级名称" prop="name">
|
||||
<el-input v-model="info.name" style="width: 100%" placeholder="请输入班级名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="班级序号" prop="class_order">
|
||||
<el-input v-model.number="info.class_order" style="width: 100%" placeholder="请输入班级序号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="班级类型" prop="class_type">
|
||||
<el-select v-model="info.class_type" class="!w-full" placeholder="请选择班级类型">
|
||||
<el-option v-for="(i, index) in classTypeList" :key="index" :label="i.dictname"
|
||||
:value="i.itemcode"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="班级老师">
|
||||
<el-select v-model="info.teacher_id" class="!w-full" placeholder="请选择年级主任" @change="teacherChange"
|
||||
filterable>
|
||||
<el-option v-for="(i, index) in schoolTeacherData" :key="index" :label="i.code + ' - ' + i.name +
|
||||
' - ' + (i.gender == '0'?'不详':'') + (i.gender == '1'?'男':'') + (i.gender == '2'?'女':'')
|
||||
"
|
||||
:value="i.id">
|
||||
<span>{{ i.code }}</span>
|
||||
<span> - </span>
|
||||
<span>{{ i.name }}</span>
|
||||
<span> - </span>
|
||||
<span v-if="i.gender == '0'">不详</span>
|
||||
<span v-if="i.gender == '1'">男</span>
|
||||
<span v-if="i.gender == '2'">女</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer">
|
||||
<el-button style="padding: 10px 15px" @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" style="padding: 10px 15px" @click="confirmClick(infoForm)">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<SchoolClass v-if="isHide == true" :classInfo="classInfo" @returnClick="returnClick"/>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.silderLeft-default {
|
||||
:deep(.custom-tree-node, .treedelicon, .treeediticon) {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
:deep(.custom-tree-large, .treedelicon, .treeediticon) {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
height: 100%;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
background-color: #f2f4f9;
|
||||
}
|
||||
|
||||
#silderLeft {
|
||||
width: 255px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
&:hover {
|
||||
.moveBtn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 拖动条 */
|
||||
.moveBtn {
|
||||
height: 100%;
|
||||
width: 15px;
|
||||
padding: 0 6px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -15px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.moveBtn-line {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
user-select: none;
|
||||
background-color: #60bfff;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
|
||||
.silderRight {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border-radius: 3px;
|
||||
padding: 10px;
|
||||
padding-bottom: 0px;
|
||||
padding-right: 0px;
|
||||
margin-left: 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node.is-current > .el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background-color: #409eff !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content:hover) {
|
||||
background-color: #409eff19;
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
padding-right: 8px;
|
||||
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
.is-current .treeediticon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.is-current .treedelicon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treeediticon {
|
||||
color: #00cccc;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treedelicon {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
.treeediticon,
|
||||
.treedelicon {
|
||||
color: #fff;
|
||||
margin: 0 5px;
|
||||
}
|
||||
:deep(.el-table__cell){
|
||||
color: #383838;
|
||||
}
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
|
||||
.lefttitle {
|
||||
min-width: 130px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px 15px;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #1B1B1B;
|
||||
border-bottom: 1px var(--el-border-color) var(--el-border-style);
|
||||
margin-bottom: 10px;
|
||||
.line{
|
||||
border-width: 0px;
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
margin-right: 7px;
|
||||
background: inherit;
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
:deep(.el-upload--picture-card){
|
||||
--el-upload-picture-card-size: 148px;
|
||||
background-color: var(--el-fill-color-lighter);
|
||||
border: 1px dashed var(--el-border-color-darker);
|
||||
border-radius: 6px;
|
||||
box-sizing: border-box;
|
||||
width: var(--el-upload-picture-card-size);
|
||||
height: var(--el-upload-picture-card-size);
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.newavatar-uploader-icon{
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
.newavatar-uploader-text{
|
||||
width: 100%;text-align: center;line-height: 20px;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #949494;
|
||||
}
|
||||
.schoolClassUi{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: flex-start;
|
||||
height: calc(100vh - 260px);
|
||||
overflow: auto;
|
||||
padding-top: 5px;
|
||||
padding-left: 5px;
|
||||
.schoolClassLis{
|
||||
position: relative;
|
||||
width: 331px;
|
||||
height: 150px;
|
||||
padding: 15px;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 13px;
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
line-height: normal;
|
||||
border: 1px solid #C6E2FF;
|
||||
border-radius: 8px;
|
||||
margin-bottom:12px;
|
||||
margin-right:12px;
|
||||
.imgclass{
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
.classicon{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: inherit;
|
||||
background-color: rgba(255, 153, 0, 0.0980392156862745);
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #FF9900;
|
||||
margin-right: 15px;
|
||||
}
|
||||
.classtitle{
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #333333;
|
||||
}
|
||||
.classtext{
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #787878;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.classbutton{
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
display: flex;
|
||||
align-items:center ;
|
||||
justify-content: center;
|
||||
border: 1px solid #C6E2FF;
|
||||
background: rgb(236, 245, 255);
|
||||
border-radius:4px;
|
||||
width: 80px;
|
||||
height: 32px;
|
||||
font-family: 微软雅黑;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: rgb(64, 158, 255);
|
||||
cursor: pointer;
|
||||
}
|
||||
.classbutton:hover{
|
||||
background: rgb(64, 158, 255);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.schoolClassLis:hover{
|
||||
border: 1px solid transparent;
|
||||
box-shadow: 0 0 0 2px rgb(64, 158, 255);
|
||||
.imgclass{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.el-tabs__item){
|
||||
font-size:18px;
|
||||
font-weight: 700;
|
||||
}
|
||||
:deep(.el-tabs__active-bar){
|
||||
height: 3px;
|
||||
}
|
||||
</style>
|
File diff suppressed because it is too large
Load Diff
@ -1,186 +0,0 @@
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'studentInfolog' // 系统_学生信息变动日志
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from "vue";
|
||||
import { queryStudentInfolog } from "@/api/regionmodule/schoolStudent";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
|
||||
const emit = defineEmits([ 'returnStudent']);
|
||||
const props:any = defineProps({
|
||||
studentInfo: {
|
||||
required: false,
|
||||
type: Object,
|
||||
default: {}
|
||||
}
|
||||
})
|
||||
function returnClick(){
|
||||
emit('returnStudent', '1');
|
||||
}
|
||||
const date:any = ref('')
|
||||
|
||||
const loading = ref(false)
|
||||
const tableData:any = ref([])
|
||||
const queryInfo:any = ref({
|
||||
total:0,
|
||||
size:20,
|
||||
current:1,
|
||||
})
|
||||
function getData(){
|
||||
if(props.studentInfo.id == '' || props.studentInfo.id == null){
|
||||
tableData.value = []
|
||||
return
|
||||
}
|
||||
let startDate = ''
|
||||
let endDate = ''
|
||||
if(date != null && date!='' && date.length!=0){
|
||||
startDate = date.value[0]
|
||||
endDate = date.value[1]
|
||||
}
|
||||
let params = {
|
||||
startDate:startDate,
|
||||
endDate:endDate,
|
||||
studentId: props.studentInfo.id,
|
||||
size:queryInfo.value.size,
|
||||
current:queryInfo.value.current,
|
||||
};
|
||||
loading.value = true
|
||||
queryStudentInfolog(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
}).catch(()=>{
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month =
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day;
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
getData();
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<div style="padding-right: 20px;">
|
||||
<div class="schoolStudent-title">
|
||||
<div class="class_order">学生信息变动日志</div>
|
||||
<div class="return" @click="returnClick">
|
||||
<img src="@/assets/tableicon/u549.png" alt="">
|
||||
<div style="padding-left: 2px;padding-top: 2px;">返回</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="schoolStudent-line"></div>
|
||||
<el-date-picker
|
||||
style="margin: 10px 0;"
|
||||
v-model="date"
|
||||
type="daterange"
|
||||
value-format="YYYY-MM-DD"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
@change="getData">
|
||||
</el-date-picker>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%; height:calc(100vh - 300px)" row-key="id" border
|
||||
default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}" >
|
||||
<el-table-column type="index" width="60" label="序号"></el-table-column>
|
||||
<el-table-column prop="log_time" label="日志时间" width="140" align="center">
|
||||
<template #default="scope">
|
||||
{{dateFormat(scope.row.log_time)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="姓名" width="100"></el-table-column>
|
||||
<!-- <el-table-column prop="vision_right" label="性别" width="100"></el-table-column> -->
|
||||
<el-table-column prop="school" label="所属学校" width="200"></el-table-column>
|
||||
<el-table-column prop="grade_class" label="所属年级班级" width="200"></el-table-column>
|
||||
<el-table-column prop="log_type" label="类型" width="100">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.log_type == '01'">添加</span>
|
||||
<span v-if="scope.row.log_type == '02'">修改信息</span>
|
||||
<span v-if="scope.row.log_type == '03'">删除</span>
|
||||
<span v-if="scope.row.log_type == '04'">升级</span>
|
||||
<span v-if="scope.row.log_type == '05'">调班</span>
|
||||
<span v-if="scope.row.log_type == '05'">转校</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="log_info" label="日志描述" min-width="100"></el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.schoolStudent-title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #282828;
|
||||
.class_order{
|
||||
padding-bottom: 5px;
|
||||
border-bottom:3px solid #409eff;
|
||||
}
|
||||
.return{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #409EFF;
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
border: 1px solid #C6E2FF;
|
||||
background: rgb(236, 245, 255);
|
||||
border-radius:4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.schoolStudent-line{
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: rgb(220, 223, 230);
|
||||
margin-top: -1px;
|
||||
}
|
||||
.basicname{
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #333333;
|
||||
text-align: left;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.basicinfo{
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #787878;
|
||||
text-align: left;
|
||||
}
|
||||
.valuetext{
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #363636;
|
||||
padding-right: 50px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
@ -1,18 +0,0 @@
|
||||
<script lang="ts">
|
||||
// 学生视力数据档案
|
||||
export default {
|
||||
name: 'studentVisdata' // 学生视力数据档案
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
</script>
|
||||
<template>
|
||||
<div class="">
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
</style>
|
@ -1,508 +0,0 @@
|
||||
<script lang="ts">
|
||||
// 学生视力数据档案
|
||||
export default {
|
||||
name: 'studentVisdata' // 学生视力数据档案
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick,watch } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryStudentVisdataList,queryVisionChangeTrend,exportVisionForm } from "@/api/regionmodule/schoolStudent";
|
||||
|
||||
import { useDark } from '@vueuse/core'
|
||||
|
||||
import Viewfile from "@/views/component/Viewfile.vue";
|
||||
import * as echarts from 'echarts';
|
||||
import { downloadFile } from '@/utils/index'
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
const userStore = useUserStore();
|
||||
const url = userStore.webApiBaseUrl;
|
||||
const emit = defineEmits([ 'returnStudent']);
|
||||
let isDark:any = useDark().value == true? '1' : '2'
|
||||
watch(useDark(), () => {
|
||||
isDark = useDark().value == true? '1' : '2'
|
||||
if (useDark().value == true) {
|
||||
facechange('1')
|
||||
} else {
|
||||
facechange('2')
|
||||
}
|
||||
})
|
||||
const props:any = defineProps({
|
||||
studentInfo: {
|
||||
required: false,
|
||||
type: Object,
|
||||
default: {}
|
||||
}
|
||||
})
|
||||
function returnClick(){
|
||||
emit('returnStudent', '1');
|
||||
}
|
||||
function getData(){
|
||||
if(props.studentInfo.id == '' || props.studentInfo.id == null){
|
||||
tableData.value = []
|
||||
return
|
||||
}
|
||||
let params = {
|
||||
studentId: props.studentInfo.id,
|
||||
};
|
||||
loading.value = true
|
||||
queryStudentVisdataList(params).then((res) => {
|
||||
tableData.value = res.data;
|
||||
loading.value = false
|
||||
}).catch(()=>{
|
||||
loading.value = false
|
||||
});
|
||||
queryVisionChangeTrend(params).then((res) => {
|
||||
let date = []
|
||||
for(let i=0;i<res.data.exam_time.length;i++){
|
||||
date.push(dateFormat(res.data.exam_time[i]))
|
||||
}
|
||||
option.value.xAxis.data = date
|
||||
option.value.series[0].data = res.data.vision_left
|
||||
option.value.series[1].data = res.data.vision_right
|
||||
option2.value.xAxis.data = date
|
||||
option2.value.series[0].data = res.data.se_left
|
||||
option2.value.series[1].data = res.data.se_right
|
||||
|
||||
}).catch(()=>{
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
let myCanvas1:any = null
|
||||
let myCanvas2:any = null
|
||||
onMounted(() => {
|
||||
activeName.value = '1'
|
||||
getData();
|
||||
window.onresize = ()=>{
|
||||
if(myCanvas1 != null){
|
||||
myCanvas1.resize()
|
||||
}
|
||||
if(myCanvas2 != null){
|
||||
myCanvas2.resize()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
function handleClick(tab:any, event:any){
|
||||
if (isDark === '1') {
|
||||
facechange('1')
|
||||
}else{
|
||||
facechange('2')
|
||||
}
|
||||
if(tab.props.name == '2'){
|
||||
setTimeout(()=>{
|
||||
myCanvas1 = echarts.init(document.getElementById('myEchart1'))
|
||||
myCanvas1.clear()
|
||||
myCanvas1.setOption(option.value)
|
||||
},200)
|
||||
|
||||
}
|
||||
if(tab.props.name == '3'){
|
||||
setTimeout(()=>{
|
||||
myCanvas2 = echarts.init(document.getElementById('myEchart2'))
|
||||
myCanvas2.clear()
|
||||
myCanvas2.setOption(option2.value)
|
||||
},200)
|
||||
|
||||
}
|
||||
}
|
||||
function facechange(type:any){
|
||||
if (type === '1') {
|
||||
option.value.xAxis.axisLabel.color = '#ffffff'
|
||||
option.value.yAxis.axisLabel.color = '#ffffff'
|
||||
option.value.yAxis.splitLine.lineStyle.color = '#4c4d4f'
|
||||
option.value.legend.textStyle.color = '#ffffff'
|
||||
option2.value.xAxis.axisLabel.color = '#ffffff'
|
||||
option2.value.yAxis.axisLabel.color = '#ffffff'
|
||||
option2.value.yAxis.splitLine.lineStyle.color = '#4c4d4f'
|
||||
option2.value.legend.textStyle.color = '#ffffff'
|
||||
}else{
|
||||
option.value.xAxis.axisLabel.color = '#787878'
|
||||
option.value.yAxis.axisLabel.color = '#787878'
|
||||
option.value.yAxis.splitLine.lineStyle.color = '#E0E6F1'
|
||||
option.value.legend.textStyle.color = '#000000'
|
||||
|
||||
option2.value.xAxis.axisLabel.color = '#787878'
|
||||
option2.value.yAxis.axisLabel.color = '#787878'
|
||||
option2.value.yAxis.splitLine.lineStyle.color = '#E0E6F1'
|
||||
option2.value.legend.textStyle.color = '#000000'
|
||||
}
|
||||
if (myCanvas1) {
|
||||
myCanvas1.clear()
|
||||
myCanvas1.setOption(option.value);
|
||||
myCanvas1.resize()
|
||||
}
|
||||
if (myCanvas2) {
|
||||
myCanvas2.clear()
|
||||
myCanvas2.setOption(option2.value);
|
||||
myCanvas2.resize()
|
||||
}
|
||||
}
|
||||
const loading = ref(false)
|
||||
const tableData:any = ref([])
|
||||
const activeName = ref("1")
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate()
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day ;
|
||||
}
|
||||
}
|
||||
|
||||
const option:any = ref({
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
data: ['左眼视力', '右眼视力'],
|
||||
textStyle:{
|
||||
color:'#000'
|
||||
},
|
||||
left:'left',
|
||||
icon: 'rect',
|
||||
itemWidth: 15,
|
||||
itemHeight: 2,
|
||||
itemGap: 40
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
},
|
||||
splitLine:{
|
||||
lineStyle: {
|
||||
color: '#E0E6F1'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '左眼视力',
|
||||
type: 'line',
|
||||
data: []
|
||||
},
|
||||
{
|
||||
name: '右眼视力',
|
||||
type: 'line',
|
||||
data: []
|
||||
}
|
||||
]
|
||||
})
|
||||
const option2:any = ref({
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
data: ['左眼等效球镜', '右眼等效球镜'],
|
||||
textStyle:{
|
||||
color:'#000'
|
||||
},
|
||||
left:'left',
|
||||
icon: 'rect',
|
||||
itemWidth: 15,
|
||||
itemHeight: 2,
|
||||
itemGap: 40
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
},
|
||||
splitLine:{
|
||||
lineStyle: {
|
||||
color: '#E0E6F1'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '左眼等效球镜',
|
||||
type: 'line',
|
||||
data: []
|
||||
},
|
||||
{
|
||||
name: '右眼等效球镜',
|
||||
type: 'line',
|
||||
data: []
|
||||
}
|
||||
]
|
||||
})
|
||||
// 文件下载
|
||||
function fileDown(row:any) {
|
||||
const params = {
|
||||
id: row.id
|
||||
}
|
||||
exportVisionForm(params).then((response: any) => {
|
||||
downloadFile(response, row.student_name + '筛查结果记录表', 'docx')
|
||||
}).catch(() => {
|
||||
});
|
||||
}
|
||||
const isViewfile = ref(false)
|
||||
const ViewfileUrl = ref("")
|
||||
function viewReport(row: any) {
|
||||
ViewfileUrl.value = url + '/base/student-visdata/exportVisionForm?id=' + row.id
|
||||
setTimeout(()=>{
|
||||
isViewfile.value = true
|
||||
},200)
|
||||
|
||||
}
|
||||
function CloseView() {
|
||||
isViewfile.value = false
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div style="padding-right: 20px;">
|
||||
<div class="schoolStudent-title">
|
||||
<div class="class_order">学生视力档案</div>
|
||||
<div class="return" @click="returnClick">
|
||||
<img src="@/assets/tableicon/u549.png" alt="">
|
||||
<div style="padding-left: 2px;padding-top: 2px;">返回</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="schoolStudent-line"></div>
|
||||
<div style="display: flex;align-items: center;padding: 20px 0;">
|
||||
<img v-if="(props.studentInfo.photo=='' || props.studentInfo.photo==null) && props.studentInfo.gender == '1'" src="@/assets/student/man.png" alt="" style="width:100px;height:100px;">
|
||||
<img v-if="(props.studentInfo.photo=='' || props.studentInfo.photo==null) && props.studentInfo.gender == '2'" src="@/assets/student/woman.png" alt="" style="width:100px;height:100px;">
|
||||
<img v-if="props.studentInfo.photo!='' && props.studentInfo.photo!=null" :src="props.studentInfo.photo" alt="" style="width:100px;height:100px;">
|
||||
<div style="margin-left: 15px;">
|
||||
<div class="basicname">
|
||||
<span style="padding-right:20px">{{ props.studentInfo.name }}</span>
|
||||
<span style="padding-right:20px">|</span>
|
||||
<span v-if="props.studentInfo.gender == '1'">男</span>
|
||||
<span v-if="props.studentInfo.gender == '2'">女</span>
|
||||
<span style="padding-left:20px;padding-right:20px">|</span>
|
||||
<span>{{ props.studentInfo.age }}岁</span>
|
||||
</div>
|
||||
<div class="basicinfo">
|
||||
<span>所属学校:</span>
|
||||
<span class="valuetext">{{ props.studentInfo.school_name }}</span>
|
||||
<span>所属年级:</span>
|
||||
<span class="valuetext">{{ props.studentInfo.grade_name }}</span>
|
||||
<span>所属班级:</span>
|
||||
<span class="valuetext">{{ props.studentInfo.class_name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-tabs class="tstab" v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="检查记录" name="1"></el-tab-pane>
|
||||
<el-tab-pane label="视力变化趋势" name="2"></el-tab-pane>
|
||||
<el-tab-pane label="屈光度变化趋势" name="3"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-table v-if="activeName == '1'" v-loading="loading" :data="tableData" style="width: 100%; height:calc(100vh - 380px)" row-key="id" border
|
||||
default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}" >
|
||||
<el-table-column type="index" width="60" label="序号"></el-table-column>
|
||||
<el-table-column prop="exam_time" label="检查时间" min-width="140" align="center">
|
||||
<template #default="scope">
|
||||
{{dateFormat(scope.row.exam_time)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="vision_left" label="左眼视力" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.vision_left !=0 && scope.row.vision_left!=null"> {{scope.row.vision_left.toFixed(1)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="vision_right" label="右眼视力" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.vision_right !=0 && scope.row.vision_right!=null"> {{scope.row.vision_right.toFixed(1)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="sph_left" label="左眼球镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.sph_left !=0 && scope.row.sph_left!=null">
|
||||
<span v-if="scope.row.sph_left>0">+{{scope.row.sph_left.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.sph_left.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sph_right" label="右眼球镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.sph_right !=0 && scope.row.sph_right!=null">
|
||||
<span v-if="scope.row.sph_right>0">+{{scope.row.sph_right.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.sph_right.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="cytdnder_left" label="左眼柱镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.cytdnder_left !=0 && scope.row.cytdnder_left!=null">
|
||||
<span v-if="scope.row.cytdnder_left>0">+{{scope.row.cytdnder_left.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.cytdnder_left.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="cytdnder_right" label="右眼柱镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.cytdnder_right !=0 && scope.row.cytdnder_right!=null">
|
||||
<span v-if="scope.row.cytdnder_right>0">+{{scope.row.cytdnder_right.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.cytdnder_right.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="axies_left" label="左眼轴位" width="60" align="center"/>
|
||||
<el-table-column prop="axies_right" label="右眼轴位" width="60" align="center"/>
|
||||
<el-table-column prop="se_left" label="左眼等效球镜" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.se_left !=0 && scope.row.se_left!=null">
|
||||
<span v-if="scope.row.se_left>0">+{{scope.row.se_left.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.se_left.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="se_right" label="右眼等效球镜" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.se_right !=0 && scope.row.se_right!=null">
|
||||
<span v-if="scope.row.se_right>0">+{{scope.row.se_right.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.se_right.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="rectify_vision_left" label="左眼矫正视力" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.rectify_vision_left !=0 && scope.row.rectify_vision_left!=null"> {{scope.row.rectify_vision_left.toFixed(1)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="rectify_vision_right" label="右眼矫正视力" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.rectify_vision_right !=0 && scope.row.rectify_vision_right!=null"> {{scope.row.rectify_vision_right.toFixed(1)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_sighted" label="是否近视" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.is_sighted == '0'">否</span>
|
||||
<span v-if="scope.row.is_sighted == '1'">是</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_hyperopia" label="远视储备是否充足" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="props.studentInfo.age >12">/</span>
|
||||
<span v-else-if="scope.row.is_hyperopia == '1'">否</span>
|
||||
<span v-else-if="scope.row.is_hyperopia == '0'">是</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_glasses" label="是否戴镜" width="100" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.is_glasses == '4'">不带镜</span>
|
||||
<span v-if="scope.row.is_glasses == '3'">角膜塑形镜</span>
|
||||
<span v-if="scope.row.is_glasses == '2'">隐形眼镜</span>
|
||||
<span v-if="scope.row.is_glasses == '1'">框架眼镜</span>
|
||||
<span v-if="scope.row.is_glasses == '0'||scope.row.is_glasses == ''||scope.row.is_glasses == null">未知</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="100" align="center">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/tableicon/u886.png" @click="viewReport(scope.row)" title="查看结果登记表" style="cursor: pointer;"
|
||||
>
|
||||
<img src="@/assets/tableicon/u889.png" @click="fileDown(scope.row)" title="导出" style="cursor: pointer;"
|
||||
>
|
||||
<!-- <img src="@/assets/tableicon/u884.png" title="打印" style="cursor: pointer;"> -->
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div v-if="activeName == '2'" id="myEchart1" style="width: 100%;height:calc(100vh - 380px)"></div>
|
||||
<div v-if="activeName == '3'" id="myEchart2" style="width: 100%;height:calc(100vh - 380px)"></div>
|
||||
<Viewfile v-if="isViewfile" :showTime="true" :title="'查看学生体检报告'" :url="ViewfileUrl" :type="'docx'" :clientHeight="600"
|
||||
@update="CloseView" />
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.schoolStudent-title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #282828;
|
||||
.class_order{
|
||||
padding-bottom: 5px;
|
||||
border-bottom:3px solid #409eff;
|
||||
}
|
||||
.return{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #409EFF;
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
border: 1px solid #C6E2FF;
|
||||
background: rgb(236, 245, 255);
|
||||
border-radius:4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.schoolStudent-line{
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: rgb(220, 223, 230);
|
||||
margin-top: -1px;
|
||||
}
|
||||
.basicname{
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #333333;
|
||||
text-align: left;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.basicinfo{
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #787878;
|
||||
text-align: left;
|
||||
}
|
||||
.valuetext{
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #363636;
|
||||
padding-right: 50px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
@ -1,773 +0,0 @@
|
||||
|
||||
<script lang="ts">
|
||||
// 医生管理
|
||||
export default {
|
||||
name: 'schoolDoctor'
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryRegion } from "@/api/regionmodule/region";
|
||||
import { querySchoolList } from "@/api/regionmodule/school";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import { publicTree } from '@/utils/validate';
|
||||
import { querySchoolDoctorPage, addSchoolDoctor,updateSchoolDoctor,delSchoolDoctor } from "@/api/regionmodule/schoolDoctor";
|
||||
const schoolName =ref("")
|
||||
const props1 = {
|
||||
checkStrictly: true,
|
||||
value:'id',
|
||||
label:'name'
|
||||
}
|
||||
//树形控件类型定义
|
||||
interface Tree {
|
||||
[x: string]: any;
|
||||
label: string;
|
||||
children?: Tree[];
|
||||
}
|
||||
//搜索内容
|
||||
const querystr = ref("");
|
||||
// 左侧树
|
||||
const cascaderdata: any = ref([]);
|
||||
const cascaderList:any = ref([])
|
||||
const defaultProps = { label: "name" };
|
||||
const handleNodeClick = (data: Tree) => {
|
||||
schoolName.value = data.name
|
||||
checkedtreeid.value = data.id;
|
||||
getData();
|
||||
};
|
||||
const infoForm = ref();
|
||||
const treeRef = ref();
|
||||
// 表格数组类型定义
|
||||
const tableData = ref([]);
|
||||
const checkedtreeid = ref("");
|
||||
const loading = ref(false);
|
||||
const treeloading = ref(false);
|
||||
//新建医生数组
|
||||
const info:any = ref({
|
||||
school_id: "", //学校id
|
||||
code: "", // 医生代码
|
||||
name: "", // 医生名称
|
||||
gender:"",
|
||||
birth_date:"",
|
||||
mobile:"",
|
||||
wechat:"",
|
||||
email:"",
|
||||
certificate:"0",
|
||||
license:"", //从业执照
|
||||
signature:""
|
||||
});
|
||||
const title = ref("");
|
||||
const dialogVisible = ref(false);
|
||||
const regionId =ref(""); //行政区域名称
|
||||
const regionType =ref("");
|
||||
//获取行政区域
|
||||
function getTree() {
|
||||
const params = {
|
||||
name: "",
|
||||
status:'01'
|
||||
};
|
||||
|
||||
queryRegion(params).then((res: any) => {
|
||||
cascaderList.value = JSON.parse(JSON.stringify(res.data))
|
||||
cascaderdata.value = publicTree(res.data,"");
|
||||
})
|
||||
.catch((error:any)=>{
|
||||
treeloading.value = false
|
||||
})
|
||||
}
|
||||
const queryInfo :any = ref({
|
||||
current:1,
|
||||
size:10,
|
||||
total:0
|
||||
})
|
||||
const treeData:any = ref([])
|
||||
function getData(){
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: querystr.value,
|
||||
schoolId: checkedtreeid.value,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
querySchoolDoctorPage(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
//获取医生列表
|
||||
function getTreeData() {
|
||||
if(regionId.value == ''){
|
||||
treeData.value = []
|
||||
return
|
||||
}
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: "",
|
||||
regionId: regionId.value,
|
||||
type:regionType.value
|
||||
};
|
||||
treeloading.value = true
|
||||
querySchoolList(params).then((res) => {
|
||||
treeData.value = res.data;
|
||||
treeloading.value = false
|
||||
checkedtreeid.value = ""
|
||||
if (checkedtreeid.value == "" &&cascaderdata.value.length != 0) {
|
||||
checkedtreeid.value = res.data[0].id;
|
||||
schoolName.value = res.data[0].name
|
||||
}
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(checkedtreeid.value);
|
||||
});
|
||||
getData();
|
||||
}).catch(()=>{
|
||||
treeloading.value = false
|
||||
});
|
||||
}
|
||||
// 选中区域获取医生列表
|
||||
function handleChange(value:any){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
if(value.length != 0){
|
||||
regionId.value = value[value.length -1]
|
||||
for(let i=0;i<cascaderList.value.length;i++){
|
||||
if(regionId.value == cascaderList.value[i].id){
|
||||
regionType.value = cascaderList.value[i].type
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
getTreeData()
|
||||
}
|
||||
function handleClick(data:any){
|
||||
if(data.children == null){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
}
|
||||
regionId.value = data.id
|
||||
regionType.value = data.type
|
||||
getTreeData()
|
||||
}
|
||||
const multipleSelection = ref([]);
|
||||
//定义医生填写规则
|
||||
const moderules = reactive<FormRules>({
|
||||
code: [{ required: true, message: "请输入医生编码", trigger: "blur" }],
|
||||
name: [{ required: true, message: "请输入医生名称", trigger: "blur" }],
|
||||
mobile: [{ pattern: /^1(3|4|5|6|7|8|9)\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }],
|
||||
});
|
||||
function handleSelectionChange(val: any) {
|
||||
multipleSelection.value = val;
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
//新建医生-保存/修改
|
||||
function confirmClick(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (info.value.id) {
|
||||
const data:any = {
|
||||
id:info.value.id,
|
||||
schoolId: info.value.school_id, //学校ID
|
||||
code: info.value.code, // 医生代码
|
||||
name: info.value.name, // 医生名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email, // 微信号
|
||||
certificate:info.value.certificate, //资格证书
|
||||
license:info.value.license, //从业执照
|
||||
signature:info.value.signature //电子签名
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gender==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
updateSchoolDoctor(data).then((item:any) => {
|
||||
if(item.code == '0'){
|
||||
dialogVisible.value = false;
|
||||
ElMessage({
|
||||
message: "修改成功",
|
||||
type: "success",
|
||||
});
|
||||
getData();
|
||||
}
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
const data:any = {
|
||||
schoolId: info.value.school_id, //学校ID
|
||||
code: info.value.code, // 医生代码
|
||||
name: info.value.name, // 医生名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email, // 微信号
|
||||
certificate:info.value.certificate, //资格证书
|
||||
license:info.value.license, //从业执照
|
||||
signature:info.value.signature //电子签名
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gender==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
addSchoolDoctor(data).then((item:any) => {
|
||||
if(item.code == '0'){
|
||||
dialogVisible.value = false;
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "新增成功",
|
||||
type: "success",
|
||||
});
|
||||
}
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
|
||||
|
||||
//新建医生
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
const infoagin = ref({
|
||||
id: null,
|
||||
school_id: checkedtreeid.value, //区域ID (医生所在城市
|
||||
code: "", // 医生代码
|
||||
name: "", // 医生名称
|
||||
gender:"",
|
||||
birth_date:"",
|
||||
mobile:"",
|
||||
wechat:"",
|
||||
email:"",
|
||||
certificate:"",
|
||||
signature:"",
|
||||
license:"", //从业执照
|
||||
|
||||
});
|
||||
info.value = infoagin.value;
|
||||
title.value = "新增医生";
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//修改医生
|
||||
function editHandle(row: any) {
|
||||
isSwitch.value = false
|
||||
title.value = "修改医生";
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//删除医生
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定删除此医生吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delSchoolDoctor(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
// 多选删除医生
|
||||
function delClick() {
|
||||
ElMessageBox.confirm("确定删除已选择的医生吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let id = [] as any[];
|
||||
multipleSelection.value.forEach((item: any) => {
|
||||
id.push(item.id)
|
||||
})
|
||||
let params = {
|
||||
ids: id.join(','),
|
||||
};
|
||||
delSchoolDoctor(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " ";
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
getTree();
|
||||
});
|
||||
const vMove = {
|
||||
mounted(el: any) {
|
||||
el.onmousedown = function (e: any) {
|
||||
var init = e.clientX;
|
||||
var parent: any = document.getElementById("silderLeft");
|
||||
const initWidth: any = parent.offsetWidth;
|
||||
document.onmousemove = function (e) {
|
||||
var end = e.clientX;
|
||||
var newWidth = end - init + initWidth;
|
||||
parent.style.width = newWidth + "px";
|
||||
};
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
/**
|
||||
*
|
||||
* 上传Base64图片方法
|
||||
*/
|
||||
function uploadChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.license =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
function uploadQecodeChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.signature =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
|
||||
function delLicense(){
|
||||
info.value.license = ""
|
||||
}
|
||||
function delsignature(){
|
||||
info.value.signature = ""
|
||||
}
|
||||
const isCascader=ref(true)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="faulttemplate-box">
|
||||
<aside id="silderLeft">
|
||||
<div class="lefttitle">
|
||||
<div class="line"></div>
|
||||
<div class="treetitle">学校列表</div>
|
||||
</div>
|
||||
<div style="width:100% ;display: flex;">
|
||||
<el-cascader v-if="isCascader" style="width: 90%; margin: auto;" placeholder="请输入行政区域" v-model="regionId" @change="handleChange" :options="cascaderdata" :props="props1" :show-all-levels="false" filterable>
|
||||
<template #default="{ node, data }">
|
||||
<div @click.stop="handleClick(data)">{{ data.name }}</div>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</div>
|
||||
<!-- <el-input v-model="regionName" placeholder="请输入行政区域" clearable style="width: 100%;margin-bottom: 10px;"
|
||||
@keyup.enter="getTree" /> -->
|
||||
<el-tree v-loading="treeloading"
|
||||
ref="treeRef" node-key="id" :data="treeData" :highlight-current="true" :props="defaultProps"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick" style="height: calc(100vh - 245px); overflow: auto;margin-top: 10px;">
|
||||
</el-tree>
|
||||
|
||||
<div class="moveBtn" v-move>
|
||||
<div class="moveBtn-line" v-move></div>
|
||||
</div>
|
||||
</aside>
|
||||
<main class="silderRight">
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div>
|
||||
<el-input v-model="querystr" placeholder="请输入医生姓名" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button :disabled="regionId==''" type="primary" @click="addClick"><img style="margin-right:5px;" src="@/assets/MenuIcon/jscz_xz.png" alt=""> 新增</el-button>
|
||||
<el-button :disabled="regionId=='' || multipleSelection.length == 0" @click="delClick"><el-icon style="margin-right: 5px;"><Delete /></el-icon> 删除</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%; height:calc(100% - 105px);" row-key="id" border
|
||||
@selection-change="handleSelectionChange" default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}"
|
||||
>
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column prop="code" label="医生代码" min-width="140"></el-table-column>
|
||||
<el-table-column prop="name" label="医生姓名" width="100"></el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="80">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.gender == '0'">不详</span>
|
||||
<span v-if="scope.row.gender == '1'">男</span>
|
||||
<span v-if="scope.row.gender == '2'">女</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="所属学校" min-width="140">
|
||||
<template #default="scope">
|
||||
{{ schoolName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="certificate" label="资格证书" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.certificate == '0'">执业医师</span>
|
||||
<span v-if="scope.row.certificate == '1'">执业技师</span>
|
||||
<span v-if="scope.row.certificate == '2'">护士</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="gender" label="出生日期" width="120" align="center">
|
||||
<template #default="scope">
|
||||
{{ dateFormat(scope.row.birth_date) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mobile" label="手机号" width="120" align="center"></el-table-column>
|
||||
<el-table-column prop="license" label="从业执照" width="140">
|
||||
<template #default="scope">
|
||||
<img :src="scope.row.license" alt="" style="width: 70px;">
|
||||
<!-- <el-image
|
||||
style="width: 70px; height: 70px"
|
||||
:src="scope.row.license"
|
||||
:preview-src-list="[scope.row.license]"
|
||||
:initial-index="4"
|
||||
fit="cover"
|
||||
z-index="3000"
|
||||
/> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signature" label="电子签名" width="140">
|
||||
<template #default="scope">
|
||||
<img :src="scope.row.signature" alt="" style="width: 70px;">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="80">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" title="修改" style="cursor: pointer;"
|
||||
@click="editHandle(scope.row)" >
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="cursor: pointer;"
|
||||
@click="delHandle(scope.row)" >
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
</main>
|
||||
|
||||
<!-- 医生 弹框-->
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="title" draggable width="620px">
|
||||
|
||||
<el-form ref="infoForm" :model="info" label-width="100px" :rules="moderules">
|
||||
<el-form-item label="所属学校" >
|
||||
<el-input v-model="schoolName" style="width: 100%" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="医生代码" >
|
||||
<el-input v-model="info.code" style="width: 100%" placeholder="请输入医生代码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="医生姓名" prop="name">
|
||||
<el-input v-model="info.name" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-radio-group v-model="info.gender">
|
||||
<el-radio label="1" border>男</el-radio>
|
||||
<el-radio label="2" border>女</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="出生日期" prop="birth_date">
|
||||
<el-date-picker v-model="info.birth_date" type="date" placeholder="" style="width: 100%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="mobile" >
|
||||
<el-input v-model="info.mobile" style="width: 100%" placeholder="请输入医生手机号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="info.email" style="width: 100%" placeholder="请输入医生邮箱"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="微信号" prop="wechat">
|
||||
<el-input v-model="info.wechat" style="width: 100%" placeholder="请输入医生微信号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="资格证书" prop="certificate">
|
||||
<el-radio-group v-model="info.certificate">
|
||||
<el-radio label="0" border>执业医师</el-radio>
|
||||
<el-radio label="1" border>执业技师</el-radio>
|
||||
<el-radio label="2" border>护士</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="上传图片" prop="organization_id">
|
||||
<div style="display: flex;">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.license">
|
||||
<img :src="info.license" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delLicense"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">从业执照</div>
|
||||
</div>
|
||||
|
||||
</el-upload>
|
||||
<el-upload
|
||||
style="margin-left: 10px;"
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadQecodeChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.signature">
|
||||
<img :src="info.signature" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delsignature"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">电子签名</div>
|
||||
</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer">
|
||||
<el-button style="padding: 10px 15px" @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" style="padding: 10px 15px" @click="confirmClick(infoForm)">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.silderLeft-default {
|
||||
:deep(.custom-tree-node, .treedelicon, .treeediticon) {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
:deep(.custom-tree-large, .treedelicon, .treeediticon) {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
height: 100%;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
background-color: #f2f4f9;
|
||||
}
|
||||
|
||||
#silderLeft {
|
||||
width: 255px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
&:hover {
|
||||
.moveBtn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 拖动条 */
|
||||
.moveBtn {
|
||||
height: 100%;
|
||||
width: 15px;
|
||||
padding: 0 6px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -15px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.moveBtn-line {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
user-select: none;
|
||||
background-color: #60bfff;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
|
||||
.silderRight {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border-radius: 3px;
|
||||
padding: 15px;
|
||||
padding-bottom: 0px;
|
||||
margin-left: 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node.is-current > .el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background-color: #409eff !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content:hover) {
|
||||
background-color: #409eff19;
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
padding-right: 8px;
|
||||
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
.is-current .treeediticon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.is-current .treedelicon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treeediticon {
|
||||
color: #00cccc;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treedelicon {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
.treeediticon,
|
||||
.treedelicon {
|
||||
color: #fff;
|
||||
margin: 0 5px;
|
||||
}
|
||||
:deep(.el-table__cell){
|
||||
color: #383838;
|
||||
}
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
|
||||
.lefttitle {
|
||||
min-width: 130px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px 15px;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #1B1B1B;
|
||||
border-bottom: 1px var(--el-border-color) var(--el-border-style);
|
||||
margin-bottom: 10px;
|
||||
.line{
|
||||
border-width: 0px;
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
margin-right: 7px;
|
||||
background: inherit;
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
:deep(.el-upload--picture-card){
|
||||
--el-upload-picture-card-size: 148px;
|
||||
background-color: var(--el-fill-color-lighter);
|
||||
border: 1px dashed var(--el-border-color-darker);
|
||||
border-radius: 6px;
|
||||
box-sizing: border-box;
|
||||
width: var(--el-upload-picture-card-size);
|
||||
height: var(--el-upload-picture-card-size);
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.newavatar-uploader-icon{
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
.newavatar-uploader-text{
|
||||
width: 100%;text-align: center;line-height: 20px;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #949494;
|
||||
}
|
||||
</style>
|
@ -1,726 +0,0 @@
|
||||
|
||||
<script lang="ts">
|
||||
// 年级管理
|
||||
export default {
|
||||
name: 'schoolGrade'
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryRegion } from "@/api/regionmodule/region";
|
||||
import { querySchoolList } from "@/api/regionmodule/school";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import { querySchoolGradePage, addSchoolGrade,updateSchoolGrade,delSchoolGrade } from "@/api/regionmodule/schoolGrade";
|
||||
import { querySchoolTeacherList } from "@/api/regionmodule/schoolTeacher";
|
||||
import { publicTree } from '@/utils/validate';
|
||||
const schoolTeacherData:any = ref([])
|
||||
function getSchoolTeacher(schoolId:any){
|
||||
let params ={
|
||||
name:'',
|
||||
schoolId:schoolId
|
||||
}
|
||||
querySchoolTeacherList(params).then((res) => {
|
||||
schoolTeacherData.value = res.data;
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const props1 = {
|
||||
checkStrictly: true,
|
||||
value:'id',
|
||||
label:'name'
|
||||
}
|
||||
//树形控件类型定义
|
||||
interface Tree {
|
||||
[x: string]: any;
|
||||
label: string;
|
||||
children?: Tree[];
|
||||
}
|
||||
//搜索内容
|
||||
const querystr = ref("");
|
||||
// 左侧树
|
||||
const cascaderdata: any = ref([]);
|
||||
const defaultProps = { label: "name" };
|
||||
const handleNodeClick = (data: Tree) => {
|
||||
checkedtreeid.value = data.id;
|
||||
getSchoolTeacher(data.id)
|
||||
getData();
|
||||
};
|
||||
|
||||
const gradeTypeList:any = ref([{
|
||||
itemcode:"1",
|
||||
dictname:"小学一年级"
|
||||
},{
|
||||
itemcode:"2",
|
||||
dictname:"小学二年级"
|
||||
},{
|
||||
itemcode:"3",
|
||||
dictname:"小学三年级"
|
||||
},{
|
||||
itemcode:"4",
|
||||
dictname:"小学四年级"
|
||||
},{
|
||||
itemcode:"5",
|
||||
dictname:"小学五年级"
|
||||
},{
|
||||
itemcode:"6",
|
||||
dictname:"小学六年级"
|
||||
},{
|
||||
itemcode:"7",
|
||||
dictname:"初中一年级"
|
||||
},{
|
||||
itemcode:"8",
|
||||
dictname:"初中二年级"
|
||||
},{
|
||||
itemcode:"9",
|
||||
dictname:"初中三年级"
|
||||
},{
|
||||
itemcode:"10",
|
||||
dictname:"初中四年级"
|
||||
},{
|
||||
itemcode:"11",
|
||||
dictname:"高中一年级"
|
||||
},{
|
||||
itemcode:"12",
|
||||
dictname:"高中二年级"
|
||||
},{
|
||||
itemcode:"13",
|
||||
dictname:"高中三年级"
|
||||
},{
|
||||
itemcode:"14",
|
||||
dictname:"高中四年级"
|
||||
}])
|
||||
const infoForm = ref();
|
||||
const treeRef = ref();
|
||||
// 表格数组类型定义
|
||||
const tableData = ref([]);
|
||||
const checkedtreeid = ref("");
|
||||
const loading = ref(false);
|
||||
const treeloading = ref(false);
|
||||
//新建年级数组
|
||||
const info:any = ref({
|
||||
school_id: "", //学校id
|
||||
code: "", // 年级代码
|
||||
name: "", // 年级名称
|
||||
grade_type:"1",
|
||||
org_type:"",
|
||||
teacher_id:"",
|
||||
teacher_name:""
|
||||
});
|
||||
const title = ref("");
|
||||
const dialogVisible = ref(false);
|
||||
const regionId =ref(""); //行政区域名称
|
||||
const cascaderList: any = ref([])
|
||||
|
||||
//获取行政区域
|
||||
function getTree() {
|
||||
const params = {
|
||||
name: "",
|
||||
status:'01'
|
||||
};
|
||||
|
||||
queryRegion(params).then((res: any) => {
|
||||
cascaderList.value = JSON.parse(JSON.stringify(res.data))
|
||||
cascaderdata.value = publicTree(res.data,"");
|
||||
})
|
||||
.catch((error:any)=>{
|
||||
treeloading.value = false
|
||||
})
|
||||
}
|
||||
const queryInfo :any = ref({
|
||||
current:1,
|
||||
size:10,
|
||||
total:0
|
||||
})
|
||||
const treeData:any = ref([])
|
||||
function getData(){
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: querystr.value,
|
||||
schoolId: checkedtreeid.value,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
querySchoolGradePage(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
//获取年级列表
|
||||
function getTreeData() {
|
||||
if(regionId.value == ''){
|
||||
treeData.value = []
|
||||
return
|
||||
}
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: "",
|
||||
regionId: regionId.value,
|
||||
type:regionType.value
|
||||
};
|
||||
treeloading.value = true
|
||||
querySchoolList(params).then((res) => {
|
||||
treeData.value = res.data;
|
||||
treeloading.value = false
|
||||
checkedtreeid.value = ""
|
||||
if (checkedtreeid.value == "" &&cascaderdata.value.length != 0) {
|
||||
checkedtreeid.value = res.data[0].id;
|
||||
getSchoolTeacher(checkedtreeid.value)
|
||||
}
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(checkedtreeid.value);
|
||||
});
|
||||
getData();
|
||||
|
||||
}).catch(()=>{
|
||||
treeloading.value = false
|
||||
});
|
||||
}
|
||||
const regionType= ref("")
|
||||
// 选中区域获取年级列表
|
||||
function handleChange(value:any){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
if(value.length != 0){
|
||||
regionId.value = value[value.length -1]
|
||||
for(let i=0;i<cascaderList.value.length;i++){
|
||||
if(regionId.value == cascaderList.value[i].id){
|
||||
regionType.value = cascaderList.value[i].type
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
getTreeData()
|
||||
}
|
||||
function handleClick(data:any){
|
||||
if(data.children == null){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
}
|
||||
regionId.value = data.id
|
||||
for(let i=0;i<cascaderList.value.length;i++){
|
||||
if(regionId.value == cascaderList.value[i].id){
|
||||
regionType.value = cascaderList.value[i].type
|
||||
break
|
||||
}
|
||||
}
|
||||
getTreeData()
|
||||
}
|
||||
const multipleSelection = ref([]);
|
||||
//定义年级填写规则
|
||||
const moderules = reactive<FormRules>({
|
||||
code: [{ required: true, message: "请输入年级代码", trigger: "blur" }],
|
||||
name: [{ required: true, message: "请输入年级名称", trigger: "blur" }],
|
||||
// grade_type: [{ required: true, message: "请选择年级类型", trigger: "blur" }],
|
||||
});
|
||||
function handleSelectionChange(val: any) {
|
||||
multipleSelection.value = val;
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
//新建年级-保存/修改
|
||||
function confirmClick(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (info.value.id) {
|
||||
const data:any = {
|
||||
id:info.value.id,
|
||||
schoolId: info.value.school_id, //学校ID
|
||||
code: info.value.code, // 年级代码
|
||||
name: info.value.name, // 年级名称
|
||||
gradeType: info.value.grade_type, // 年级类型
|
||||
orgType: '6', // 组织类型 6-学校年级
|
||||
teacherId: info.value.teacher_id, // 年级主任ID
|
||||
teacherName: info.value.teacher_name, // 年级主任名称
|
||||
};
|
||||
updateSchoolGrade(data).then((item) => {
|
||||
dialogVisible.value = false;
|
||||
ElMessage({
|
||||
message: "修改成功",
|
||||
type: "success",
|
||||
});
|
||||
getData();
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
const data:any = {
|
||||
schoolId: info.value.school_id, //学校ID
|
||||
code: info.value.code, // 年级代码
|
||||
name: info.value.name, // 年级名称
|
||||
gradeType: '1', // 年级类型
|
||||
orgType: '6', // 组织类型 6-学校年级
|
||||
teacherId: info.value.teacher_id, // 年级主任ID
|
||||
teacherName: info.value.teacher_name, // 年级主任名称
|
||||
};
|
||||
addSchoolGrade(data).then((item) => {
|
||||
dialogVisible.value = false;
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "新增成功",
|
||||
type: "success",
|
||||
});
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
|
||||
|
||||
//新建年级
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
const infoagin = ref({
|
||||
id: null,
|
||||
school_id: checkedtreeid.value, //区域ID (年级所在城市
|
||||
code: "", // 年级代码
|
||||
name: "", // 年级名称
|
||||
grade_type:"",
|
||||
org_type:"",
|
||||
teacher_id:"",
|
||||
teacher_name:""
|
||||
|
||||
});
|
||||
info.value = infoagin.value;
|
||||
title.value = "新增年级";
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//修改年级
|
||||
function editHandle(row: any) {
|
||||
isSwitch.value = false
|
||||
title.value = "修改年级";
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//删除年级
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定删除此年级吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delSchoolGrade(params).then((res:any) => {
|
||||
if(res.code =='0'){
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
}else{
|
||||
ElMessage({
|
||||
message: res.msg,
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
// 多选删除年级
|
||||
function delClick() {
|
||||
ElMessageBox.confirm("确定删除已选择的年级吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let id = [] as any[];
|
||||
multipleSelection.value.forEach((item: any) => {
|
||||
id.push(item.id)
|
||||
})
|
||||
let params = {
|
||||
ids: id.join(','),
|
||||
};
|
||||
delSchoolGrade(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
|
||||
var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
|
||||
var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
getTree();
|
||||
});
|
||||
const vMove = {
|
||||
mounted(el: any) {
|
||||
el.onmousedown = function (e: any) {
|
||||
var init = e.clientX;
|
||||
var parent: any = document.getElementById("silderLeft");
|
||||
const initWidth: any = parent.offsetWidth;
|
||||
document.onmousemove = function (e) {
|
||||
var end = e.clientX;
|
||||
var newWidth = end - init + initWidth;
|
||||
parent.style.width = newWidth + "px";
|
||||
};
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function publicDict(list: any, itemcode: any) {
|
||||
let dictname = ''
|
||||
list.forEach((element: any) => {
|
||||
if (element.itemcode == itemcode) {
|
||||
dictname = element.dictname
|
||||
}
|
||||
})
|
||||
return dictname
|
||||
}
|
||||
|
||||
function teacherChange(e:any){
|
||||
for(let i=0;i<schoolTeacherData.value.length;i++){
|
||||
if(schoolTeacherData.value[i].id == e){
|
||||
info.value.teacher_name = schoolTeacherData.value[i].name
|
||||
}
|
||||
}
|
||||
}
|
||||
const isCascader=ref(true)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="faulttemplate-box">
|
||||
<aside id="silderLeft">
|
||||
<div class="lefttitle">
|
||||
<div class="line"></div>
|
||||
<div class="treetitle">学校列表</div>
|
||||
</div>
|
||||
<div style="width:100% ;height:32px; display: flex;">
|
||||
<el-cascader v-if="isCascader" style="width: 90%; margin: auto;" placeholder="请输入行政区域" v-model="regionId" :options="cascaderdata" :props="props1" :show-all-levels="false"
|
||||
filterable @change="handleChange">
|
||||
<template #default="{ node, data }">
|
||||
<div @click.stop="handleClick(data)">{{ data.name }}</div>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</div>
|
||||
<!-- <el-input v-model="regionName" placeholder="请输入行政区域" clearable style="width: 100%;margin-bottom: 10px;"
|
||||
@keyup.enter="getTree" /> -->
|
||||
<el-tree v-loading="treeloading"
|
||||
ref="treeRef" node-key="id" :data="treeData" :highlight-current="true" :props="defaultProps"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick" style="height: calc(100vh - 245px); overflow: auto;margin-top: 10px;">
|
||||
</el-tree>
|
||||
|
||||
<div class="moveBtn" v-move>
|
||||
<div class="moveBtn-line" v-move></div>
|
||||
</div>
|
||||
</aside>
|
||||
<main class="silderRight">
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div>
|
||||
<el-input v-model="querystr" placeholder="请输入年级名称" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button :disabled="regionId==''" type="primary" @click="addClick"><img style="margin-right:5px;" src="@/assets/MenuIcon/jscz_xz.png" alt=""> 新增</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%; height:calc(100% - 105px);" row-key="id" border
|
||||
@selection-change="handleSelectionChange" default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}"
|
||||
>
|
||||
<!-- <el-table-column type="selection" width="50" align="center" /> -->
|
||||
<!-- <el-table-column prop="code" label="年级代码" min-width="100"></el-table-column> -->
|
||||
<el-table-column prop="name" label="年级名称" min-width="140"></el-table-column>
|
||||
<!-- <el-table-column prop="grade_type" label="年级类型" min-width="140">
|
||||
<template #default="scope">
|
||||
{{ publicDict(gradeTypeList,scope.row.grade_type) }}
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<!-- <el-table-column prop="org_type" label="组织类型" min-width="140"></el-table-column> -->
|
||||
<el-table-column prop="teacher_name" label="年级主任" min-width="140"></el-table-column>
|
||||
<el-table-column prop="creator" label="创建人" width="174"></el-table-column>
|
||||
<el-table-column prop="create_time" label="创建日期" width="196">
|
||||
<template #default="scope">
|
||||
{{ dateFormat(scope.row.create_time) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="80">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" title="修改" style="cursor: pointer;"
|
||||
@click="editHandle(scope.row)" >
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="cursor: pointer;"
|
||||
@click="delHandle(scope.row)" >
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
</main>
|
||||
|
||||
<!-- 年级 弹框-->
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="title" draggable width="620px">
|
||||
|
||||
<el-form ref="infoForm" :model="info" label-width="100px" :rules="moderules">
|
||||
<el-form-item label="年级代码" prop="code">
|
||||
<el-input v-model="info.code" style="width: 100%" placeholder="请输入年级代码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="年级名称" prop="name">
|
||||
<el-input v-model="info.name" style="width: 100%" placeholder="请输入年级名称"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="年级类型" prop="grade_type">
|
||||
<el-select v-model="info.grade_type" class="!w-full" placeholder="请选择年级类型">
|
||||
<el-option v-for="(i, index) in gradeTypeList" :key="index" :label="i.dictname"
|
||||
:value="i.itemcode"></el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="年级主任" prop="teacher_name">
|
||||
<el-select v-model="info.teacher_id" class="!w-full" placeholder="请选择年级主任" @change="teacherChange"
|
||||
filterable>
|
||||
<el-option v-for="(i, index) in schoolTeacherData" :key="index" :label="i.code + ' - ' + i.name +
|
||||
' - ' + (i.gender == '0'?'不详':'') + (i.gender == '1'?'男':'') + (i.gender == '2'?'女':'')
|
||||
"
|
||||
:value="i.id">
|
||||
<span>{{ i.code }}</span>
|
||||
<span> - </span>
|
||||
<span>{{ i.name }}</span>
|
||||
<span> - </span>
|
||||
<span v-if="i.gender == '0'">不详</span>
|
||||
<span v-if="i.gender == '1'">男</span>
|
||||
<span v-if="i.gender == '2'">女</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer">
|
||||
<el-button style="padding: 10px 15px" @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" style="padding: 10px 15px" @click="confirmClick(infoForm)">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.silderLeft-default {
|
||||
:deep(.custom-tree-node, .treedelicon, .treeediticon) {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
:deep(.custom-tree-large, .treedelicon, .treeediticon) {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
height: 100%;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
background-color: #f2f4f9;
|
||||
}
|
||||
|
||||
#silderLeft {
|
||||
width: 255px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
&:hover {
|
||||
.moveBtn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 拖动条 */
|
||||
.moveBtn {
|
||||
height: 100%;
|
||||
width: 15px;
|
||||
padding: 0 6px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -15px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.moveBtn-line {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
user-select: none;
|
||||
background-color: #60bfff;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
|
||||
.silderRight {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border-radius: 3px;
|
||||
padding: 15px;
|
||||
padding-bottom: 0px;
|
||||
margin-left: 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node.is-current > .el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background-color: #409eff !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content:hover) {
|
||||
background-color: #409eff19;
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
padding-right: 8px;
|
||||
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
.is-current .treeediticon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.is-current .treedelicon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treeediticon {
|
||||
color: #00cccc;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treedelicon {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
.treeediticon,
|
||||
.treedelicon {
|
||||
color: #fff;
|
||||
margin: 0 5px;
|
||||
}
|
||||
:deep(.el-table__cell){
|
||||
color: #383838;
|
||||
}
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
|
||||
.lefttitle {
|
||||
min-width: 130px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px 15px;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #1B1B1B;
|
||||
border-bottom: 1px var(--el-border-color) var(--el-border-style);
|
||||
margin-bottom: 10px;
|
||||
.line{
|
||||
border-width: 0px;
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
margin-right: 7px;
|
||||
background: inherit;
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
:deep(.el-upload--picture-card){
|
||||
--el-upload-picture-card-size: 148px;
|
||||
background-color: var(--el-fill-color-lighter);
|
||||
border: 1px dashed var(--el-border-color-darker);
|
||||
border-radius: 6px;
|
||||
box-sizing: border-box;
|
||||
width: var(--el-upload-picture-card-size);
|
||||
height: var(--el-upload-picture-card-size);
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.newavatar-uploader-icon{
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
.newavatar-uploader-text{
|
||||
width: 100%;text-align: center;line-height: 20px;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #949494;
|
||||
}
|
||||
</style>
|
@ -1,643 +0,0 @@
|
||||
|
||||
<script lang="ts">
|
||||
// 教师管理
|
||||
export default {
|
||||
name: 'schoolTeacher'
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryRegion } from "@/api/regionmodule/region";
|
||||
import { querySchoolList } from "@/api/regionmodule/school";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import { querySchoolTeacherPage, addSchoolTeacher,updateSchoolTeacher,delSchoolTeacher } from "@/api/regionmodule/schoolTeacher";
|
||||
import { publicTree } from '@/utils/validate';
|
||||
const props1 = {
|
||||
checkStrictly: true,
|
||||
value:'id',
|
||||
label:'name'
|
||||
}
|
||||
//树形控件类型定义
|
||||
interface Tree {
|
||||
[x: string]: any;
|
||||
label: string;
|
||||
children?: Tree[];
|
||||
}
|
||||
const schoolName =ref("")
|
||||
//搜索内容
|
||||
const querystr = ref("");
|
||||
// 左侧树
|
||||
const cascaderdata: any = ref([]);
|
||||
const cascaderList:any = ref([]);
|
||||
const defaultProps = { label: "name" };
|
||||
const handleNodeClick = (data: Tree) => {
|
||||
schoolName.value = data.name
|
||||
checkedtreeid.value = data.id;
|
||||
getData();
|
||||
};
|
||||
const infoForm = ref();
|
||||
const treeRef = ref();
|
||||
// 表格数组类型定义
|
||||
const tableData = ref([]);
|
||||
const checkedtreeid = ref("");
|
||||
const loading = ref(false);
|
||||
const treeloading = ref(false);
|
||||
//新建教师数组
|
||||
const info:any = ref({
|
||||
school_id: "", //学校id
|
||||
code: "", // 教师代码
|
||||
name: "", // 教师名称
|
||||
grade_type:"",
|
||||
org_type:"",
|
||||
teacher_id:"",
|
||||
teacher_name:""
|
||||
});
|
||||
const title = ref("");
|
||||
const dialogVisible = ref(false);
|
||||
const regionId =ref(""); //行政区域名称
|
||||
const regionType = ref("");
|
||||
//获取行政区域
|
||||
function getTree() {
|
||||
const params = {
|
||||
name: "",
|
||||
status:'01'
|
||||
};
|
||||
|
||||
queryRegion(params).then((res: any) => {
|
||||
cascaderList.value = JSON.parse(JSON.stringify(res.data))
|
||||
cascaderdata.value = publicTree(res.data,"");
|
||||
})
|
||||
.catch((error:any)=>{
|
||||
treeloading.value = false
|
||||
})
|
||||
}
|
||||
const queryInfo :any = ref({
|
||||
current:1,
|
||||
size:10,
|
||||
total:0
|
||||
})
|
||||
const treeData:any = ref([])
|
||||
function getData(){
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: querystr.value,
|
||||
schoolId: checkedtreeid.value,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
querySchoolTeacherPage(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
//获取教师列表
|
||||
function getTreeData() {
|
||||
if(regionId.value == ''){
|
||||
treeData.value = []
|
||||
return
|
||||
}
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: "",
|
||||
regionId: regionId.value,
|
||||
type:regionType.value
|
||||
};
|
||||
treeloading.value = true
|
||||
querySchoolList(params).then((res) => {
|
||||
treeData.value = res.data;
|
||||
treeloading.value = false
|
||||
checkedtreeid.value = ""
|
||||
if (checkedtreeid.value == "" &&cascaderdata.value.length != 0) {
|
||||
checkedtreeid.value = res.data[0].id;
|
||||
schoolName.value = res.data[0].name
|
||||
}
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(checkedtreeid.value);
|
||||
});
|
||||
getData();
|
||||
}).catch(()=>{
|
||||
treeloading.value = false
|
||||
});
|
||||
}
|
||||
// 选中区域获取教师列表
|
||||
function handleChange(value:any){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
if(value.length != 0){
|
||||
regionId.value = value[value.length -1]
|
||||
for(let i=0;i<cascaderList.value.length;i++){
|
||||
if(regionId.value == cascaderList.value[i].id){
|
||||
regionType.value = cascaderList.value[i].type
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
getTreeData()
|
||||
}
|
||||
function handleClick(data:any){
|
||||
if(data.children == null){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
}
|
||||
regionId.value = data.id
|
||||
regionType.value = data.type
|
||||
getTreeData()
|
||||
}
|
||||
const multipleSelection = ref([]);
|
||||
//定义教师填写规则
|
||||
const moderules = reactive<FormRules>({
|
||||
code: [{ required: true, message: "请输入教师编码", trigger: "blur" }],
|
||||
name: [{ required: true, message: "请输入教师名称", trigger: "blur" }],
|
||||
mobile: [{ pattern: /^1(3|4|5|6|7|8|9)\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }],
|
||||
});
|
||||
function handleSelectionChange(val: any) {
|
||||
multipleSelection.value = val;
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
//新建教师-保存/修改
|
||||
function confirmClick(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (info.value.id) {
|
||||
const data:any = {
|
||||
id:info.value.id,
|
||||
schoolId: info.value.school_id, //学校ID
|
||||
code: info.value.code, // 教师代码
|
||||
name: info.value.name, // 教师名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email // 微信号
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gender == null){
|
||||
data.gender = '0'
|
||||
}
|
||||
updateSchoolTeacher(data).then((item) => {
|
||||
dialogVisible.value = false;
|
||||
ElMessage({
|
||||
message: "修改成功",
|
||||
type: "success",
|
||||
});
|
||||
getData();
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
const data:any = {
|
||||
schoolId: info.value.school_id, //学校ID
|
||||
code: info.value.code, // 教师代码
|
||||
name: info.value.name, // 教师名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email // 微信号
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gender == null){
|
||||
data.gender = '0'
|
||||
}
|
||||
addSchoolTeacher(data).then((item) => {
|
||||
dialogVisible.value = false;
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "新增成功",
|
||||
type: "success",
|
||||
});
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
|
||||
|
||||
//新建教师
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
const infoagin = ref({
|
||||
id: null,
|
||||
school_id: checkedtreeid.value, //区域ID (教师所在城市
|
||||
code: "", // 教师代码
|
||||
name: "", // 教师名称
|
||||
grade_type:"",
|
||||
org_type:"",
|
||||
teacher_id:"",
|
||||
teacher_name:""
|
||||
|
||||
});
|
||||
info.value = infoagin.value;
|
||||
title.value = "新增教师";
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//修改教师
|
||||
function editHandle(row: any) {
|
||||
isSwitch.value = false
|
||||
title.value = "修改教师";
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//删除教师
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定删除此教师吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delSchoolTeacher(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
// 多选删除教师
|
||||
function delClick() {
|
||||
ElMessageBox.confirm("确定删除已选择的教师吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let id = [] as any[];
|
||||
multipleSelection.value.forEach((item: any) => {
|
||||
id.push(item.id)
|
||||
})
|
||||
let params = {
|
||||
ids: id.join(','),
|
||||
};
|
||||
delSchoolTeacher(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " ";
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
getTree();
|
||||
});
|
||||
const vMove = {
|
||||
mounted(el: any) {
|
||||
el.onmousedown = function (e: any) {
|
||||
var init = e.clientX;
|
||||
var parent: any = document.getElementById("silderLeft");
|
||||
const initWidth: any = parent.offsetWidth;
|
||||
document.onmousemove = function (e) {
|
||||
var end = e.clientX;
|
||||
var newWidth = end - init + initWidth;
|
||||
parent.style.width = newWidth + "px";
|
||||
};
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
const isCascader=ref(true)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="faulttemplate-box">
|
||||
<aside id="silderLeft">
|
||||
<div class="lefttitle">
|
||||
<div class="line"></div>
|
||||
<div class="treetitle">学校列表</div>
|
||||
</div>
|
||||
<div style="width:100% ;height:32px;display: flex;">
|
||||
<el-cascader v-if="isCascader" style="width: 90%; margin: auto;" placeholder="请输入行政区域" v-model="regionId" @change="handleChange" :options="cascaderdata" :props="props1" :show-all-levels="false" filterable>
|
||||
<template #default="{ node, data }">
|
||||
<div @click.stop="handleClick(data)">{{ data.name }}</div>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</div>
|
||||
<!-- <el-input v-model="regionName" placeholder="请输入行政区域" clearable style="width: 100%;margin-bottom: 10px;"
|
||||
@keyup.enter="getTree" /> -->
|
||||
<el-tree v-loading="treeloading"
|
||||
ref="treeRef" node-key="id" :data="treeData" :highlight-current="true" :props="defaultProps"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick" style="height: calc(100vh - 245px); overflow: auto;margin-top: 10px;">
|
||||
</el-tree>
|
||||
|
||||
<div class="moveBtn" v-move>
|
||||
<div class="moveBtn-line" v-move></div>
|
||||
</div>
|
||||
</aside>
|
||||
<main class="silderRight">
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div>
|
||||
<el-input v-model="querystr" placeholder="请输入教师名称" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button :disabled="regionId==''" type="primary" @click="addClick"><img style="margin-right:5px;" src="@/assets/MenuIcon/jscz_xz.png" alt=""> 新增</el-button>
|
||||
<el-button :disabled="regionId=='' || multipleSelection.length == 0" @click="delClick"><el-icon style="margin-right: 5px;"><Delete /></el-icon> 删除</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%; height:calc(100% - 105px);" row-key="id" border
|
||||
@selection-change="handleSelectionChange" default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}"
|
||||
>
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column prop="code" label="教师代码" min-width="140"></el-table-column>
|
||||
<el-table-column prop="name" label="教师姓名" min-width="140"></el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="196">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.gender == '0'">不详</span>
|
||||
<span v-if="scope.row.gender == '1'">男</span>
|
||||
<span v-if="scope.row.gender == '2'">女</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="birth_date" label="出生日期" width="196">
|
||||
<template #default="scope">
|
||||
{{ dateFormat(scope.row.birth_date) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mobile" label="手机号" min-width="140"></el-table-column>
|
||||
<el-table-column prop="wechat" label="微信号" min-width="140"></el-table-column>
|
||||
<el-table-column prop="email" label="邮箱" min-width="140"></el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="80">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" title="修改" style="cursor: pointer;"
|
||||
@click="editHandle(scope.row)" >
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="cursor: pointer;"
|
||||
@click="delHandle(scope.row)" >
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
</main>
|
||||
|
||||
<!-- 教师 弹框-->
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="title" draggable width="620px">
|
||||
|
||||
<el-form ref="infoForm" :model="info" label-width="100px" :rules="moderules">
|
||||
<el-form-item label="所属学校">
|
||||
<el-input v-model="schoolName" style="width: 100%" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="教师代码" prop="code">
|
||||
<el-input v-model="info.code" style="width: 100%" placeholder="请输入教师代码"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="教师姓名" prop="name">
|
||||
<el-input v-model="info.name" style="width: 100%" placeholder="请输入教师名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="grade_type">
|
||||
<el-radio-group v-model="info.gender">
|
||||
<el-radio label="1" border>男</el-radio>
|
||||
<el-radio label="2" border>女</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="出生日期" prop="birth_date">
|
||||
<el-date-picker v-model="info.birth_date" type="date" placeholder="" style="width: 100%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="mobile" >
|
||||
<el-input v-model="info.mobile" style="width: 100%" placeholder="请输入教师手机号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="info.email" style="width: 100%" placeholder="请输入教师邮箱"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="微信号" prop="wechat">
|
||||
<el-input v-model="info.wechat" style="width: 100%" placeholder="请输入教师微信号"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer">
|
||||
<el-button style="padding: 10px 15px" @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" style="padding: 10px 15px" @click="confirmClick(infoForm)">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.silderLeft-default {
|
||||
:deep(.custom-tree-node, .treedelicon, .treeediticon) {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
:deep(.custom-tree-large, .treedelicon, .treeediticon) {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
height: 100%;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
background-color: #f2f4f9;
|
||||
}
|
||||
|
||||
#silderLeft {
|
||||
width: 255px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
&:hover {
|
||||
.moveBtn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 拖动条 */
|
||||
.moveBtn {
|
||||
height: 100%;
|
||||
width: 15px;
|
||||
padding: 0 6px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -15px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.moveBtn-line {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
user-select: none;
|
||||
background-color: #60bfff;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
|
||||
.silderRight {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border-radius: 3px;
|
||||
padding: 15px;
|
||||
padding-bottom: 0px;
|
||||
margin-left: 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node.is-current > .el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background-color: #409eff !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content:hover) {
|
||||
background-color: #409eff19;
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
padding-right: 8px;
|
||||
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
.is-current .treeediticon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.is-current .treedelicon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treeediticon {
|
||||
color: #00cccc;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treedelicon {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
.treeediticon,
|
||||
.treedelicon {
|
||||
color: #fff;
|
||||
margin: 0 5px;
|
||||
}
|
||||
:deep(.el-table__cell){
|
||||
color: #383838;
|
||||
}
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
|
||||
.lefttitle {
|
||||
min-width: 130px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px 15px;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #1B1B1B;
|
||||
border-bottom: 1px var(--el-border-color) var(--el-border-style);
|
||||
margin-bottom: 10px;
|
||||
.line{
|
||||
border-width: 0px;
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
margin-right: 7px;
|
||||
background: inherit;
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
:deep(.el-upload--picture-card){
|
||||
--el-upload-picture-card-size: 148px;
|
||||
background-color: var(--el-fill-color-lighter);
|
||||
border: 1px dashed var(--el-border-color-darker);
|
||||
border-radius: 6px;
|
||||
box-sizing: border-box;
|
||||
width: var(--el-upload-picture-card-size);
|
||||
height: var(--el-upload-picture-card-size);
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.newavatar-uploader-icon{
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
.newavatar-uploader-text{
|
||||
width: 100%;text-align: center;line-height: 20px;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #949494;
|
||||
}
|
||||
</style>
|
File diff suppressed because it is too large
Load Diff
@ -1,704 +0,0 @@
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'studentVision' // 学生档案
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryRegion } from "@/api/regionmodule/region";
|
||||
import { querySchoolList } from "@/api/regionmodule/school";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import { queryStudentVisdataPage } from "@/api/regionmodule/schoolStudent";
|
||||
import StudentVisdata from '@/views/regionmodule/schoolClass/studentVisdata.vue'
|
||||
import { publicTree } from '@/utils/validate';
|
||||
import { querySchoolGradeList } from "@/api/regionmodule/schoolGrade";
|
||||
import { querySchoolClassList } from "@/api/regionmodule/schoolClass";
|
||||
import { exportStudentResult,exportSchoolHealthNetwork } from "@/api/planscreening";
|
||||
import { downloadFile } from '@/utils/index'
|
||||
const props1 = {
|
||||
checkStrictly: true,
|
||||
value:'id',
|
||||
label:'name'
|
||||
}
|
||||
//树形控件类型定义
|
||||
interface Tree {
|
||||
[x: string]: any;
|
||||
label: string;
|
||||
children?: Tree[];
|
||||
}
|
||||
//搜索内容
|
||||
const querystr = ref("");
|
||||
// 左侧树
|
||||
const cascaderdata: any = ref([]);
|
||||
const cascaderList: any = ref([]);
|
||||
const defaultProps = { label: "name" };
|
||||
const handleNodeClick = (data: Tree) => {
|
||||
schoolId.value = data.id;
|
||||
schoolName.value = data.name;
|
||||
|
||||
getGrade()
|
||||
getData();
|
||||
};
|
||||
const infoForm = ref();
|
||||
const treeRef = ref();
|
||||
// 表格数组类型定义
|
||||
const tableData = ref([]);
|
||||
const schoolId = ref("");
|
||||
const schoolName = ref("");
|
||||
|
||||
const loading = ref(false);
|
||||
const treeloading = ref(false);
|
||||
//新建医生数组
|
||||
|
||||
const title = ref("");
|
||||
const dialogVisible = ref(false);
|
||||
const regionId =ref(""); //行政区域名称
|
||||
const regionType =ref("");
|
||||
//获取行政区域
|
||||
function getTree() {
|
||||
const params = {
|
||||
name: "",
|
||||
status:'01'
|
||||
};
|
||||
|
||||
queryRegion(params).then((res: any) => {
|
||||
cascaderList.value = JSON.parse(JSON.stringify(res.data))
|
||||
cascaderdata.value = publicTree(res.data,"");
|
||||
})
|
||||
.catch((error:any)=>{
|
||||
treeloading.value = false
|
||||
})
|
||||
}
|
||||
const queryInfo :any = ref({
|
||||
current:1,
|
||||
size:10,
|
||||
total:0
|
||||
})
|
||||
const treeData:any = ref([])
|
||||
function getData(){
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
studentName: querystr.value,
|
||||
schoolId: schoolId.value,
|
||||
gradeId:queryInfo.value.gradeId,
|
||||
classId:queryInfo.value.classId,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
queryStudentVisdataPage(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
//获取学生列表
|
||||
function getTreeData() {
|
||||
if(regionId.value == ''){
|
||||
treeData.value = []
|
||||
return
|
||||
}
|
||||
querystr.value = querystr.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: "",
|
||||
regionId: regionId.value,
|
||||
type:regionType.value
|
||||
};
|
||||
treeloading.value = true
|
||||
querySchoolList(params).then((res) => {
|
||||
tableData.value = []
|
||||
treeData.value = res.data;
|
||||
treeloading.value = false
|
||||
schoolId.value = ""
|
||||
if (schoolId.value == "" &&res.data.length != 0) {
|
||||
schoolId.value = res.data[0].id;
|
||||
schoolName.value = res.data[0].name;
|
||||
getGrade()
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(schoolId.value);
|
||||
});
|
||||
getData();
|
||||
}
|
||||
|
||||
}).catch(()=>{
|
||||
treeloading.value = false
|
||||
});
|
||||
}
|
||||
// 选中区域获取医生列表
|
||||
function handleChange(value:any){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
if(value.length != 0){
|
||||
regionId.value = value[value.length -1]
|
||||
for(let i=0;i<cascaderList.value.length;i++){
|
||||
if(regionId.value == cascaderList.value[i].id){
|
||||
regionType.value = cascaderList.value[i].type
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
getTreeData()
|
||||
}
|
||||
function handleClick(data:any){
|
||||
if(data.children == null){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
}
|
||||
regionId.value = data.id
|
||||
regionType.value = data.type
|
||||
getTreeData()
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
|
||||
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " ";
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
getTree();
|
||||
});
|
||||
const vMove = {
|
||||
mounted(el: any) {
|
||||
el.onmousedown = function (e: any) {
|
||||
var init = e.clientX;
|
||||
var parent: any = document.getElementById("silderLeft");
|
||||
const initWidth: any = parent.offsetWidth;
|
||||
document.onmousemove = function (e) {
|
||||
var end = e.clientX;
|
||||
var newWidth = end - init + initWidth;
|
||||
parent.style.width = newWidth + "px";
|
||||
};
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
const info:any = ref({})
|
||||
const htmlStatus= ref('1')
|
||||
function viewVisdata(item:any){ // 查看学生视力档案
|
||||
info.value = {
|
||||
id:item.student_id,
|
||||
name:item.student_name,
|
||||
school_name:item.school_name,
|
||||
grade_name:item.grade_name,
|
||||
class_name:item.class_name,
|
||||
gender:item.gender,
|
||||
exam_time:item.exam_time,
|
||||
age:item.age,
|
||||
}
|
||||
|
||||
htmlStatus.value = '2'
|
||||
}
|
||||
function returnStudent(){
|
||||
htmlStatus.value = '1'
|
||||
}
|
||||
const isCascader=ref(true)
|
||||
|
||||
//表格多选样式
|
||||
const tableRowClassName = ({
|
||||
row,
|
||||
rowIndex,
|
||||
}: {
|
||||
row: any
|
||||
rowIndex: number
|
||||
}) => {
|
||||
if (row.is_sighted == 1) {
|
||||
return 'is_sightedbg'
|
||||
}
|
||||
return ''
|
||||
}
|
||||
const radioStr = ref("1")
|
||||
const isExportVisible = ref(false)
|
||||
function exportVisibleClick(){
|
||||
radioStr.value = "1"
|
||||
isExportVisible.value = true
|
||||
}
|
||||
//导出
|
||||
function exportclick(){
|
||||
let params = {
|
||||
studentName:queryInfo.value.name,
|
||||
idCode:queryInfo.value.idCode,
|
||||
studyCode:queryInfo.value.studyCode,
|
||||
isSighted:queryInfo.value.isSighted,
|
||||
schoolId:schoolId.value,
|
||||
gradeId:queryInfo.value.gradeId,
|
||||
classId:queryInfo.value.classId,
|
||||
gender:queryInfo.value.gender,
|
||||
type:'1'
|
||||
};
|
||||
if(radioStr.value == "1"){
|
||||
loading.value = true
|
||||
exportStudentResult(params).then((response: any) => {
|
||||
isExportVisible.value = false
|
||||
downloadFile(response,schoolName.value+ '-学生筛查结果', 'xlsx')
|
||||
loading.value = false
|
||||
}).catch(()=>{
|
||||
loading.value = false
|
||||
});
|
||||
}else if(radioStr.value == "2"){
|
||||
loading.value = true
|
||||
exportSchoolHealthNetwork(params).then((response: any) => {
|
||||
isExportVisible.value = false
|
||||
downloadFile(response,schoolName.value+ '-学生体质健康网模板', 'xlsx')
|
||||
loading.value = false
|
||||
}).catch(()=>{
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
const gradeinData:any = ref([])
|
||||
const classData:any = ref([])
|
||||
function getGrade(){
|
||||
let params = {
|
||||
schoolId: schoolId.value
|
||||
}
|
||||
classData.value = []
|
||||
queryInfo.value.classId = ""
|
||||
querySchoolGradeList(params).then((res) => {
|
||||
gradeinData.value = res.data;
|
||||
}).catch(()=>{
|
||||
});
|
||||
}
|
||||
function getClass(id:any){
|
||||
let params = {
|
||||
gradeId: id
|
||||
}
|
||||
classData.value = []
|
||||
queryInfo.value.classId = ""
|
||||
if(id != null && id != '' ){
|
||||
querySchoolClassList(params).then((res) => {
|
||||
classData.value = res.data;
|
||||
}).catch(()=>{
|
||||
});
|
||||
}
|
||||
getData()
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="faulttemplate-box">
|
||||
<aside id="silderLeft" v-show="htmlStatus == '1'">
|
||||
<div class="lefttitle">
|
||||
<div class="line"></div>
|
||||
<div class="treetitle">学校列表</div>
|
||||
</div>
|
||||
<div style="width:100% ;height:32px;display: flex;">
|
||||
<el-cascader v-if="isCascader" style="width: 90%; margin: auto;" placeholder="请输入行政区域" v-model="regionId" @change="handleChange" :options="cascaderdata" :props="props1" :show-all-levels="false" filterable>
|
||||
<template #default="{ node, data }">
|
||||
<div @click.stop="handleClick(data)">{{ data.name }}</div>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</div>
|
||||
<el-tree v-loading="treeloading"
|
||||
ref="treeRef" node-key="id" :data="treeData" :highlight-current="true" :props="defaultProps"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick" style="height: calc(100vh - 245px); overflow: auto;margin-top: 10px;">
|
||||
</el-tree>
|
||||
|
||||
<div class="moveBtn" v-move>
|
||||
<div class="moveBtn-line" v-move></div>
|
||||
</div>
|
||||
</aside>
|
||||
<main class="silderRight" v-show="htmlStatus == '1'">
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div style="display: flex;">
|
||||
<el-input v-model="querystr" placeholder="请输入学生姓名" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-select v-model="queryInfo.gradeId" @change="getClass" placeholder="请选择年级" clearable style="width: 150px;" :disabled="schoolId==''|| schoolId==null">
|
||||
<el-option v-for="item in gradeinData" :key="item.id" :label="item.name" :value="item.id"/>
|
||||
</el-select>
|
||||
<el-select v-model="queryInfo.classId" @change="getData" class="ml-3" placeholder="请选择班级" clearable style="width: 120px" :disabled="queryInfo.gradeId==''|| queryInfo.gradeId==null">
|
||||
<el-option v-for="item in classData" :key="item.id" :label="item.name" :value="item.id"/>
|
||||
</el-select>
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button type="primary" @click="exportVisibleClick">
|
||||
<img src="@/assets/visionscreening/exports.png" style="padding-right: 5px;" alt="">导出
|
||||
</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="tableData"
|
||||
:row-class-name="tableRowClassName"
|
||||
style="width: 100%; height:calc(100vh - 250px)" row-key="id" border
|
||||
default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}" >
|
||||
<el-table-column type="index" width="60" label="序号" align="center" ></el-table-column>
|
||||
<el-table-column prop="student_name" label="姓名" width="90"></el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.gender == '1'">男</span>
|
||||
<span v-if="scope.row.gender == '2'">女</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="age" label="年龄" width="60"></el-table-column>
|
||||
<el-table-column prop="grade_name" label="所属年级" min-width="110"></el-table-column>
|
||||
<el-table-column prop="class_name" label="所属班级" min-width="100"></el-table-column>
|
||||
|
||||
<el-table-column prop="exam_time" label="检查时间" width="140" align="center">
|
||||
<template #default="scope">
|
||||
{{dateFormat(scope.row.exam_time)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="vision_left" label="左眼视力" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.vision_left !=0 && scope.row.vision_left!=null"> {{scope.row.vision_left.toFixed(1)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="vision_right" label="右眼视力" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.vision_right !=0 && scope.row.vision_right!=null"> {{scope.row.vision_right.toFixed(1)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sph_left" label="左眼球镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.sph_left !=0 && scope.row.sph_left!=null">
|
||||
<span v-if="scope.row.sph_left>0">+{{scope.row.sph_left.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.sph_left.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sph_right" label="右眼球镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.sph_right !=0 && scope.row.sph_right!=null">
|
||||
<span v-if="scope.row.sph_right>0">+{{scope.row.sph_right.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.sph_right.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="cytdnder_left" label="左眼柱镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.cytdnder_left !=0 && scope.row.cytdnder_left!=null">
|
||||
<span v-if="scope.row.cytdnder_left>0">+{{scope.row.cytdnder_left.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.cytdnder_left.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="cytdnder_right" label="右眼柱镜" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.cytdnder_right !=0 && scope.row.cytdnder_right!=null">
|
||||
<span v-if="scope.row.cytdnder_right>0">+{{scope.row.cytdnder_right.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.cytdnder_right.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="axies_left" label="左眼轴位" width="60" align="center"/>
|
||||
<el-table-column prop="axies_right" label="右眼轴位" width="60" align="center"/>
|
||||
<el-table-column prop="se_left" label="左眼等效球镜" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.se_left !=0 && scope.row.se_left!=null">
|
||||
<span v-if="scope.row.se_left>0">+{{scope.row.se_left.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.se_left.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="se_right" label="右眼等效球镜" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.se_right !=0 && scope.row.se_right!=null">
|
||||
<span v-if="scope.row.se_right>0">+{{scope.row.se_right.toFixed(2)}}D</span>
|
||||
<span v-else>{{scope.row.se_right.toFixed(2)}}D</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="rectify_vision_left" label="左眼矫正视力" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.rectify_vision_left !=0 && scope.row.rectify_vision_left!=null">
|
||||
{{scope.row.rectify_vision_left.toFixed(1)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="rectify_vision_right" label="右眼矫正视力" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.rectify_vision_right !=0 && scope.row.rectify_vision_right!=null">
|
||||
{{scope.row.rectify_vision_right.toFixed(1)}}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_sighted" label="是否近视" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.is_sighted == '0'">否</span>
|
||||
<span v-if="scope.row.is_sighted == '1'">是</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_hyperopia" label="远视储备是否充足" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.age >12">/</span>
|
||||
<span v-else-if="scope.row.is_hyperopia == '1'">否</span>
|
||||
<span v-else-if="scope.row.is_hyperopia == '0'">是</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_glasses" label="是否戴镜" width="100" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.is_glasses == '4'">不带镜</span>
|
||||
<span v-if="scope.row.is_glasses == '3'">角膜塑形镜</span>
|
||||
<span v-if="scope.row.is_glasses == '2'">隐形眼镜</span>
|
||||
<span v-if="scope.row.is_glasses == '1'">框架眼镜</span>
|
||||
<span v-if="scope.row.is_glasses == '0'||scope.row.is_glasses == ''||scope.row.is_glasses == null">未知</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="60">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img @click="viewVisdata(scope.row)" src="@/assets/tableicon/u880.png" title="历史档案" style="cursor: pointer;"
|
||||
>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
</main>
|
||||
<StudentVisdata class="schoolStudent-box" v-if="htmlStatus == '2'" :studentInfo="info" @returnStudent="returnStudent"/>
|
||||
<el-dialog v-model="isExportVisible" title="导出数据" width="350">
|
||||
<div v-loading="loading">
|
||||
<div>
|
||||
<el-radio label="1" size="large" v-model="radioStr">系统模版数据导出</el-radio>
|
||||
</div>
|
||||
<div>
|
||||
<el-radio label="2" size="large" v-model="radioStr">体质健康网模版数据(最近)导出</el-radio>
|
||||
</div>
|
||||
<!-- <el-radio label="3" size="large" v-model="radioStr">体质健康网模版数据(最优)导出</el-radio> -->
|
||||
<div style="display: flex;justify-content: end;margin-top: 10px;">
|
||||
<el-button type="primary" @click="exportclick" style="padding:5px;width: 60px;">确定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.silderLeft-default {
|
||||
:deep(.custom-tree-node, .treedelicon, .treeediticon) {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
:deep(.custom-tree-large, .treedelicon, .treeediticon) {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
height: 100%;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
background-color: #f2f4f9;
|
||||
}
|
||||
|
||||
#silderLeft {
|
||||
width: 255px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
&:hover {
|
||||
.moveBtn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 拖动条 */
|
||||
.moveBtn {
|
||||
height: 100%;
|
||||
width: 15px;
|
||||
padding: 0 6px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -15px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.moveBtn-line {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
user-select: none;
|
||||
background-color: #60bfff;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
|
||||
.silderRight {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border-radius: 3px;
|
||||
padding: 15px;
|
||||
padding-bottom: 0px;
|
||||
margin-left: 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node.is-current > .el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background-color: #409eff !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content) {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
:deep(.el-tree-node__content:hover) {
|
||||
background-color: #409eff19;
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
padding-right: 8px;
|
||||
|
||||
}
|
||||
|
||||
.faulttemplate-box {
|
||||
.is-current .treeediticon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.is-current .treedelicon {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treeediticon {
|
||||
color: #00cccc;
|
||||
}
|
||||
|
||||
.el-tree-node__content:hover .treedelicon {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
.treeediticon,
|
||||
.treedelicon {
|
||||
color: #fff;
|
||||
margin: 0 5px;
|
||||
}
|
||||
:deep(.el-table__cell){
|
||||
color: #383838;
|
||||
}
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
|
||||
.lefttitle {
|
||||
min-width: 130px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px 15px;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #1B1B1B;
|
||||
border-bottom: 1px var(--el-border-color) var(--el-border-style);
|
||||
margin-bottom: 10px;
|
||||
.line{
|
||||
border-width: 0px;
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
margin-right: 7px;
|
||||
background: inherit;
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
.schoolStudent-box{
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgb(255, 255, 255);
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
padding: 10px 15px 0px;
|
||||
padding-right: 0;
|
||||
box-sizing: border-box;
|
||||
.schoolStudent-title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #282828;
|
||||
.class_order{
|
||||
padding-bottom: 5px;
|
||||
border-bottom:3px solid #409eff;
|
||||
}
|
||||
.return{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #409EFF;
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
border: 1px solid #C6E2FF;
|
||||
background: rgb(236, 245, 255);
|
||||
border-radius:4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.schoolStudent-line{
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: rgb(220, 223, 230);
|
||||
margin-top: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
@ -1,502 +0,0 @@
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'VisionInstitutionDoctor' // 视力筛查服务机构_医生
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import { queryInstitutionDoctorPage, addVisionInstitutionDoctor,updateVisionInstitutionDoctor,delVisionInstitutionDoctor } from "@/api/regionmodule/VisionInstitutionDoctor";
|
||||
const emit = defineEmits([ 'returnClick']);
|
||||
const props:any = defineProps({
|
||||
institutionId: {
|
||||
required: false,
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
institutionName: {
|
||||
required: false,
|
||||
type: String,
|
||||
default: ""
|
||||
}
|
||||
})
|
||||
const multipleSelection = ref([]);
|
||||
//定义医生填写规则
|
||||
const moderules = reactive<FormRules>({
|
||||
code: [{ required: true, message: "请输入医生代码", trigger: "blur" }],
|
||||
name: [{ required: true, message: "请输入医生名称", trigger: "blur" }],
|
||||
mobile: [{ pattern: /^1(3|4|5|6|7|8|9)\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }],
|
||||
});
|
||||
function handleSelectionChange(val: any) {
|
||||
multipleSelection.value = val;
|
||||
}
|
||||
const queryInfo :any = ref({
|
||||
name:'',
|
||||
current:1,
|
||||
size:10,
|
||||
total:0
|
||||
})
|
||||
const tableData =ref([])
|
||||
const loading = ref(false)
|
||||
//获取医生列表
|
||||
function getData(){
|
||||
queryInfo.value.name = queryInfo.value.name.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: queryInfo.value.name,
|
||||
institutionId: institutionId.value,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
queryInstitutionDoctorPage(params).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
const isSwitch = ref(false) // 提交开关
|
||||
//新建医生数组
|
||||
const info:any = ref({
|
||||
institution_id: "", //机构id
|
||||
code: "", // 医生代码
|
||||
name: "", // 医生名称
|
||||
gender:"",
|
||||
birth_date:"",
|
||||
mobile:"",
|
||||
wechat:"",
|
||||
email:"",
|
||||
certificate:"",
|
||||
license:"", //从业执照
|
||||
signature:""
|
||||
});
|
||||
const title = ref("") // 弹框标题
|
||||
const dialogVisible = ref(false)
|
||||
//新建医生
|
||||
function addClick() {
|
||||
isSwitch.value = false
|
||||
const infoagin = ref({
|
||||
id: null,
|
||||
institution_id: institutionId.value, //区域ID (医生所在城市
|
||||
code: "", // 医生代码
|
||||
name: "", // 医生名称
|
||||
gender:"",
|
||||
birth_date:"",
|
||||
mobile:"",
|
||||
wechat:"",
|
||||
email:"",
|
||||
certificate:"0",
|
||||
signature:"",
|
||||
license:"", //从业执照
|
||||
|
||||
});
|
||||
info.value = infoagin.value;
|
||||
title.value = "新增医生";
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//修改医生
|
||||
function editHandle(row: any) {
|
||||
isSwitch.value = false
|
||||
title.value = "修改医生";
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
//删除医生
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定删除此医生吗?", "删除提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delVisionInstitutionDoctor(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
function dateFormat(row: any) {
|
||||
const daterc = row;
|
||||
if (daterc != null) {
|
||||
var date = new Date(daterc);
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
|
||||
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
// 拼接
|
||||
return year + "-" + month + "-" + day + " ";
|
||||
}
|
||||
}
|
||||
const institutionName = ref("")
|
||||
const institutionId = ref("")
|
||||
onMounted(() => {
|
||||
institutionId.value = props.institutionId
|
||||
|
||||
institutionName.value = props.institutionName
|
||||
getData()
|
||||
});
|
||||
|
||||
const infoForm = ref();
|
||||
//关闭弹窗
|
||||
function handleClose() {
|
||||
if (infoForm.value != null) infoForm.value.resetFields();
|
||||
dialogVisible.value = false;
|
||||
}
|
||||
function confirmClick(formEl: any) {
|
||||
formEl.validate((valid: any) => {
|
||||
if (valid) {
|
||||
if(isSwitch.value == true){
|
||||
return
|
||||
}
|
||||
isSwitch.value = true
|
||||
if (info.value.id) {
|
||||
const data:any = {
|
||||
id:info.value.id,
|
||||
institutionId: info.value.institution_id, //机构ID
|
||||
code: info.value.code, // 医生代码
|
||||
name: info.value.name, // 医生名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email, // 微信号
|
||||
certificate:info.value.certificate, //资格证书
|
||||
license:info.value.license, //从业执照
|
||||
signature:info.value.signature //电子签名
|
||||
|
||||
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gender==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
updateVisionInstitutionDoctor(data).then((item:any) => {
|
||||
if(item.code == '0'){
|
||||
dialogVisible.value = false;
|
||||
ElMessage({
|
||||
message: "修改成功",
|
||||
type: "success",
|
||||
});
|
||||
getData();
|
||||
}
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
} else {
|
||||
const data:any = {
|
||||
institutionId: info.value.institution_id, //机构ID
|
||||
code: info.value.code, // 医生代码
|
||||
name: info.value.name, // 医生名称
|
||||
gender: info.value.gender, // 性别
|
||||
birthDate: info.value.birth_date, // 出生日期
|
||||
mobile: info.value.mobile, // 手机号
|
||||
wechat: info.value.wechat, // 微信号
|
||||
email: info.value.email, // 微信号
|
||||
certificate:info.value.certificate, //资格证书
|
||||
license:info.value.license, //从业执照
|
||||
signature:info.value.signature //电子签名
|
||||
};
|
||||
if(info.value.gender == '' || info.value.gender==null){
|
||||
data.gender = '0'
|
||||
}
|
||||
addVisionInstitutionDoctor(data).then((item:any) => {
|
||||
if(item.code == '0'){
|
||||
dialogVisible.value = false;
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "新增成功",
|
||||
type: "success",
|
||||
});
|
||||
}
|
||||
|
||||
}).catch(()=>{
|
||||
isSwitch.value = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* 上传Base64图片方法
|
||||
*/
|
||||
function uploadChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.license =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
function uploadQecodeChange(file:any){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file.raw);
|
||||
reader.onload = () => {
|
||||
info.value.signature =reader.result
|
||||
};
|
||||
reader.onerror = function(error) {
|
||||
console.log("Error: ", error);
|
||||
};
|
||||
}
|
||||
|
||||
function delLicense(){
|
||||
info.value.license = ""
|
||||
}
|
||||
function delsignature(){
|
||||
info.value.signature = ""
|
||||
}
|
||||
function returnClick(){
|
||||
emit('returnClick', false);
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="schoolStudent-box">
|
||||
<div class="schoolStudent-title">
|
||||
<div class="class_order">{{ institutionName }}医生</div>
|
||||
<div class="return" @click="returnClick">
|
||||
<img src="@/assets/tableicon/u549.png" alt="">
|
||||
<div style="padding-left: 2px;padding-top: 2px;">返回</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="schoolStudent-line" style="width:calc(100%)"></div>
|
||||
<el-row style="margin: 10px 0">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div>
|
||||
<el-input v-model="queryInfo.name" placeholder="请输入医生姓名" clearable style="width: 200px;"
|
||||
@keyup.enter="getData" />
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getData">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button type="primary" @click="addClick"><img style="margin-right:5px;" src="@/assets/MenuIcon/jscz_xz.png" alt=""> 新增</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%; height:calc(100% - 145px);" row-key="id" border
|
||||
@selection-change="handleSelectionChange" default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}"
|
||||
>
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column prop="code" label="医生代码" width="140"></el-table-column>
|
||||
<el-table-column prop="name" label="医生姓名" width="100"></el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="80">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.gender == '0'">不详</span>
|
||||
<span v-if="scope.row.gender == '1'">男</span>
|
||||
<span v-if="scope.row.gender == '2'">女</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="所属机构" min-width="140">
|
||||
<template #default="scope">
|
||||
<span>{{ institutionName }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="certificate" label="资格证书" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.certificate == '0'">执业医师</span>
|
||||
<span v-if="scope.row.certificate == '1'">执业技师</span>
|
||||
<span v-if="scope.row.certificate == '2'">护士</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="gender" label="出生日期" width="120" align="center">
|
||||
<template #default="scope">
|
||||
{{ dateFormat(scope.row.birth_date) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mobile" label="手机号" width="120" align="center"></el-table-column>
|
||||
<el-table-column prop="license" label="从业执照" width="140">
|
||||
<template #default="scope">
|
||||
<img :src="scope.row.license" alt="" style="height: 40px;">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signature" label="电子签名" width="140">
|
||||
<template #default="scope">
|
||||
<img :src="scope.row.signature" alt="" style="height: 40px;">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="80">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_xg.png" title="修改" style="cursor: pointer;"
|
||||
@click="editHandle(scope.row)" >
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="cursor: pointer;"
|
||||
@click="delHandle(scope.row)" >
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getData" />
|
||||
<!-- 医生 弹框-->
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="title" draggable width="620px">
|
||||
|
||||
<el-form ref="infoForm" :model="info" label-width="100px" :rules="moderules">
|
||||
<el-form-item label="所属机构">
|
||||
<el-input v-model="institutionName" style="width: 100%" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="医生代码">
|
||||
<el-input v-model="info.code" style="width: 100%" placeholder="请输入医生代码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="医生姓名" prop="name">
|
||||
<el-input v-model="info.name" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-radio-group v-model="info.gender">
|
||||
<el-radio label="1">男</el-radio>
|
||||
<el-radio label="2">女</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="出生日期" prop="birth_date">
|
||||
<el-date-picker v-model="info.birth_date" type="date" placeholder="" style="width: 100%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="mobile" >
|
||||
<el-input v-model="info.mobile" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="info.email" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="微信号" prop="wechat">
|
||||
<el-input v-model="info.wechat" style="width: 100%" placeholder="请输入医生名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="资格证书" prop="certificate">
|
||||
<el-radio-group v-model="info.certificate">
|
||||
<el-radio label="0">执业医师</el-radio>
|
||||
<el-radio label="1">执业技师</el-radio>
|
||||
<el-radio label="2">护士</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="上传图片" prop="organization_id">
|
||||
<div style="display: flex;">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.license">
|
||||
<img :src="info.license" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delLicense"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">从业执照</div>
|
||||
</div>
|
||||
|
||||
</el-upload>
|
||||
<el-upload
|
||||
style="margin-left: 10px;"
|
||||
class="avatar-uploader"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
action=""
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
@change="uploadQecodeChange"
|
||||
>
|
||||
<div style="width: 100px;height: 100px;position: relative;" v-if="info.signature">
|
||||
<img :src="info.signature" class="avatar" />
|
||||
<div style="position: absolute;top: 0px;left: 0px;z-index: 1;width: 100px;height: 100px;background: rgba(0,0,0,0.3);color: cornflowerblue;">
|
||||
<el-icon style="position: absolute;top: 40px;left: 40px;z-index: 1;font-size: 20px;"
|
||||
@click.stop="delsignature"><Delete /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon class="newavatar-uploader-icon"><Plus /></el-icon>
|
||||
<div class="newavatar-uploader-text">电子签名</div>
|
||||
</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="dialog-footer">
|
||||
<el-button style="padding: 10px 15px" @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" style="padding: 10px 15px" @click="confirmClick(infoForm)">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.schoolStudent-box{
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgb(255, 255, 255);
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
padding: 15px 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.schoolStudent-title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #282828;
|
||||
.class_order{
|
||||
padding-bottom: 5px;
|
||||
border-bottom:3px solid #409eff;
|
||||
}
|
||||
.return{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #409EFF;
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
border: 1px solid #C6E2FF;
|
||||
background: rgb(236, 245, 255);
|
||||
border-radius:4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.schoolStudent-line{
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: rgb(220, 223, 230);
|
||||
margin-top: -1px;
|
||||
}
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
.newavatar-uploader-icon{
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
.newavatar-uploader-text{
|
||||
width: 100%;text-align: center;line-height: 20px;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #949494;
|
||||
}
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end;
|
||||
-webkit-justify-content: flex-end;
|
||||
}
|
||||
</style>
|
File diff suppressed because it is too large
Load Diff
@ -1,342 +0,0 @@
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'InstitutionSchools' // 机构-学校对照
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, nextTick } from "vue";
|
||||
import { ElMessage, ElMessageBox, FormRules } from "element-plus";
|
||||
import { queryRegion } from "@/api/regionmodule/region";
|
||||
import { queryPlanSchoolPage } from "@/api/regionmodule/school";
|
||||
import { publicTree } from '@/utils/validate';
|
||||
import { queryInstitutionSchoolList,addInstitutionSchool,delInstitutionSchool } from "@/api/regionmodule/visionInstitution";;
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
const emit = defineEmits([ 'returnClick']);
|
||||
const props:any = defineProps({
|
||||
institutionInfo: {
|
||||
required: false,
|
||||
type: Object,
|
||||
default: {}
|
||||
}
|
||||
})
|
||||
const institutionInfo:any = ref({})
|
||||
const dialogVisible = ref(true)
|
||||
function handleClose(){
|
||||
emit('returnClick', false);
|
||||
}
|
||||
//获取表格类型
|
||||
function getData() {
|
||||
let params = {
|
||||
institutionId: institutionInfo.value.id,
|
||||
};
|
||||
loading.value = true
|
||||
queryInstitutionSchoolList(params).then((res) => {
|
||||
tableData.value = res.data;
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
const schoolData:any= ref([])
|
||||
//获取表格类型
|
||||
function getSchool() {
|
||||
queryInfo.value.name = queryInfo.value.name.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: queryInfo.value.name,
|
||||
regionId: regionId.value,
|
||||
type:regionType.value,
|
||||
current: queryInfo.value.current,
|
||||
size:queryInfo.value.size
|
||||
};
|
||||
loading.value = true
|
||||
queryPlanSchoolPage(params).then((res) => {
|
||||
schoolData.value = res.data.records;
|
||||
queryInfo.value.total = res.data.total
|
||||
loading.value = false
|
||||
});
|
||||
}
|
||||
function addClick(){
|
||||
queryInfo.value = {
|
||||
name:"",
|
||||
current:1,
|
||||
size:10,
|
||||
tatol:0
|
||||
}
|
||||
regionId.value = ""
|
||||
regionType.value = ""
|
||||
getSchool()
|
||||
isSchool.value = true
|
||||
}
|
||||
const queryInfo:any = ref({
|
||||
current:1,
|
||||
size:10,
|
||||
tatol:0,
|
||||
})
|
||||
const tableData:any = ref([]);
|
||||
const cascaderdata: any = ref([]);
|
||||
const cascaderList: any = ref([]);
|
||||
//获取行政区域
|
||||
function getTree() {
|
||||
const params = {
|
||||
name: "",
|
||||
status:'01'
|
||||
};
|
||||
queryRegion(params).then((res: any) => {
|
||||
cascaderList.value = res.data;
|
||||
cascaderdata.value = publicTree(res.data,"");
|
||||
})
|
||||
.catch((error:any)=>{
|
||||
})
|
||||
}
|
||||
const props1 = {
|
||||
checkStrictly: true,
|
||||
value:'id',
|
||||
label:'name'
|
||||
}
|
||||
const regionId:any = ref("")
|
||||
const regionType:any = ref("")
|
||||
// 选中区域获取班级列表
|
||||
function handleChange(value:any){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
if(value != null && value.length != 0){
|
||||
regionId.value = value[value.length -1]
|
||||
for(let i=0;i<cascaderList.value.length;i++){
|
||||
if(regionId.value == cascaderList.value[i].id){
|
||||
regionType.value = cascaderList.value[i].type
|
||||
break
|
||||
}
|
||||
}
|
||||
}else{
|
||||
regionId.value = ""
|
||||
regionType.value = ""
|
||||
}
|
||||
getSchool()
|
||||
}
|
||||
function handleClick(data:any){
|
||||
regionType.value = data.type
|
||||
if(data.children == null){
|
||||
isCascader.value = false
|
||||
setTimeout(()=>{
|
||||
isCascader.value = true
|
||||
},20)
|
||||
}
|
||||
regionId.value = data.id
|
||||
getSchool()
|
||||
// regionType.value = data.type
|
||||
getSchool()
|
||||
}
|
||||
//解除关联学校
|
||||
function delHandle(row: any) {
|
||||
ElMessageBox.confirm("确定解除关联学校吗?", "解绑提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let params = {
|
||||
ids: row.id,
|
||||
};
|
||||
delInstitutionSchool(params).then(() => {
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "解除关联学校",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
const loading= ref(false)
|
||||
const isSchool = ref(false)
|
||||
function schoolClose(){
|
||||
isSchool.value = false
|
||||
}
|
||||
onMounted(() => {
|
||||
institutionInfo.value = props.institutionInfo
|
||||
getTree()
|
||||
getData()
|
||||
});
|
||||
const multipleSelection = ref([]);
|
||||
function handleSelectionChange(val: any) {
|
||||
multipleSelection.value = val;
|
||||
}
|
||||
// 关联学校
|
||||
function bindingClick() {
|
||||
ElMessageBox.confirm("确定关联已选择的学校吗?", "关联提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
let id = [] as any[];
|
||||
multipleSelection.value.forEach((item: any) => {
|
||||
id.push(item.id)
|
||||
})
|
||||
let params = {
|
||||
ids: id.join(','),
|
||||
institutionId:institutionInfo.value.id
|
||||
};
|
||||
addInstitutionSchool(params).then((res:any) => {
|
||||
if(res.code=='0'){
|
||||
isSchool.value = false
|
||||
getData();
|
||||
ElMessage({
|
||||
message: "关联成功",
|
||||
type: "success",
|
||||
});
|
||||
}else{
|
||||
ElMessage({
|
||||
message: res.msg,
|
||||
type: "error",
|
||||
});
|
||||
isSchool.value = false
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
const isCascader=ref(true)
|
||||
</script>
|
||||
<template>
|
||||
<div class="">
|
||||
<el-dialog v-model="dialogVisible" :before-close="handleClose" :title="'关联学校'" draggable width="1000px">
|
||||
<div style="padding:0 25px">
|
||||
<div class="flexitems" style="margin-bottom: 15px;">
|
||||
<div class="titleline"></div>
|
||||
<div class="titlename">机构信息</div>
|
||||
</div>
|
||||
<div class="flexitems">
|
||||
<div style="width:70px;text-align: right;">父级机构:</div>
|
||||
<div class="textname" style="width:220px">{{institutionInfo.name}}</div>
|
||||
<div style="width:70px;text-align: right;">机构代码:</div>
|
||||
<div class="textname" style="width:185px">{{institutionInfo.code}}</div>
|
||||
<div style="width:70px;text-align: right;">机构名称:</div>
|
||||
<div class="textname" style="width:220px">{{institutionInfo.name}}</div>
|
||||
</div>
|
||||
<div class="flexitems">
|
||||
<div style="width:70px;text-align: right;">负责人:</div>
|
||||
<div class="textname" style="width:220px">{{institutionInfo.manager}}</div>
|
||||
<div style="width:70px;text-align: right;"> 联系人:</div>
|
||||
<div class="textname" style="width:185px">{{institutionInfo.contact}}</div>
|
||||
<div style="width:70px;text-align: right;">联系电话:</div>
|
||||
<div class="textname" style="width:220px">{{institutionInfo.telephone}}</div>
|
||||
</div>
|
||||
<div class="flexitems">
|
||||
<div style="width:70px;text-align: right;"> 所属城市:</div>
|
||||
<div class="textname">{{institutionInfo.regionName}}</div>
|
||||
</div>
|
||||
<div class="flexitems">
|
||||
<div style="width:70px;text-align: right;"> 机构地址:</div>
|
||||
<div class="textname">{{institutionInfo.address}}</div>
|
||||
</div>
|
||||
<div class="flexitems" style="margin-bottom: 15px;">
|
||||
<div class="titleline"></div>
|
||||
<div class="titlename">关联学校</div>
|
||||
</div>
|
||||
<el-button type="primary" @click="addClick" style="margin-bottom: 10px;">关联学校</el-button>
|
||||
<el-table v-loading="loading" :data="tableData" style="width: 100%; height:calc(100vh - 445px);" row-key="id" border
|
||||
default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}"
|
||||
>
|
||||
<el-table-column prop="region_name" label="所属区域" />
|
||||
<el-table-column prop="custom1" label="学校类型" width="140">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.custom1 !=null && scope.row.custom1 !=''">
|
||||
{{ scope.row.custom1.split("-")[1] }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="学校名称" min-width="120" />
|
||||
<el-table-column fixed="right" label="操作" width="80">
|
||||
<template #default="scope">
|
||||
<span style="display: flex;display: -webkit-flex;justify-content: space-around; -webkit-justify-content: space-around; ">
|
||||
<img src="@/assets/MenuIcon/lbcz_sc.png" title="删除" style="cursor: pointer;"
|
||||
@click="delHandle(scope.row)" >
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
|
||||
</el-dialog>
|
||||
<el-dialog v-model="isSchool" :before-close="schoolClose" :title="'选择关联学校'" draggable width="1000px">
|
||||
<div style="padding:0 25px">
|
||||
|
||||
<el-row style="margin-bottom: 10px;width: calc(100%);">
|
||||
<el-col :span="24" class="top-nav">
|
||||
<div class="top-nav">
|
||||
<el-input v-model="queryInfo.name" placeholder="请输入学校名称" clearable style="width: 200px;margin-right: 10px;"
|
||||
@keyup.enter="getSchool" />
|
||||
<div style="width: 200px;height: 32px; margin: auto;">
|
||||
<el-cascader v-if="isCascader" style="width: 200px;" placeholder="请输入行政区域" v-model="regionId" @change="handleChange" clearable="" :options="cascaderdata" :props="props1" :show-all-levels="false" filterable>
|
||||
<template #default="{ node, data }">
|
||||
<div @click.stop="handleClick(data)">{{ data.name }}</div>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</div>
|
||||
|
||||
<el-button type="primary" style="margin-left: 10px;" @click="getSchool">搜索</el-button>
|
||||
</div>
|
||||
<div class="left-nav">
|
||||
<el-button type="primary" @click="bindingClick">确定</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table v-loading="loading" :data="schoolData" style="width: 100%; height:calc(100vh - 245px);" row-key="id" border
|
||||
default-expand-all :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column prop="region_name" label="所属区域" />
|
||||
<el-table-column prop="custom1" label="学校类型" width="140">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.custom1 !=null && scope.row.custom1 !=''">
|
||||
{{ scope.row.custom1.split("-")[1] }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="学校名称" min-width="120" />
|
||||
|
||||
</el-table>
|
||||
<Page class="mt-[20px]" :total="queryInfo.total" v-model:size="queryInfo.size" v-model:current="queryInfo.current"
|
||||
@pagination="getSchool" />
|
||||
</div>
|
||||
|
||||
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.flexitems {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: 'Arial Normal', 'Arial';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.titleline{
|
||||
width: 5px;
|
||||
height: 16px;
|
||||
background: inherit;
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
margin-right: 5px;
|
||||
}
|
||||
.titlename{
|
||||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #363636;
|
||||
}
|
||||
.textname{
|
||||
color: #363636;
|
||||
}
|
||||
|
||||
.top-nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue
Block a user