mula
/
pms-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

基本完成1.0

v1.0.0
‘wangjiuyun 2024-10-22 09:46:54 +08:00
parent ecacb4dc02
commit 5f860e2fed
12 changed files with 452 additions and 245 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/CustomTable.vue
View File

@ -170,7 +170,7 @@ export default {
this.$emit("current-change", val); this.$emit("current-change", val);
}, },
setCurrentRow(row) { setCurrentRow(row) {
this.$refs.elTableRef.setCurrentRow(row); this.$refs.elTableRef?.setCurrentRow(row);
}, },
clearSelection() { clearSelection() {
this.$refs.elTableRef?.clearSelection(); this.$refs.elTableRef?.clearSelection();

192
src/components/SelectUser.vue
View File

@ -1,8 +1,18 @@
<template> <template>
<el-dialog title="选择人员" :visible="dialogVisible" width="50%" @close="handleClose"> <el-dialog
title="选择人员"
:visible="dialogVisible"
width="50%"
@close="handleClose"
>
<div class="select-user-container"> <div class="select-user-container">
<div class="org-tree"> <div class="org-tree">
<el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick" default-expand-all /> <el-tree
:data="treeData"
:props="defaultProps"
@node-click="handleNodeClick"
default-expand-all
/>
</div> </div>
<div class="user-list"> <div class="user-list">
<CustomTable <CustomTable
@ -10,20 +20,32 @@
:columns="columns" :columns="columns"
:tableData="userData" :tableData="userData"
:total="total" :total="total"
:show-selection="true" :show-selection="false"
:show-index="true" :show-index="true"
:table-height="tableHeight" :table-height="tableHeight"
:multiSelect="multiSelect" :multiSelect="multiSelect"
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
rowKey="userId"
:rowClick="
(row) => {
rowClick(row);
}
"
maxHeight="380" maxHeight="380"
> >
<template slot="operation" slot-scope="{ row }"> <template slot="operation" slot-scope="{ row }">
<div class="operation-buttons"> <div class="operation-buttons">
<el-button text type="primary" @click="handleEdit(row)">编辑</el-button> <el-button text type="primary" @click="handleEdit(row)"
<el-button text type="primary" @click="showTimesheet(row)">工作日志</el-button> >编辑</el-button
<el-button text type="danger" @click="handleDelete(row)">删除</el-button> >
<el-button text type="primary" @click="showTimesheet(row)"
>工作日志</el-button
>
<el-button text type="danger" @click="handleDelete(row)"
>删除</el-button
>
</div> </div>
</template> </template>
</CustomTable> </CustomTable>
@ -39,8 +61,8 @@
</template> </template>
<script> <script>
import CustomTable from '@/components/CustomTable.vue' import CustomTable from "@/components/CustomTable.vue";
import { systemApi } from '@/utils/api' import { systemApi } from "@/utils/api";
export default { export default {
components: { components: {
@ -66,63 +88,73 @@ export default {
pageSize: 10, pageSize: 10,
total: 0, total: 0,
selectedUsers: [], selectedUsers: [],
currentDepartment: '', currentDepartment: "",
tableHeight: '350', // 设置一个合适的高度 tableHeight: "350", // 设置一个合适的高度
treeData: [], treeData: [],
defaultProps: { defaultProps: {
children: 'children', children: "children",
label: 'label', label: "label",
}, },
columns: [ columns: [
{ prop: 'nickName', label: '姓名' }, { prop: "nickName", label: "姓名" },
{ prop: 'dept', label: '部门', type: 'status', callback: (data) => data?.deptName }, {
{ prop: 'roles', label: '角色', type: 'status', callback: (data) => data.map(ele => ele.roleName).join(',') }, prop: "dept",
label: "部门",
type: "status",
callback: (data) => data?.deptName,
},
{
prop: "roles",
label: "角色",
type: "status",
callback: (data) => data.map((ele) => ele.roleName).join(","),
},
], ],
userData: [], userData: [],
customTableRef: null, customTableRef: null,
isInternalChange: false, isInternalChange: false,
} };
}, },
emits: [ 'close', 'confirm'], emits: ["close", "confirm"],
methods: { methods: {
handleNodeClick(data) { handleNodeClick(data) {
this.currentDepartment = data.id this.currentDepartment = data.id;
this.currentPage = 1 this.currentPage = 1;
this.fetchUserList() this.fetchUserList();
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
this.currentPage = val this.currentPage = val;
this.fetchUserList() this.fetchUserList();
}, },
handleSizeChange(val) { handleSizeChange(val) {
this.pageSize = val this.pageSize = val;
this.fetchUserList() this.fetchUserList();
}, },
handleClose() { handleClose() {
this.$emit('close') this.$emit("close");
}, },
handleConfirm() { handleConfirm() {
this.$emit('confirm', this.selectedUsers) this.$emit("confirm", this.selectedUsers);
this.handleClose() this.handleClose();
}, },
handleSelectionChange(val) { handleSelectionChange(val) {
if (this.isInternalChange) return if (this.isInternalChange) return;
if (!this.multiSelect) { if (!this.multiSelect) {
this.isInternalChange = true this.isInternalChange = true;
this.$nextTick(() => { this.$nextTick(() => {
if (val.length > 0) { if (val.length > 0) {
const lastSelected = val[val.length - 1] const lastSelected = val[val.length - 1];
this.selectedUsers = [lastSelected] this.selectedUsers = [lastSelected];
this.$refs.customTableRef.clearSelection() this.$refs.customTableRef.clearSelection();
this.$refs.customTableRef.toggleRowSelection(lastSelected, true) this.$refs.customTableRef.toggleRowSelection(lastSelected, true);
} else { } else {
this.selectedUsers = [] this.selectedUsers = [];
} }
this.isInternalChange = false this.isInternalChange = false;
}) });
} else { } else {
this.selectedUsers = val this.selectedUsers = val;
} }
}, },
fetchUserList: async function () { fetchUserList: async function () {
@ -130,42 +162,82 @@ export default {
pageNum: this.currentPage, pageNum: this.currentPage,
pageSize: this.pageSize, pageSize: this.pageSize,
deptId: this.currentDepartment, deptId: this.currentDepartment,
}) });
this.userData = response.rows this.userData = response.rows;
this.total = response.total this.total = response.total;
}, },
fetchTreeData: async function () { fetchTreeData: async function () {
const response = await systemApi.getDeptTree() const response = await systemApi.getDeptTree();
this.treeData = response.data this.treeData = response.data;
},
currentRow(val) {
this.selectedUsers = [val];
},
rowClick(row) {
if (row.userId == this.selectedUsers[0]?.userId)
this.$refs.customTableRef.$refs.elTableRef.setCurrentRow();
else this.selectedUsers = [row];
}, },
}, },
watch: { watch: {
// currentSelectedUser: {
// handler(newVal) {
// this.isInternalChange = true;
// this.$nextTick(() => {
// this.selectedUsers = newVal;
// if (this.$refs.customTableRef) {
// this.$refs.customTableRef.clearSelection();
// newVal.forEach((user) => {
// const row = this.userData.find(
// (item) => item.userId === user.userId
// );
// if (row) {
// this.$refs.customTableRef.toggleRowSelection(row, true);
// }
// });
// }
// this.isInternalChange = false;
// });
// },
// immediate: true,
// deep: true,
// },
currentSelectedUser: { currentSelectedUser: {
handler(newVal) { handler(newVal) {
this.isInternalChange = true
this.$nextTick(() => { this.$nextTick(() => {
this.selectedUsers = newVal let row = this.userData.find(
if (this.$refs.customTableRef) { (ele) => ele.userId == newVal[0]?.userId
this.$refs.customTableRef.clearSelection() );
newVal.forEach(user => { if (row) {
const row = this.userData.find(item => item.userId === user.userId) this.$refs.customTableRef?.setCurrentRow(row);
if (row) { this.selectedUsers = [row];
this.$refs.customTableRef.toggleRowSelection(row, true) } else this.$refs.customTableRef?.setCurrentRow();
} });
}) },
immediate: true,
deep: true,
},
userData: {
handler(newVal) {
this.$nextTick(() => {
let row = this.userData.find(
(ele) => ele.userId == this.currentSelectedUser[0]?.userId
);
if (row) {
this.selectedUsers = [row];
this.$refs.customTableRef?.setCurrentRow(row);
} }
this.isInternalChange = false });
})
}, },
immediate: true, immediate: true,
deep: true, deep: true,
}, },
}, },
mounted() { mounted() {
this.fetchTreeData() this.fetchTreeData();
this.fetchUserList() this.fetchUserList();
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -206,6 +278,10 @@ export default {
margin-left: 0; margin-left: 0;
} }
::v-deep .el-table { ::v-deep .el-table {
max-height:360px !important; max-height: 360px !important;
}
::v-deep tr.el-table__row.current-row .el-table__cell {
background-color: #409eff !important;
color: #fff;
} }
</style> </style>

2
src/layout/components/AppMain.vue
View File

@ -72,7 +72,7 @@ export default {
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background-color: #d2d1d1; background-color: #c8c8c8;
border-radius: 5px; border-radius: 5px;
} }
</style> </style>

224
src/layout/components/TagsView/index.vue
View File

@ -1,36 +1,60 @@
<template> <template>
<div id="tags-view-container" class="tags-view-container"> <div id="tags-view-container" class="tags-view-container">
<scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll"> <scroll-pane
ref="scrollPane"
class="tags-view-wrapper"
@scroll="handleScroll"
>
<router-link <router-link
v-for="tag in visitedViews" v-for="tag in visitedViews"
ref="tag" ref="tag"
:key="tag.path" :key="tag.path"
:class="isActive(tag)?'active':''" :class="isActive(tag) ? 'active' : ''"
:to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }" :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"
tag="span" tag="span"
class="tags-view-item" class="tags-view-item"
:style="activeStyle(tag)" :style="activeStyle(tag)"
@click.middle.native="!isAffix(tag)?closeSelectedTag(tag):''" @click.middle.native="!isAffix(tag) ? closeSelectedTag(tag) : ''"
@contextmenu.prevent.native="openMenu(tag,$event)" @contextmenu.prevent.native="openMenu(tag, $event)"
> >
{{ tag.title }} {{ tag.title }}
<span v-if="!isAffix(tag)" class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)" /> <span
v-if="!isAffix(tag)"
class="el-icon-close"
@click.prevent.stop="closeSelectedTag(tag)"
/>
</router-link> </router-link>
</scroll-pane> </scroll-pane>
<ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu"> <ul
<li @click="refreshSelectedTag(selectedTag)"><i class="el-icon-refresh-right"></i> 刷新页面</li> v-show="visible"
<li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)"><i class="el-icon-close"></i> 关闭当前</li> :style="{ left: left + 'px', top: top + 'px' }"
<li @click="closeOthersTags"><i class="el-icon-circle-close"></i> 关闭其他</li> class="contextmenu"
<li v-if="!isFirstView()" @click="closeLeftTags"><i class="el-icon-back"></i> 关闭左侧</li> >
<li v-if="!isLastView()" @click="closeRightTags"><i class="el-icon-right"></i> 关闭右侧</li> <li @click="refreshSelectedTag(selectedTag)">
<li @click="closeAllTags(selectedTag)"><i class="el-icon-circle-close"></i> 全部关闭</li> <i class="el-icon-refresh-right"></i> 刷新页面
</li>
<li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">
<i class="el-icon-close"></i> 关闭当前
</li>
<li @click="closeOthersTags">
<i class="el-icon-circle-close"></i> 关闭其他
</li>
<li v-if="!isFirstView()" @click="closeLeftTags">
<i class="el-icon-back"></i> 关闭左侧
</li>
<li v-if="!isLastView()" @click="closeRightTags">
<i class="el-icon-right"></i> 关闭右侧
</li>
<li @click="closeAllTags(selectedTag)">
<i class="el-icon-circle-close"></i> 全部关闭
</li>
</ul> </ul>
</div> </div>
</template> </template>
<script> <script>
import ScrollPane from './ScrollPane' import ScrollPane from "./ScrollPane";
import path from 'path' import path from "path";
export default { export default {
components: { ScrollPane }, components: { ScrollPane },
@ -40,201 +64,207 @@ export default {
top: 0, top: 0,
left: 0, left: 0,
selectedTag: {}, selectedTag: {},
affixTags: [] affixTags: [],
} };
}, },
computed: { computed: {
visitedViews() { visitedViews() {
return this.$store.state.tagsView.visitedViews return this.$store.state.tagsView.visitedViews;
}, },
routes() { routes() {
return this.$store.state.permission.routes return this.$store.state.permission.routes;
}, },
theme() { theme() {
return this.$store.state.settings.theme; return this.$store.state.settings.theme;
} },
}, },
watch: { watch: {
$route() { $route() {
this.addTags() this.addTags();
this.moveToCurrentTag() this.moveToCurrentTag();
}, },
visible(value) { visible(value) {
if (value) { if (value) {
document.body.addEventListener('click', this.closeMenu) document.body.addEventListener("click", this.closeMenu);
} else { } else {
document.body.removeEventListener('click', this.closeMenu) document.body.removeEventListener("click", this.closeMenu);
} }
} },
}, },
mounted() { mounted() {
this.initTags() this.initTags();
this.addTags() this.addTags();
}, },
methods: { methods: {
isActive(route) { isActive(route) {
return route.path === this.$route.path return route.path === this.$route.path;
}, },
activeStyle(tag) { activeStyle(tag) {
if (!this.isActive(tag)) return {}; if (!this.isActive(tag)) return {};
return { return {
"background-color": this.theme, "background-color": this.theme,
"border-color": this.theme "border-color": this.theme,
}; };
}, },
isAffix(tag) { isAffix(tag) {
return tag.meta && tag.meta.affix return tag.meta && tag.meta.affix;
}, },
isFirstView() { isFirstView() {
try { try {
return this.selectedTag.fullPath === '/index' || this.selectedTag.fullPath === this.visitedViews[1].fullPath return (
this.selectedTag.fullPath === "/index" ||
this.selectedTag.fullPath === this.visitedViews[1].fullPath
);
} catch (err) { } catch (err) {
return false return false;
} }
}, },
isLastView() { isLastView() {
try { try {
return this.selectedTag.fullPath === this.visitedViews[this.visitedViews.length - 1].fullPath return (
this.selectedTag.fullPath ===
this.visitedViews[this.visitedViews.length - 1].fullPath
);
} catch (err) { } catch (err) {
return false return false;
} }
}, },
filterAffixTags(routes, basePath = '/') { filterAffixTags(routes, basePath = "/") {
let tags = [] let tags = [];
routes.forEach(route => { routes.forEach((route) => {
if (route.meta && route.meta.affix) { if (route.meta && route.meta.affix) {
const tagPath = path.resolve(basePath, route.path) const tagPath = path.resolve(basePath, route.path);
tags.push({ tags.push({
fullPath: tagPath, fullPath: tagPath,
path: tagPath, path: tagPath,
name: route.name, name: route.name,
meta: { ...route.meta } meta: { ...route.meta },
}) });
} }
if (route.children) { if (route.children) {
const tempTags = this.filterAffixTags(route.children, route.path) const tempTags = this.filterAffixTags(route.children, route.path);
if (tempTags.length >= 1) { if (tempTags.length >= 1) {
tags = [...tags, ...tempTags] tags = [...tags, ...tempTags];
} }
} }
}) });
return tags return tags;
}, },
initTags() { initTags() {
const affixTags = this.affixTags = this.filterAffixTags(this.routes) const affixTags = (this.affixTags = this.filterAffixTags(this.routes));
for (const tag of affixTags) { for (const tag of affixTags) {
// Must have tag name // Must have tag name
if (tag.name) { if (tag.name) {
this.$store.dispatch('tagsView/addVisitedView', tag) this.$store.dispatch("tagsView/addVisitedView", tag);
} }
} }
}, },
addTags() { addTags() {
const { name } = this.$route const { name } = this.$route;
if (name) { if (name) {
this.$store.dispatch('tagsView/addView', this.$route) this.$store.dispatch("tagsView/addView", this.$route);
if (this.$route.meta.link) { if (this.$route.meta.link) {
this.$store.dispatch('tagsView/addIframeView', this.$route) this.$store.dispatch("tagsView/addIframeView", this.$route);
} }
} }
return false return false;
}, },
moveToCurrentTag() { moveToCurrentTag() {
const tags = this.$refs.tag const tags = this.$refs.tag;
this.$nextTick(() => { this.$nextTick(() => {
for (const tag of tags) { for (const tag of tags) {
if (tag.to.path === this.$route.path) { if (tag.to.path === this.$route.path) {
this.$refs.scrollPane.moveToTarget(tag) this.$refs.scrollPane.moveToTarget(tag);
// when query is different then update // when query is different then update
if (tag.to.fullPath !== this.$route.fullPath) { if (tag.to.fullPath !== this.$route.fullPath) {
this.$store.dispatch('tagsView/updateVisitedView', this.$route) this.$store.dispatch("tagsView/updateVisitedView", this.$route);
} }
break break;
} }
} }
}) });
}, },
refreshSelectedTag(view) { refreshSelectedTag(view) {
this.$tab.refreshPage(view); this.$tab.refreshPage(view);
if (this.$route.meta.link) { if (this.$route.meta.link) {
this.$store.dispatch('tagsView/delIframeView', this.$route) this.$store.dispatch("tagsView/delIframeView", this.$route);
} }
}, },
closeSelectedTag(view) { closeSelectedTag(view) {
this.$tab.closePage(view).then(({ visitedViews }) => { this.$tab.closePage(view).then(({ visitedViews }) => {
if (this.isActive(view)) { if (this.isActive(view)) {
this.toLastView(visitedViews, view) this.toLastView(visitedViews, view);
} }
}) });
}, },
closeRightTags() { closeRightTags() {
this.$tab.closeRightPage(this.selectedTag).then(visitedViews => { this.$tab.closeRightPage(this.selectedTag).then((visitedViews) => {
if (!visitedViews.find(i => i.fullPath === this.$route.fullPath)) { if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {
this.toLastView(visitedViews) this.toLastView(visitedViews);
} }
}) });
}, },
closeLeftTags() { closeLeftTags() {
this.$tab.closeLeftPage(this.selectedTag).then(visitedViews => { this.$tab.closeLeftPage(this.selectedTag).then((visitedViews) => {
if (!visitedViews.find(i => i.fullPath === this.$route.fullPath)) { if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {
this.toLastView(visitedViews) this.toLastView(visitedViews);
} }
}) });
}, },
closeOthersTags() { closeOthersTags() {
this.$router.push(this.selectedTag.fullPath).catch(()=>{}); this.$router.push(this.selectedTag.fullPath).catch(() => {});
this.$tab.closeOtherPage(this.selectedTag).then(() => { this.$tab.closeOtherPage(this.selectedTag).then(() => {
this.moveToCurrentTag() this.moveToCurrentTag();
}) });
}, },
closeAllTags(view) { closeAllTags(view) {
this.$tab.closeAllPage().then(({ visitedViews }) => { this.$tab.closeAllPage().then(({ visitedViews }) => {
if (this.affixTags.some(tag => tag.path === this.$route.path)) { if (this.affixTags.some((tag) => tag.path === this.$route.path)) {
return return;
} }
this.toLastView(visitedViews, view) this.toLastView(visitedViews, view);
}) });
}, },
toLastView(visitedViews, view) { toLastView(visitedViews, view) {
const latestView = visitedViews.slice(-1)[0] const latestView = visitedViews.slice(-1)[0];
if (latestView) { if (latestView) {
this.$router.push(latestView.fullPath) this.$router.push(latestView.fullPath);
} else { } else {
// now the default is to redirect to the home page if there is no tags-view, // now the default is to redirect to the home page if there is no tags-view,
// you can adjust it according to your needs. // you can adjust it according to your needs.
if (view.name === 'Dashboard') { if (view.name === "Dashboard") {
// to reload home page // to reload home page
this.$router.replace({ path: '/redirect' + view.fullPath }) this.$router.replace({ path: "/redirect" + view.fullPath });
} else { } else {
this.$router.push('/') this.$router.push("/");
} }
} }
}, },
openMenu(tag, e) { openMenu(tag, e) {
const menuMinWidth = 105 const menuMinWidth = 105;
const offsetLeft = this.$el.getBoundingClientRect().left // container margin left const offsetLeft = this.$el.getBoundingClientRect().left; // container margin left
const offsetWidth = this.$el.offsetWidth // container width const offsetWidth = this.$el.offsetWidth; // container width
const maxLeft = offsetWidth - menuMinWidth // left boundary const maxLeft = offsetWidth - menuMinWidth; // left boundary
const left = e.clientX - offsetLeft + 15 // 15: margin right const left = e.clientX - offsetLeft + 15; // 15: margin right
if (left > maxLeft) { if (left > maxLeft) {
this.left = maxLeft this.left = maxLeft;
} else { } else {
this.left = left this.left = left;
} }
this.top = e.clientY this.top = e.clientY;
this.visible = true this.visible = true;
this.selectedTag = tag this.selectedTag = tag;
}, },
closeMenu() { closeMenu() {
this.visible = false this.visible = false;
}, },
handleScroll() { handleScroll() {
this.closeMenu() this.closeMenu();
} },
} },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -243,7 +273,7 @@ export default {
width: 100%; width: 100%;
background: #fff; background: #fff;
border-bottom: 1px solid #d8dce5; border-bottom: 1px solid #d8dce5;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04); box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
.tags-view-wrapper { .tags-view-wrapper {
.tags-view-item { .tags-view-item {
display: inline-block; display: inline-block;
@ -269,7 +299,7 @@ export default {
color: #fff; color: #fff;
border-color: #42b983; border-color: #42b983;
&::before { &::before {
content: ''; content: "";
background: #fff; background: #fff;
display: inline-block; display: inline-block;
width: 8px; width: 8px;
@ -292,7 +322,7 @@ export default {
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
color: #333; color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, .3); box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
li { li {
margin: 0; margin: 0;
padding: 7px 16px; padding: 7px 16px;
@ -315,10 +345,10 @@ export default {
vertical-align: 2px; vertical-align: 2px;
border-radius: 50%; border-radius: 50%;
text-align: center; text-align: center;
transition: all .3s cubic-bezier(.645, .045, .355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transform-origin: 100% 50%; transform-origin: 100% 50%;
&:before { &:before {
transform: scale(.6); transform: scale(0.6);
display: inline-block; display: inline-block;
vertical-align: -3px; vertical-align: -3px;
} }

2
src/views/login.vue
View File

@ -79,7 +79,7 @@
</el-form> </el-form>
<!-- 底部 --> <!-- 底部 -->
<div class="el-login-footer"> <div class="el-login-footer">
<span>Copyright © 2018-2024 ruoyi.vip All Rights Reserved.</span> <span>unissense.tech</span>
</div> </div>
</div> </div>
</template> </template>

79
src/views/project/detail.vue
View File

@ -37,15 +37,21 @@
readonly readonly
:disabled="isEditing" :disabled="isEditing"
@click.native="openProjectManagerSelect" @click.native="openProjectManagerSelect"
/> >
<el-button
size="mini"
slot="append"
icon="el-icon-user"
></el-button
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="24"> <el-row :gutter="24">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="项目状态" prop="projectState"> <el-form-item label="数据状态" prop="dataState" style="display: none">
<el-select <el-select
v-model="formData.projectState" v-model="formData.dataState"
placeholder="根据时间自动生成" placeholder="根据时间自动生成"
disabled disabled
class="full-width" class="full-width"
@ -55,6 +61,20 @@
<el-option label="已完成" value="2" /> <el-option label="已完成" value="2" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="项目状态" prop="projectState">
<el-select
v-model="formData.projectState"
placeholder="请选择项目状态"
class="full-width"
>
<el-option
v-for="item in statusList"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select>
</el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="预计人天" prop="budgetDate"> <el-form-item label="预计人天" prop="budgetDate">
@ -123,7 +143,7 @@
:show-pagination="false" :show-pagination="false"
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
style="height: 100%;" style="height: 100%"
> >
<template slot="userName" slot-scope="{ row }"> <template slot="userName" slot-scope="{ row }">
<el-input <el-input
@ -230,10 +250,9 @@
/> />
<SelectUser <SelectUser
v-if="showProjectManagerSelect"
:dialogVisible="showProjectManagerSelect" :dialogVisible="showProjectManagerSelect"
:multi-select="false" :multi-select="false"
:selected-users="projectManagerSelectedUser" :currentSelectedUser="projectManagerSelectedUser"
@confirm="handleProjectManagerConfirm" @confirm="handleProjectManagerConfirm"
@close="closeProjectManagerSelect" @close="closeProjectManagerSelect"
/> />
@ -268,8 +287,10 @@ export default {
endDate: "", endDate: "",
budgetDate: 0, budgetDate: 0,
state: 0, state: 0,
dataState: 0,
}, },
postOptions: [], postOptions: [],
statusList: [],
columns: [ columns: [
{ prop: "userName", label: "姓名" }, { prop: "userName", label: "姓名" },
{ prop: "post", label: "项目职位" }, { prop: "post", label: "项目职位" },
@ -287,8 +308,12 @@ export default {
projectLeader: [ projectLeader: [
{ required: true, message: "项目负责人为必填", trigger: "change" }, { required: true, message: "项目负责人为必填", trigger: "change" },
], ],
projectState: [
{ required: true, message: "请选择项目状态", trigger: "change" },
],
startDate: [ startDate: [
{ required: true, message: "开始日期为必填", trigger: "change" }, { required: true, message: "开始日期为必填", trigger: "change" },
{ validator: this.validateDates, trigger: "change" },
], ],
endDate: [ endDate: [
{ required: true, message: "结束日期为必填", trigger: "change" }, { required: true, message: "结束日期为必填", trigger: "change" },
@ -296,7 +321,6 @@ export default {
], ],
budgetDate: [ budgetDate: [
{ required: true, message: "预算天数为必填", trigger: "blur" }, { required: true, message: "预算天数为必填", trigger: "blur" },
{ validator: this.validateDates, trigger: "change" },
], ],
}, },
}; };
@ -319,11 +343,11 @@ export default {
if (start && end) { if (start && end) {
if (now < start) { if (now < start) {
this.formData.projectState = "0"; // 未开始 this.formData.dataState = "0"; // 未开始
} else if (now >= start && now <= end) { } else if (now >= start && now <= end) {
this.formData.projectState = "1"; // 进行中 this.formData.dataState = "1"; // 进行中
} else { } else {
this.formData.projectState = "2"; // 已结束 this.formData.dataState = "2"; // 已结束
} }
} }
}, },
@ -351,10 +375,10 @@ export default {
const projectDataToSave = { const projectDataToSave = {
...this.formData, ...this.formData,
startDate: this.formData.startDate startDate: this.formData.startDate
? new Date(this.formData.startDate+' 00:00:00').getTime() ? new Date(this.formData.startDate + " 00:00:00").getTime()
: null, : null,
endDate: this.formData.endDate endDate: this.formData.endDate
? new Date(this.formData.endDate+' 23:59:59').getTime() ? new Date(this.formData.endDate + " 23:59:59").getTime()
: null, : null,
}; };
@ -384,7 +408,7 @@ export default {
} }
} else { } else {
this.$modal.msgError("请检查表单填写是否正确"); this.$modal.msgError("请检查表单填写是否正确");
this.$modal.msgSuccess("操作成功"); // this.$modal.msgSuccess("操作成功");
} }
}); });
}, },
@ -405,10 +429,10 @@ export default {
isNew: true, isNew: true,
userId: "", userId: "",
isEditing: true, isEditing: true,
index: this.tableData.length, index: this.tableData.length - 1,
}; };
this.currentEditingRow = newUser; this.currentEditingRow = newUser;
this.tableData.push(newUser); this.tableData.unshift(newUser);
}, },
confirmAddUser(row) { confirmAddUser(row) {
if (!this.formData.projectId) { if (!this.formData.projectId) {
@ -439,13 +463,15 @@ export default {
}); });
}, },
cancelAddUser(row) { cancelAddUser(row) {
const index = this.tableData.findIndex( if (row.index != undefined) {
(item) => item.userId === row.userId let index = this.tableData.findIndex((item) => item.index == row.index);
);
if (index !== -1) {
this.tableData.splice(index, 1); this.tableData.splice(index, 1);
} else { } else {
this.tableData.splice(row.index, 1); var index = this.tableData.findIndex(
(item) => item.userId === row.userId
);
this.tableData.splice(index, 1);
} }
}, },
cancelUserEdit(row) { cancelUserEdit(row) {
@ -457,6 +483,8 @@ export default {
this.currentSelectedUser = row.userId this.currentSelectedUser = row.userId
? [{ userId: row.userId, userName: row.userName }] ? [{ userId: row.userId, userName: row.userName }]
: []; : [];
console.log(111, this.currentSelectedUser);
this.showSelectUser = true; this.showSelectUser = true;
}, },
handleUserConfirm(selectedUsers) { handleUserConfirm(selectedUsers) {
@ -478,8 +506,8 @@ export default {
this.projectManagerSelectedUser = this.formData.projectLeader this.projectManagerSelectedUser = this.formData.projectLeader
? [ ? [
{ {
id: this.formData.projectLeaderId, userId: this.formData.projectLeader,
name: this.formData.projectLeader, nickName: this.formData.projectLeaderName,
}, },
] ]
: []; : [];
@ -566,7 +594,9 @@ export default {
}, },
async getDictData() { async getDictData() {
const res = await systemApi.getDictData("business_positions"); const res = await systemApi.getDictData("business_positions");
const res2 = await systemApi.getDictData("business_projectstate");
this.postOptions = res.data; this.postOptions = res.data;
this.statusList = res2.data;
}, },
async getProjectUser() { async getProjectUser() {
const res = await projectApi.getProjectUser(this.formData.projectId); const res = await projectApi.getProjectUser(this.formData.projectId);
@ -608,6 +638,7 @@ export default {
} else { } else {
this.updateProjectState(); // 对于新项目，也要初始化状态 this.updateProjectState(); // 对于新项目，也要初始化状态
} }
// 获取项目状态数据字典
}, },
}; };
</script> </script>
@ -662,7 +693,9 @@ export default {
height: 42px; /* 调高输入框高度 */ height: 42px; /* 调高输入框高度 */
width: 80%; width: 80%;
} }
.custom-form ::v-deep .el-input__inner {
height: 100%;
}
.custom-form ::v-deep .el-select { .custom-form ::v-deep .el-select {
width: 100%; width: 100%;
} }

84
src/views/project/list.vue
View File

@ -16,14 +16,17 @@
placeholder="负责人" placeholder="负责人"
readonly readonly
@click.native="openUserSelectDialog" @click.native="openUserSelectDialog"
/> ><el-button slot="append" icon="el-icon-user"></el-button
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="项目状态" class="form-item"> <el-form-item label="项目状态" class="form-item">
<el-select v-model="searchForm.projectState" placeholder="项目状态"> <el-select v-model="searchForm.projectState" placeholder="项目状态">
<el-option label="全部" value="" /> <el-option
<el-option label="未启动" value="0" /> v-for="item in statusList"
<el-option label="进行中" value="1" /> :key="item.dictValue"
<el-option label="已完成" value="2" /> :label="item.dictLabel"
:value="item.dictValue"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item class="search-buttons"> <el-form-item class="search-buttons">
@ -51,7 +54,7 @@
:show-index="true" :show-index="true"
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
tableHeight="80%" tableHeight="495px"
> >
<template slot="operation" slot-scope="{ row }"> <template slot="operation" slot-scope="{ row }">
<div class="operation-buttons"> <div class="operation-buttons">
@ -88,7 +91,7 @@
<script> <script>
import CustomTable from "@/components/CustomTable.vue"; import CustomTable from "@/components/CustomTable.vue";
import SelectUser from "@/components/SelectUser.vue"; import SelectUser from "@/components/SelectUser.vue";
import { projectApi } from "@/utils/api"; import { projectApi, systemApi } from "@/utils/api";
export default { export default {
components: { components: {
@ -104,47 +107,61 @@ export default {
projectState: "", projectState: "",
}, },
columns: [ columns: [
{ prop: "projectName", label: "项目名称",width:300, }, { prop: "projectName", label: "项目名称", width: 300 },
{ prop: "projectCode", label: "项目编号",width:200, }, { prop: "projectCode", label: "项目编号", width: 200 },
{ prop: "projectLeaderName", label: "负责人" }, { prop: "projectLeaderName", label: "负责人" },
{ prop: "budgetDate", label: "预计工时(天)" }, { prop: "budgetDate", label: "预计工时(天)" },
{ {
prop: "startDate", prop: "startDate",
label: "开始时间", label: "开始时间",
type: "status", type: "status",
callback: (data) => data.split(" ")[0], callback: (data) => data?.split(" ")[0],
}, },
{ {
prop: "endDate", prop: "endDate",
label: "结束时间", label: "结束时间",
type: "status", type: "status",
callback: (data) => data.split(" ")[0], callback: (data) => data?.split(" ")[0],
}, },
{ {
prop: "projectState", prop: "projectState",
label: "项目状态", label: "项目状态",
type: "status", type: "status",
callback: (value) => { callback: (value) => {
let status = "未知"; let status = this.statusList.find(
let color = ""; (ele) => ele.dictValue == value
switch (value) { )?.dictLabel;
case "0": let color = "#333";
status = "未启动"; // switch (status) {
color = "#909399"; // 灰色 // case "待启动":
break; // color = "#fa721d"; // 橙色
case "1": // break;
status = "进行中"; // case "已提需求-待开发":
color = "#409EFF"; // 蓝色 // color = "#dd242a"; // 红色
break; // break;
case "2": // case "已提需求-开发中":
status = "已完成"; // color = "#1686d8"; // 绿色
color = "#67C23A"; // 绿色 // break;
break; // case "已提需求-已完成":
} // color = "#5cb85c"; // 红色
// break;
// case "开发完成-待验收":
// color = "#f7c731"; // 黄色
// break;
// case "开发完成-已验收":
// color = "#8C33FF"; // 蓝色
// break;
// case "开发完成-已计收":
// color = "#08fb9e"; // 绿色
// break;
// default:
// color = "#000"; // 默认白色
// break;
// }
return `<span style="color: ${color}">${status}</span>`; return `<span style="color: ${color}">${status}</span>`;
}, },
}, },
{ prop: "teamNum", label: "参与项目人数" }, { prop: "teamNum", label: "参与项目人数",width:100 },
{ prop: "createByName", label: "项目创建人" }, { prop: "createByName", label: "项目创建人" },
{ {
prop: "operation", prop: "operation",
@ -160,11 +177,11 @@ export default {
currentSelectedUser: [], currentSelectedUser: [],
pageNum: 1, // 当前页码 pageNum: 1, // 当前页码
pageSize: 10, // 每页条数 pageSize: 10, // 每页条数
statusList: [],
}; };
}, },
methods: { methods: {
onSearch() { onSearch() {
console.log("Search with:", this.searchForm);
this.fetchProjectList(); this.fetchProjectList();
}, },
onReset() { onReset() {
@ -228,8 +245,13 @@ export default {
handleUserClose() { handleUserClose() {
this.userSelectDialogVisible = false; this.userSelectDialogVisible = false;
}, },
async getDictData() {
const res = await systemApi.getDictData("business_projectstate");
this.statusList = res.data;
},
}, },
mounted() { mounted() {
this.getDictData();
this.fetchProjectList(); this.fetchProjectList();
}, },
}; };
@ -288,8 +310,8 @@ export default {
} }
::v-deep .operation-column { ::v-deep .operation-column {
background-color: #fff; background-color: #ffffff;
box-shadow: -2px 0 5px rgba(0, 0, 0, 0.1); box-shadow: -2px 0 5px rgba(241, 112, 6, 0.1);
} }
.el-button.is-text { .el-button.is-text {

65
src/views/projectBank/projectProgress.vue
View File

@ -28,6 +28,7 @@
:showSummary="true" :showSummary="true"
:summaryMethod="getFixedColumnsSummaries" :summaryMethod="getFixedColumnsSummaries"
tableHeight="600" tableHeight="600"
:border="true"
></CustomTable> ></CustomTable>
</div> </div>
</div> </div>
@ -37,10 +38,11 @@
</template> </template>
<script> <script>
import { projectBank } from "@/utils/api"; import { projectBank, systemApi } from "@/utils/api";
import CustomTable from "@/components/CustomTable.vue"; import CustomTable from "@/components/CustomTable.vue";
export default { export default {
name: "ProjectProgress",
components: { components: {
CustomTable, CustomTable,
}, },
@ -50,6 +52,7 @@ export default {
dateRange: this.getDefaultDateRange(), dateRange: this.getDefaultDateRange(),
fixedColumns: [], fixedColumns: [],
executionData: [], executionData: [],
statusList: [],
}; };
}, },
methods: { methods: {
@ -117,6 +120,10 @@ export default {
}, },
}); });
}, },
async getDictData() {
const res = await systemApi.getDictData("business_projectstate");
this.statusList = res.data;
},
}, },
watch: { watch: {
timeRange: { timeRange: {
@ -171,24 +178,38 @@ export default {
label: "项目状态", label: "项目状态",
type: "button", type: "button",
fixed: "left", fixed: "left",
width: 100, width: 150,
callback: (value) => { callback: (value) => {
let status = "未知"; let status = this.statusList.find(
let color = ""; (ele) => ele.dictValue == value
switch (value) { )?.dictLabel;
case "0": let color = "#333";
status = "未启动"; // switch (status) {
color = "#909399"; // 灰色 // case "待启动":
break; // color = "#fa721d"; // 橙色
case "1": // break;
status = "进行中"; // case "已提需求-待开发":
color = "#409EFF"; // 蓝色 // color = "#dd242a"; // 红色
break; // break;
case "2": // case "已提需求-开发中":
status = "已完成"; // color = "#1686d8"; // 绿色
color = "#67C23A"; // 绿色 // break;
break; // case "已提需求-已完成":
} // color = "#5cb85c"; // 红色
// break;
// case "开发完成-待验收":
// color = "#f7c731"; // 黄色
// break;
// case "开发完成-已验收":
// color = "#8C33FF"; // 蓝色
// break;
// case "开发完成-已计收":
// color = "#08fb9e"; // 绿色
// break;
// default:
// color = "#000"; // 默认白色
// break;
// }
return `<span style="color: ${color}">${status}</span>`; return `<span style="color: ${color}">${status}</span>`;
}, },
}, },
@ -210,6 +231,7 @@ export default {
}, },
}, },
mounted() { mounted() {
this.getDictData();
this.getProjectProgress(); this.getProjectProgress();
}, },
beforeDestroy() {}, beforeDestroy() {},
@ -245,7 +267,7 @@ export default {
text-align: center; text-align: center;
} }
::v-deep .el-table__footer td { ::v-deep .el-table__footer td {
background-color: #c0c4cc !important; background-color: #e0e1e3 !important;
font-weight: bold; font-weight: bold;
text-align: center; /* 确保合计行内容居中 */ text-align: center; /* 确保合计行内容居中 */
} }
@ -322,8 +344,6 @@ export default {
} }
::v-deep .el-table__fixed { ::v-deep .el-table__fixed {
box-shadow: 5px 20px 20px rgba(7, 7, 7, 0.5) !important; box-shadow: 5px 20px 20px rgba(7, 7, 7, 0.5) !important;
} }
.shadowBox { .shadowBox {
// position: absolute; // position: absolute;
@ -333,4 +353,7 @@ export default {
// left: 450px; // left: 450px;
// z-index: 100; // z-index: 100;
} }
::v-deep .el-table__footer td {
border: none !important;
}
</style> </style>

23
src/views/projectBank/projectUser.vue
View File

@ -60,6 +60,8 @@
:columns="scrollableColumns" :columns="scrollableColumns"
:tableData="executionData" :tableData="executionData"
:showPagination="false" :showPagination="false"
:border="true"
tableHeight="600"
></CustomTable> ></CustomTable>
</div> </div>
</div> </div>
@ -70,6 +72,7 @@ import CustomTable from "@/components/CustomTable.vue";
import { projectBank, projectApi } from "@/utils/api"; import { projectBank, projectApi } from "@/utils/api";
export default { export default {
name: "ProjectUser",
components: { components: {
CustomTable, CustomTable,
}, },
@ -146,7 +149,6 @@ export default {
newEndDate.setMonth(startDate.getMonth() + 3); newEndDate.setMonth(startDate.getMonth() + 3);
this.dateRange[1] = newEndDate.toISOString().split("T")[0]; // 格式化为 YYYY-MM-DD this.dateRange[1] = newEndDate.toISOString().split("T")[0]; // 格式化为 YYYY-MM-DD
} }
}, },
async handleProjectChange(projectId, time) { async handleProjectChange(projectId, time) {
const res = await projectApi.getProjectDetail(projectId); const res = await projectApi.getProjectDetail(projectId);
@ -165,7 +167,7 @@ export default {
endDate: this.dateRange[1] + " 23:59:59", endDate: this.dateRange[1] + " 23:59:59",
projectId: this.projectInfo.projectId, projectId: this.projectInfo.projectId,
}); });
console.log(123,this.dateRange); console.log(123, this.dateRange);
const start = new Date(this.timeRange[0]); const start = new Date(this.timeRange[0]);
const end = new Date(this.timeRange[1]); const end = new Date(this.timeRange[1]);
@ -180,7 +182,11 @@ export default {
goToDetail(row) { goToDetail(row) {
this.$router.push({ this.$router.push({
path: "/", path: "/",
query: { userId: row.userId, projectId: this.projectInfo.projectId,nickName:row.userName }, query: {
userId: row.userId,
projectId: this.projectInfo.projectId,
nickName: row.userName,
},
}); });
}, },
}, },
@ -366,4 +372,15 @@ export default {
width: 100px; width: 100px;
} }
} }
::v-deep .el-table__body{
height: 100%;
}
::v-deep td.el-table__cell{
border-bottom: none;
border-top: none;
vertical-align: top;
}
::v-deep tr.el-table__row.current-row .el-table__cell {
background-color: #fff !important;
}
</style> </style>

13
src/views/projectBank/userProject.vue
View File

@ -11,6 +11,7 @@
placeholder="请选择用户" placeholder="请选择用户"
readonly readonly
@click.native="openUserSelectDialog" @click.native="openUserSelectDialog"
suffix-icon="el-icon-user"
></el-input> ></el-input>
</div> </div>
<div class="date-range-container"> <div class="date-range-container">
@ -34,7 +35,9 @@
:showPagination="false" :showPagination="false"
:showSummary="true" :showSummary="true"
:summaryMethod="getFixedColumnsSummaries" :summaryMethod="getFixedColumnsSummaries"
:tableHeight="600" tableHeight="600"
:border="true"
></CustomTable> ></CustomTable>
</div> </div>
</div> </div>
@ -55,6 +58,7 @@ import SelectUser from "@/components/SelectUser.vue";
import { projectBank } from "@/utils/api"; import { projectBank } from "@/utils/api";
export default { export default {
name: "UserProject",
components: { components: {
CustomTable, CustomTable,
SelectUser, SelectUser,
@ -229,7 +233,7 @@ export default {
} }
.selectBox { .selectBox {
width: 200px; width: 200px;
margin-left: 35px; margin-left: 15px;
} }
.selectBox span { .selectBox span {
width: 120px; width: 120px;
@ -286,7 +290,7 @@ export default {
} }
/* 调整合计行的样式 */ /* 调整合计行的样式 */
::v-deep .el-table__footer td { ::v-deep .el-table__footer td {
background-color: #c0c4cc !important; background-color: #e0e1e3 !important;
font-weight: bold; font-weight: bold;
color: #606266; color: #606266;
@ -312,4 +316,7 @@ export default {
bottom: 0; bottom: 0;
position: absolute; position: absolute;
} }
::v-deep .el-table__footer td{
border: none !important;
}
</style> </style>

2
src/views/register.vue
View File

@ -61,7 +61,7 @@
</el-form> </el-form>
<!-- 底部 --> <!-- 底部 -->
<div class="el-register-footer"> <div class="el-register-footer">
<span>Copyright © 2018-2024 ruoyi.vip All Rights Reserved.</span> <span>unissense.tech</span>
</div> </div>
</div> </div>
</template> </template>

5
src/views/worklog/index.vue
View File

@ -419,7 +419,6 @@ export default {
async fetchUserProjects() { async fetchUserProjects() {
try { try {
const response = await workLogApi.userProject(this.projectInfo.userId); const response = await workLogApi.userProject(this.projectInfo.userId);
console.log(12333, this.projectList);
this.projectList = response.data; this.projectList = response.data;
if (this.projectList.length) { if (this.projectList.length) {
let arr = []; let arr = [];
@ -552,7 +551,7 @@ export default {
font-size: 20px; font-size: 20px;
} }
.project-info-calendar .calendar-view ::v-deep .el-calendar-day { .project-info-calendar .calendar-view ::v-deep .el-calendar-day {
height: 85px; /* 增加日期单元格高度（原高度 + 5px） */ height: 70px; /* 增加日期单元格高度（原高度 + 5px） */
// padding-top: 5px; // padding-top: 5px;
padding: 10px; padding: 10px;
border-radius: 10px; border-radius: 10px;
@ -568,7 +567,7 @@ border: none;
cursor: pointer; cursor: pointer;
height: 100%; height: 100%;
text-align: center; text-align: center;
line-height: 65px; line-height: 50px;
border-radius: 10px; border-radius: 10px;
} }