200 lines
7.8 KiB
Vue
Raw Normal View History

2025-03-25 10:51:14 +08:00
<template>
<lay-container fluid="true" class="organization-box">
<div style="display: flex">
<div :style="{ width: isFold ? `0px` : `230px` }" class="left-tree">
<div v-if="!isFold">科室列表</div>
<lay-tree v-show="!isFold" style="margin-top: 10px" :data="data" v-model:selectedKey="group_id"
:showLine="false" @node-click="handleClick">
<template #title="{ data }">
<span :class="group_id == data.id ? 'isChecked' : ''">
{{ data.name }}
</span>
</template>
</lay-tree>
<div class="isFold" @click="isFold = !isFold">
&nbsp;<lay-icon v-if="!isFold" class="layui-icon-left"></lay-icon>
<lay-icon v-else class="layui-icon-right"></lay-icon>
</div>
</div>
<div style="flex: 1; padding: 10px; overflow: auto">
<!-- table -->
<lay-card>
<lay-form>
<lay-row>
<lay-col :md="5">
<lay-form-item label="类型" label-width="80">
<lay-select v-model="type" :show-search="true" placeholder="请选择" :allowClear="true">
<lay-select-option :value="1" label="月度"></lay-select-option>
<lay-select-option :value="2" label="季度"></lay-select-option>
<lay-select-option :value="3" label="年度"></lay-select-option>
</lay-select>
</lay-form-item>
</lay-col>
<lay-col :md="5">
<lay-form-item label="时间" label-width="80">
<lay-date-picker type="year" v-model="yearmonth" placeholder="年"
allow-clear></lay-date-picker>
</lay-form-item>
</lay-col>
<lay-col :md="5">
<lay-form-item label="考评对象" label-width="120">
<lay-input v-model="nickname" placeholder="请输入考评对象"></lay-input>
</lay-form-item>
</lay-col>
<lay-col :md="5">
<lay-form-item label-width="20">
<lay-button style="margin-left: 20px" type="primary" size="sm" @click="toSearch">
查询
</lay-button>
<lay-button size="sm" @click="toReset"> 重置</lay-button>
</lay-form-item>
</lay-col>
</lay-row>
</lay-form>
</lay-card>
<lay-table :page="page" height="600px" :columns="columns" :loading="loading" :data-source="dataSource"
@change="change">
<template v-slot:scoringrecord_status="{ row }">
<lay-tag v-if="row.scoringrecord_status == 1" type="primary">已自评</lay-tag>
<lay-tag v-if="row.scoringrecord_status == 2">未自评</lay-tag>
<lay-tag v-if="row.scoringrecord_status == 3" type="warm">科室已评</lay-tag>
<!-- <lay-tag v-if="row.scoringrecord_status == 4" type="danger">医院已评</lay-tag> -->
</template>
<template v-slot:nickname="{ row }">
<div style="color: #00A394;cursor: pointer" @click="openUserListShow(row)">{{ row.nickname }}
</div>
</template>
<template v-slot:operator="{ row }">
<lay-space>
<!-- <span style="color: #00A394;cursor: pointer"
v-if="row.scoringrecord_status == 3 && userStore.userInfo.level == 3"
@click="getInfo(row, 3)">医院评分</span> -->
<span style="color: #00A394;cursor: pointer" v-if="row.scoringrecord_status == 1"
@click="getInfo(row, 2)">科室评分</span>
<span style="color: #00A394;cursor: pointer" v-if="row.scoringrecord_status != 2"
@click="getInfo(row, 1)">考评详情</span>
<span style="color: #999999;cursor: not-allowed"
v-if="row.scoringrecord_status == 2">未自评</span>
</lay-space>
</template>
</lay-table>
</div>
</div>
</lay-container>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { layer } from '@layui/layui-vue'
import {
getUserGroupNew,
getGroupEvaluation,
getMonthlyUserList,
MonthlyCreate,
getMonthlyListFind, getMonthlyListUpdate, getMonthlyFindData,
MonthlyInfo
} from "@/api/module/home";
import dayjs from "dayjs";
import { useUserStore } from '@/store/user';
import { useRoute } from 'vue-router'
const route = useRoute()
const userStore = useUserStore()
const userId = ref();
const isFold = ref(false)
const yearmonth = ref(dayjs().format('YYYY'));
onMounted(() => {
getLeftList();
})
const group_id = ref(1);
const data = ref([]);
const getLeftList = () => {
getUserGroupNew({}).then((res) => {
console.log(res)
if (res.code == 1) {
data.value = res.data;
group_id.value = res.data[0].id;
} else {
layer.msg(res.msg, { icon: 2 })
}
})
}
const loading = ref(false)
const columns = ref([
{ title: '时间', width: '80px', key: 'time', align: 'center' },
{ title: '考评对象', width: '100px', key: 'nickname', customSlot: 'nickname', align: 'center' },
{ title: '工号', width: '100px', key: 'code', align: 'center' },
{ title: '部门', width: '120px', key: 'group_name', align: 'center' },
{ title: '自我评价', width: '100px', key: 'user_scoringrecord', align: 'center' },
{ title: '科室评价', width: '100px', key: 'department_score_scoringrecord', align: 'center' },
{ title: '状态', width: '100px', key: 'scoringrecord_status', customSlot: 'scoringrecord_status', align: 'center' },
{
title: '操作',
width: '180px',
customSlot: 'operator',
key: 'operator',
fixed: 'right', align: 'center'
}
])
</script>
<style>
.layui-table-header .layui-table-cell {
background-color: #ECF8FA !important;
}
.organization-box {
width: calc(100vw - 240px);
height: calc(100vh - 110px);
margin-top: 10px;
box-sizing: border-box;
background-color: #fff;
overflow: hidden;
}
.left-tree {
display: inline-block;
padding: 20px 15px 0 5px;
height: 1200px;
border-right: 1px solid #e6e6e6;
box-sizing: border-box;
position: relative;
}
/* todo layui-tree-entry 设置无效 */
.layui-tree-entry {
position: relative;
padding: 10px 0;
height: 20px;
line-height: 20px;
white-space: nowrap;
}
.isFold {
position: absolute;
top: 36%;
right: -10px;
width: 26px;
height: 26px;
line-height: 26px;
border-radius: 13px;
background-color: #fff;
border: 1px solid #e6e6e6;
cursor: pointer;
}
.search-input {
display: inline-block;
width: 98%;
margin-right: 10px;
}
.isChecked {
display: inline-block;
background-color: #e8f1ff;
color: red;
}
.layui-tab-content {
padding: 0;
}
</style>