929 lines
24 KiB
Vue
929 lines
24 KiB
Vue
|
<template>
|
||
|
|
<div class="container">
|
||
|
|
<div class="topTitle">需求列表</div>
|
||
|
|
<!-- 搜索筛选区域 -->
|
||
|
|
<div class="search-filters">
|
||
|
|
<el-input
|
||
|
|
v-model="filters.title"
|
||
|
|
placeholder="请输入"
|
||
|
|
class="filter-input"
|
||
|
|
>
|
||
|
|
<template #prefix>
|
||
|
|
<div>标题名称</div>
|
||
|
|
</template>
|
||
|
|
</el-input>
|
||
|
|
|
||
|
|
<el-input
|
||
|
|
v-model="filters.responsiblePersonName"
|
||
|
|
placeholder="请选择负责人"
|
||
|
|
class="filter-input"
|
||
|
|
readonly
|
||
|
|
@focus="openUser('search')"
|
||
|
|
>
|
||
|
|
<template #prefix>负责人</template>
|
||
|
|
</el-input>
|
||
|
|
|
||
|
|
<el-select
|
||
|
|
v-model="filters.demandStatus"
|
||
|
|
placeholder="不限"
|
||
|
|
class="filter-select"
|
||
|
|
>
|
||
|
|
<template #prefix>需求状态</template>
|
||
|
|
<el-option
|
||
|
|
v-for="item in statusList"
|
||
|
|
:key="item.dictValue"
|
||
|
|
:label="item.dictLabel"
|
||
|
|
:value="item.dictValue"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
|
||
|
|
<el-select
|
||
|
|
v-model="filters.priority"
|
||
|
|
placeholder="不限"
|
||
|
|
class="filter-select"
|
||
|
|
>
|
||
|
|
<template #prefix>优先级</template>
|
||
|
|
<el-option
|
||
|
|
v-for="item in priorityList"
|
||
|
|
:key="item.dictValue"
|
||
|
|
:label="item.dictLabel"
|
||
|
|
:value="item.dictValue"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
|
||
|
|
<div class="filter-buttons">
|
||
|
|
<el-button type="primary" @click="handleSearch">查询</el-button>
|
||
|
|
<el-button @click="handleReset">重置</el-button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 操作按钮区域 -->
|
||
|
|
<div class="table-operations">
|
||
|
|
<el-button type="primary" @click="handleAdd">
|
||
|
|
<el-icon class="el-icon-plus" />
|
||
|
|
新建需求
|
||
|
|
</el-button>
|
||
|
|
<el-button @click="handleBatchDelete">删除</el-button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 表格区域 -->
|
||
|
|
<el-table
|
||
|
|
:data="tableData"
|
||
|
|
style="width: 100%"
|
||
|
|
@selection-change="handleSelectionChange"
|
||
|
|
class="tableBox"
|
||
|
|
>
|
||
|
|
<el-table-column type="selection" width="55" />
|
||
|
|
<el-table-column label="序号" width="70" prop="id" />
|
||
|
|
<el-table-column label="版本号" prop="versionNumber" />
|
||
|
|
<el-table-column label="标题" prop="title" />
|
||
|
|
<el-table-column label="需求状态">
|
||
|
|
<template #default="scope">
|
||
|
|
<div>
|
||
|
|
<el-dropdown
|
||
|
|
trigger="click"
|
||
|
|
placement="bottom"
|
||
|
|
@command="
|
||
|
|
(data) => {
|
||
|
|
changeRow(data, 'demandStatus', scope.row);
|
||
|
|
}
|
||
|
|
"
|
||
|
|
>
|
||
|
|
<el-radio
|
||
|
|
v-model="scope.row.demandStatus"
|
||
|
|
:label="scope.row.demandStatus"
|
||
|
|
:class="['status-tag', getStatusClass(scope.row.demandStatus)]"
|
||
|
|
>
|
||
|
|
{{
|
||
|
|
statusList[scope.row.demandStatus]
|
||
|
|
? statusList[scope.row.demandStatus].dictLabel
|
||
|
|
: ""
|
||
|
|
}}</el-radio
|
||
|
|
>
|
||
|
|
<el-dropdown-menu slot="dropdown">
|
||
|
|
<el-dropdown-item
|
||
|
|
v-for="item in statusList"
|
||
|
|
:key="item.dictValue"
|
||
|
|
:command="item.dictValue"
|
||
|
|
:class="{
|
||
|
|
tableSelect1: true,
|
||
|
|
selectedItem1: item.dictValue == scope.row.demandStatus,
|
||
|
|
}"
|
||
|
|
><el-radio
|
||
|
|
v-model="scope.row.demandStatus"
|
||
|
|
:label="scope.row.demandStatus"
|
||
|
|
:class="['status-tag', getStatusClass(item.dictValue)]"
|
||
|
|
>
|
||
|
|
{{
|
||
|
|
statusList[item.dictValue]
|
||
|
|
? statusList[item.dictValue].dictLabel
|
||
|
|
: ""
|
||
|
|
}}</el-radio
|
||
|
|
></el-dropdown-item
|
||
|
|
>
|
||
|
|
</el-dropdown-menu>
|
||
|
|
</el-dropdown>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column label="负责人" prop="responsiblePersonName">
|
||
|
|
<template #default="scope">
|
||
|
|
<div @click="openUser('change', scope.row)" style="cursor: pointer">
|
||
|
|
{{ scope.row.responsiblePersonName }}
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
|
||
|
|
<el-table-column label="预计工时(天)" prop="estimatedWorkHours" />
|
||
|
|
<el-table-column label="开始时间" prop="createTime">
|
||
|
|
<template #default="scope">
|
||
|
|
{{ scope.row.createTime.split(" ")[0] }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column label="结束时间" prop="endTime">
|
||
|
|
<template #default="scope">
|
||
|
|
{{ scope.row.endTime.split(" ")[0] }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column label="优先级" prop="priority">
|
||
|
|
<template #default="scope">
|
||
|
|
<div>
|
||
|
|
<el-dropdown
|
||
|
|
trigger="click"
|
||
|
|
placement="bottom"
|
||
|
|
@command="
|
||
|
|
(data) => {
|
||
|
|
changeRow(data, 'priority', scope.row);
|
||
|
|
}
|
||
|
|
"
|
||
|
|
>
|
||
|
|
<span class="el-dropdown-link">
|
||
|
|
{{
|
||
|
|
priorityList.find(
|
||
|
|
(ele) => ele.dictValue == scope.row.priority
|
||
|
|
)
|
||
|
|
? priorityList.find(
|
||
|
|
(ele) => ele.dictValue == scope.row.priority
|
||
|
|
).dictLabel
|
||
|
|
: ""
|
||
|
|
}}
|
||
|
|
<i class="el-icon-arrow-down"></i>
|
||
|
|
</span>
|
||
|
|
<el-dropdown-menu slot="dropdown">
|
||
|
|
<el-dropdown-item
|
||
|
|
v-for="item in priorityList"
|
||
|
|
:key="item.dictValue"
|
||
|
|
:command="item.dictValue"
|
||
|
|
:class="{
|
||
|
|
tableSelect2: true,
|
||
|
|
selectedItem2: item.dictValue == scope.row.priority,
|
||
|
|
}"
|
||
|
|
>{{ item.dictLabel }}</el-dropdown-item
|
||
|
|
>
|
||
|
|
</el-dropdown-menu>
|
||
|
|
</el-dropdown>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column label="操作" width="120">
|
||
|
|
<template #default="scope">
|
||
|
|
<div>
|
||
|
|
<el-button type="text" @click="handleEdit(scope.row)">
|
||
|
|
编辑
|
||
|
|
</el-button>
|
||
|
|
<el-button
|
||
|
|
type="text"
|
||
|
|
@click="handleDelete(scope.row)"
|
||
|
|
style="color: #666"
|
||
|
|
>
|
||
|
|
删除
|
||
|
|
</el-button>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
|
||
|
|
<!-- 分页 -->
|
||
|
|
<div class="pagination">
|
||
|
|
<span class="total">共 {{ total }} 条</span>
|
||
|
|
<el-pagination
|
||
|
|
v-model:current-page="currentPage"
|
||
|
|
v-model:page-size="pageSize"
|
||
|
|
:total="total"
|
||
|
|
@current-change="handlePageChange"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<SelectUser
|
||
|
|
:dialogVisible="userSelectDialogVisible"
|
||
|
|
:multiSelect="false"
|
||
|
|
:currentSelectedUser="currentSelectedUser"
|
||
|
|
@confirm="handleUserConfirm"
|
||
|
|
@close="handleUserClose"
|
||
|
|
/>
|
||
|
|
<el-dialog
|
||
|
|
:title="checkedRow.id ? '新建需求' : '修改需求'"
|
||
|
|
:visible.sync="dialogVisibleAdd"
|
||
|
|
width="40%"
|
||
|
|
>
|
||
|
|
<el-form
|
||
|
|
:inline="true"
|
||
|
|
:rules="rules"
|
||
|
|
:model="editData"
|
||
|
|
label-width="80px"
|
||
|
|
class="addForm"
|
||
|
|
ref="ruleForm"
|
||
|
|
>
|
||
|
|
<el-form-item label="标题" class="longItem" prop="title">
|
||
|
|
<el-input v-model="editData.title"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="所属项目" prop="projectId">
|
||
|
|
<el-input v-model="editData.projectName" disabled></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="所属版本" prop="versionId">
|
||
|
|
<el-select
|
||
|
|
v-model="editData.versionId"
|
||
|
|
placeholder="请选择所属版本"
|
||
|
|
clearable
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in versionList"
|
||
|
|
:key="item.nodeId"
|
||
|
|
:label="item.title"
|
||
|
|
:value="item.id"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="负责人" prop="responsiblePerson">
|
||
|
|
<el-input
|
||
|
|
v-model="editData.responsiblePersonName"
|
||
|
|
placeholder="请选择负责人"
|
||
|
|
class="filter-input"
|
||
|
|
readonly
|
||
|
|
@focus="openUser('add')"
|
||
|
|
>
|
||
|
|
</el-input>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="需求状态" prop="demandStatus">
|
||
|
|
<el-select
|
||
|
|
v-model="editData.demandStatus"
|
||
|
|
placeholder="请选择需求状态"
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in statusList"
|
||
|
|
:key="item.dictValue"
|
||
|
|
:label="item.dictLabel"
|
||
|
|
:value="item.dictValue"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="优先级" prop="priority">
|
||
|
|
<el-select v-model="editData.priority" placeholder="请选择优先级">
|
||
|
|
<el-option
|
||
|
|
v-for="item in priorityList"
|
||
|
|
:key="item.dictValue"
|
||
|
|
:label="item.dictLabel"
|
||
|
|
:value="item.dictValue"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="预计工时" prop="estimatedWorkHours">
|
||
|
|
<el-select
|
||
|
|
v-model="editData.estimatedWorkHours"
|
||
|
|
filterable
|
||
|
|
allow-create
|
||
|
|
default-first-option
|
||
|
|
placeholder="请输入预计工时"
|
||
|
|
@change="changeTime"
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in options"
|
||
|
|
:key="item.value"
|
||
|
|
:label="item.label"
|
||
|
|
:value="item.value"
|
||
|
|
>
|
||
|
|
</el-option>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="开始时间" prop="createTime">
|
||
|
|
<el-date-picker
|
||
|
|
@change="changeTime"
|
||
|
|
v-model="editData.createTime"
|
||
|
|
type="date"
|
||
|
|
placeholder="选择日期"
|
||
|
|
style="width: 240px"
|
||
|
|
value-format="yyyy-MM-dd 00:00:00"
|
||
|
|
>
|
||
|
|
</el-date-picker>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="结束时间" prop="endTime">
|
||
|
|
<el-date-picker
|
||
|
|
v-model="editData.endTime"
|
||
|
|
type="date"
|
||
|
|
placeholder="选择日期"
|
||
|
|
value-format="yyyy-MM-dd 23:59:59"
|
||
|
|
>
|
||
|
|
</el-date-picker>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
<div slot="footer" class="dialog-footer">
|
||
|
|
<el-button @click="dialogVisibleAdd = false">取消</el-button>
|
||
|
|
<el-button type="primary" @click="confirmAddDemand">确定</el-button>
|
||
|
|
</div>
|
||
|
|
</el-dialog>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { demandApi, systemApi } from "@/utils/api";
|
||
|
|
import SelectUser from "@/components/SelectUser.vue";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: "MainContentTable",
|
||
|
|
components: {
|
||
|
|
SelectUser,
|
||
|
|
},
|
||
|
|
props: {
|
||
|
|
projectId: "",
|
||
|
|
version: {
|
||
|
|
type: Object,
|
||
|
|
default: {},
|
||
|
|
},
|
||
|
|
projectName: {
|
||
|
|
type: String,
|
||
|
|
default: "",
|
||
|
|
},
|
||
|
|
versionList: {
|
||
|
|
type: Array,
|
||
|
|
default: [],
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
filters: {
|
||
|
|
title: "",
|
||
|
|
responsiblePersonName: "",
|
||
|
|
demandStatus: "",
|
||
|
|
priority: "",
|
||
|
|
responsiblePersonId: "",
|
||
|
|
},
|
||
|
|
tableData: [],
|
||
|
|
selectedRows: [],
|
||
|
|
checkedRow: {},
|
||
|
|
currentPage: 1,
|
||
|
|
pageSize: 10,
|
||
|
|
total: 0,
|
||
|
|
priorityList: [],
|
||
|
|
statusList: [],
|
||
|
|
userSelectDialogVisible: false,
|
||
|
|
dialogVisibleAdd: false,
|
||
|
|
currentSelectedUser: [],
|
||
|
|
editData: {
|
||
|
|
id: "",
|
||
|
|
title: "",
|
||
|
|
versionId: "",
|
||
|
|
demandStatus: "",
|
||
|
|
responsiblePerson: "",
|
||
|
|
estimatedWorkHours: "",
|
||
|
|
createTime: "",
|
||
|
|
endTime: "",
|
||
|
|
priority: "",
|
||
|
|
projectId: "",
|
||
|
|
},
|
||
|
|
rules: {
|
||
|
|
title: [
|
||
|
|
{ required: true, message: "请输入标题", trigger: "blur" },
|
||
|
|
{
|
||
|
|
min: 3,
|
||
|
|
max: 50,
|
||
|
|
message: "长度在 3 到 50 个字符",
|
||
|
|
trigger: "blur",
|
||
|
|
},
|
||
|
|
],
|
||
|
|
demandStatus: [
|
||
|
|
{
|
||
|
|
required: true,
|
||
|
|
message: "请选择需求状态",
|
||
|
|
trigger: "change",
|
||
|
|
},
|
||
|
|
],
|
||
|
|
responsiblePerson: [
|
||
|
|
{
|
||
|
|
required: true,
|
||
|
|
message: "请选择责任人",
|
||
|
|
trigger: "change",
|
||
|
|
},
|
||
|
|
],
|
||
|
|
estimatedWorkHours: [
|
||
|
|
{
|
||
|
|
required: true,
|
||
|
|
message: "请填写预计工时",
|
||
|
|
trigger: "change",
|
||
|
|
},
|
||
|
|
],
|
||
|
|
createTime: [
|
||
|
|
{ required: true, message: "请选择开始时间", trigger: "change" },
|
||
|
|
],
|
||
|
|
endTime: [
|
||
|
|
{ required: true, message: "请选择结束时间", trigger: "change" },
|
||
|
|
],
|
||
|
|
priority: [
|
||
|
|
{ required: true, message: "请选择优先级", trigger: "change" },
|
||
|
|
],
|
||
|
|
projectId: [
|
||
|
|
{ required: true, message: "请选择所属项目", trigger: "blur" },
|
||
|
|
],
|
||
|
|
},
|
||
|
|
options: new Array(10).fill(0).map((ele, index) => ({
|
||
|
|
value: index + 1,
|
||
|
|
label: index + 1 + "天",
|
||
|
|
})),
|
||
|
|
};
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
version(newVal) {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.getDemandList();
|
||
|
|
});
|
||
|
|
},
|
||
|
|
projectId(newVal) {
|
||
|
|
this.editData.projectId = newVal;
|
||
|
|
},
|
||
|
|
projectName(newVal) {
|
||
|
|
this.editData.projectName = newVal;
|
||
|
|
},
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
handleSearch() {
|
||
|
|
// 实现搜索逻辑
|
||
|
|
this.getDemandList();
|
||
|
|
},
|
||
|
|
handleReset() {
|
||
|
|
this.filters = {
|
||
|
|
title: "",
|
||
|
|
responsiblePersonName: "",
|
||
|
|
responsiblePersonId: "",
|
||
|
|
demandStatus: "",
|
||
|
|
priority: "",
|
||
|
|
};
|
||
|
|
this.currentPage = 1;
|
||
|
|
this.pageSize = 10;
|
||
|
|
this.getDemandList();
|
||
|
|
},
|
||
|
|
handleAdd() {
|
||
|
|
// 实现新增逻辑
|
||
|
|
this.dialogVisibleAdd = true;
|
||
|
|
this.editData = {
|
||
|
|
id: "",
|
||
|
|
title: "",
|
||
|
|
versionId: "",
|
||
|
|
demandStatus: "",
|
||
|
|
responsiblePerson: "",
|
||
|
|
estimatedWorkHours: "",
|
||
|
|
createTime: "",
|
||
|
|
endTime: "",
|
||
|
|
priority: "",
|
||
|
|
projectId: "",
|
||
|
|
};
|
||
|
|
this.editData.projectId = this.projectId;
|
||
|
|
if (this.version.type == 0) {
|
||
|
|
this.editData.versionId = this.version.id;
|
||
|
|
}
|
||
|
|
this.editData.projectName = this.projectName;
|
||
|
|
},
|
||
|
|
handleEdit(row) {
|
||
|
|
this.editData = row;
|
||
|
|
this.editData.projectId = this.projectId;
|
||
|
|
this.editData.projectName = this.projectName;
|
||
|
|
this.dialogVisibleAdd = true;
|
||
|
|
// 实现编辑逻辑
|
||
|
|
},
|
||
|
|
handleDelete(row) {
|
||
|
|
// 实现删除逻辑
|
||
|
|
this.$confirm("此操作将永久删除该版本号, 是否继续?", "提示", {
|
||
|
|
confirmButtonText: "确定",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
})
|
||
|
|
.then(() => {
|
||
|
|
demandApi.delDemand(row.id).then((res) => {
|
||
|
|
this.$message({
|
||
|
|
type: "success",
|
||
|
|
message: "删除成功!",
|
||
|
|
});
|
||
|
|
this.getDemandList();
|
||
|
|
});
|
||
|
|
})
|
||
|
|
.catch(() => {});
|
||
|
|
},
|
||
|
|
handleBatchDelete() {
|
||
|
|
if (!this.selectedRows.length) {
|
||
|
|
this.$message({
|
||
|
|
type: "warning",
|
||
|
|
message: "请选择数据!",
|
||
|
|
});
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
// 实现批量删除逻辑
|
||
|
|
this.$confirm("此操作将永久删除该版本号, 是否继续?", "提示", {
|
||
|
|
confirmButtonText: "确定",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
}).then(() => {
|
||
|
|
demandApi
|
||
|
|
.delDemandBatch(this.selectedRows.map((ele) => ele.id).join(","))
|
||
|
|
.then((res) => {
|
||
|
|
this.$message({
|
||
|
|
type: "success",
|
||
|
|
message: "删除成功!",
|
||
|
|
});
|
||
|
|
this.getDemandList();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
},
|
||
|
|
handleSelectionChange(selection) {
|
||
|
|
this.selectedRows = selection;
|
||
|
|
},
|
||
|
|
handlePageChange(page) {
|
||
|
|
this.currentPage = page;
|
||
|
|
// 实现页码改变逻辑
|
||
|
|
},
|
||
|
|
getStatusClass(status) {
|
||
|
|
const classMap = {
|
||
|
|
0: "wait",
|
||
|
|
1: "pending",
|
||
|
|
2: "in-progress",
|
||
|
|
3: "completed",
|
||
|
|
4: "closed",
|
||
|
|
};
|
||
|
|
return classMap[status];
|
||
|
|
},
|
||
|
|
getDemandList() {
|
||
|
|
let param = {
|
||
|
|
...this.filters,
|
||
|
|
pageSize: this.pageSize,
|
||
|
|
pageNum: this.currentPage,
|
||
|
|
};
|
||
|
|
if (this.version.type == 0) {
|
||
|
|
param.versionId = this.version.id;
|
||
|
|
} else {
|
||
|
|
param.id = this.version.id;
|
||
|
|
}
|
||
|
|
demandApi.getDemandList(param).then((res) => {
|
||
|
|
this.tableData = res.rows;
|
||
|
|
this.total = res.total;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
openUser(type, data) {
|
||
|
|
this.selectType = type;
|
||
|
|
if (type == "search") {
|
||
|
|
this.currentSelectedUser = [
|
||
|
|
{ userId: this.filters.responsiblePersonId },
|
||
|
|
];
|
||
|
|
} else if (type == "change") {
|
||
|
|
this.checkedRow = data;
|
||
|
|
this.currentSelectedUser = [{ userId: data.responsiblePerson }];
|
||
|
|
} else if (type == "add") {
|
||
|
|
this.currentSelectedUser = [
|
||
|
|
{ userId: this.editData.responsiblePerson },
|
||
|
|
];
|
||
|
|
}
|
||
|
|
this.userSelectDialogVisible = true;
|
||
|
|
},
|
||
|
|
handleUserConfirm(data) {
|
||
|
|
if (this.selectType == "search") {
|
||
|
|
this.filters.responsiblePersonName = data[0].nickName;
|
||
|
|
this.filters.responsiblePersonId = data[0].userId;
|
||
|
|
} else if (this.selectType == "change") {
|
||
|
|
this.checkedRow.responsiblePerson = data[0].userId;
|
||
|
|
this.checkedRow.responsiblePersonName = data[0].nickName;
|
||
|
|
this.eidtDemand();
|
||
|
|
} else if (this.selectType == "add") {
|
||
|
|
this.editData.responsiblePersonName = data[0].nickName;
|
||
|
|
this.editData.responsiblePerson = data[0].userId;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
handleUserClose() {
|
||
|
|
this.userSelectDialogVisible = false;
|
||
|
|
},
|
||
|
|
eidtDemandRow() {
|
||
|
|
demandApi.eidtDemand(this.checkedRow).then((res) => {
|
||
|
|
this.$message({
|
||
|
|
message: "修改成功",
|
||
|
|
type: "success",
|
||
|
|
});
|
||
|
|
this.getDemandList();
|
||
|
|
});
|
||
|
|
},
|
||
|
|
async getDictData() {
|
||
|
|
const res1 = await systemApi.getDictData("demand_status");
|
||
|
|
const res2 = await systemApi.getDictData("demand_priority");
|
||
|
|
this.statusList = res1.data;
|
||
|
|
this.priorityList = res2.data;
|
||
|
|
},
|
||
|
|
confirmAddDemand() {
|
||
|
|
this.$refs.ruleForm.validate((valid) => {
|
||
|
|
if (valid) {
|
||
|
|
if (
|
||
|
|
this.editData.estimatedWorkHours.replace("天", "") !=
|
||
|
|
parseFloat(this.editData.estimatedWorkHours)
|
||
|
|
) {
|
||
|
|
this.$message({
|
||
|
|
message: "预计工时为数字",
|
||
|
|
type: "warning",
|
||
|
|
});
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
if (
|
||
|
|
(this.editData.estimatedWorkHours * 10) % 5 != 0 ||
|
||
|
|
this.editData.estimatedWorkHours < 0.5
|
||
|
|
) {
|
||
|
|
this.$message({
|
||
|
|
message: "预计工时最小间隔为0.5天",
|
||
|
|
type: "warning",
|
||
|
|
});
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
if (this.editData.id) {
|
||
|
|
demandApi.eidtDemand(this.editData).then((res) => {
|
||
|
|
this.$message({
|
||
|
|
message: "操作成功",
|
||
|
|
type: "success",
|
||
|
|
});
|
||
|
|
this.resetList();
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
demandApi.addDemand(this.editData).then((res) => {
|
||
|
|
this.$message({
|
||
|
|
message: "操作成功",
|
||
|
|
type: "success",
|
||
|
|
});
|
||
|
|
this.resetList();
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
},
|
||
|
|
resetList() {
|
||
|
|
let refreshId = "";
|
||
|
|
if (this.editData.versionId) {
|
||
|
|
refreshId = this.versionList.find(
|
||
|
|
(ele) => this.editData.versionId == ele.id
|
||
|
|
).nodeId;
|
||
|
|
} else {
|
||
|
|
refreshId = "-1";
|
||
|
|
}
|
||
|
|
this.$emit("refreshTree", refreshId);
|
||
|
|
this.dialogVisibleAdd = false;
|
||
|
|
},
|
||
|
|
changeRow(value, label, row) {
|
||
|
|
row[label] = value;
|
||
|
|
this.checkedRow = row;
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.eidtDemandRow(row);
|
||
|
|
});
|
||
|
|
},
|
||
|
|
changeTime(val) {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
let day = (this.editData.estimatedWorkHours + "").replace("天", "");
|
||
|
|
if (day != parseFloat(day)&&day) {
|
||
|
|
this.$message({
|
||
|
|
message: "预计工时为数字",
|
||
|
|
type: "warning",
|
||
|
|
});
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
if (this.editData.estimatedWorkHours && this.editData.createTime) {
|
||
|
|
if (day > 1) {
|
||
|
|
this.editData.endTime = this.moment(
|
||
|
|
new Date(this.editData.createTime).getTime()
|
||
|
|
)
|
||
|
|
.add(Math.ceil(day - 1), "days")
|
||
|
|
.format("YYYY-MM-DD 23:59:59");
|
||
|
|
} else {
|
||
|
|
this.editData.endTime = this.moment(
|
||
|
|
new Date(this.editData.createTime).getTime()
|
||
|
|
).format("YYYY-MM-DD 23:59:59");
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(this.editData.endTime);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
},
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.getDictData();
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
.container {
|
||
|
|
padding: 0 20px 20px;
|
||
|
|
background-color: #ffffff;
|
||
|
|
min-width: 1200px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-filters {
|
||
|
|
display: flex;
|
||
|
|
gap: 20px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
align-items: center;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
.filter-input,
|
||
|
|
.filter-select {
|
||
|
|
width: 240px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.filter-buttons {
|
||
|
|
display: flex;
|
||
|
|
gap: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.table-operations {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
display: flex;
|
||
|
|
gap: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .status-tag {
|
||
|
|
.el-radio__label {
|
||
|
|
padding-left: 5px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .status-tag .el-radio__inner {
|
||
|
|
height: 18px !important;
|
||
|
|
width: 18px !important;
|
||
|
|
line-height: 18px;
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 1px;
|
||
|
|
background: #fff !important;
|
||
|
|
&::after {
|
||
|
|
height: 10px;
|
||
|
|
width: 10px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .status-tag.pending .el-radio__inner {
|
||
|
|
border-color: #ff7d00;
|
||
|
|
&::after {
|
||
|
|
background-color: #ff7d00 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .status-tag.in-progress .el-radio__inner {
|
||
|
|
border-color: #4096ff !important;
|
||
|
|
&::after {
|
||
|
|
background-color: #4096ff !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .status-tag.completed .el-radio__inner {
|
||
|
|
border-color: #50b6aa !important;
|
||
|
|
&::after {
|
||
|
|
background-color: #50b6aa !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .status-tag.closed .el-radio__inner,
|
||
|
|
::v-deep .status-tag.wait .el-radio__inner {
|
||
|
|
border-color: #999999 !important;
|
||
|
|
&::after {
|
||
|
|
background-color: #999999 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .status-tag.pending .el-radio__label {
|
||
|
|
color: #ff7d00 !important;
|
||
|
|
// background-color: #fff7e6;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .status-tag.in-progress .el-radio__label {
|
||
|
|
color: #4096ff !important;
|
||
|
|
// background-color: #e6f4ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .status-tag.completed .el-radio__label {
|
||
|
|
color: #50b6aa !important;
|
||
|
|
// background-color: #e6f7f5;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .status-tag.closed .el-radio__label,
|
||
|
|
::v-deep .status-tag.wait .el-radio__label {
|
||
|
|
color: #999999 !important;
|
||
|
|
// background-color: #f5f5f5;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pagination {
|
||
|
|
margin-top: 20px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.total {
|
||
|
|
color: #666666;
|
||
|
|
font-size: 16px;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .el-button {
|
||
|
|
border-radius: 4px;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .el-table {
|
||
|
|
border: 1px solid #eeeeee;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .el-table th {
|
||
|
|
background-color: #fafafa !important;
|
||
|
|
color: #666666;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .el-table td {
|
||
|
|
color: #333333;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .el-input__prefix {
|
||
|
|
color: #999999;
|
||
|
|
line-height: 35px;
|
||
|
|
padding-left: 10px !important;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
.search-filters ::v-deep .el-input__inner {
|
||
|
|
padding-left: 80px !important;
|
||
|
|
::placeholder {
|
||
|
|
color: #bbb;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .el-button--primary {
|
||
|
|
background-color: #4096ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .el-pagination .el-pager li.is-active {
|
||
|
|
border-color: #4096ff;
|
||
|
|
background-color: #4096ff;
|
||
|
|
}
|
||
|
|
::v-deep .addForm {
|
||
|
|
.el-input__inner {
|
||
|
|
// width: 100%;
|
||
|
|
width: 240px;
|
||
|
|
}
|
||
|
|
.el-form-item {
|
||
|
|
width: 48%;
|
||
|
|
}
|
||
|
|
.el-input--prefix .el-input__inner {
|
||
|
|
padding-left: 40px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .longItem {
|
||
|
|
width: 100% !important;
|
||
|
|
.el-form-item__content {
|
||
|
|
width: 82.2%;
|
||
|
|
.el-input__inner {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.tableSelect1 {
|
||
|
|
width: 150px;
|
||
|
|
text-align: left !important;
|
||
|
|
}
|
||
|
|
.tableSelect2 {
|
||
|
|
width: 100px;
|
||
|
|
text-align: left !important;
|
||
|
|
}
|
||
|
|
.selectedItem1 {
|
||
|
|
&::after {
|
||
|
|
content: "√";
|
||
|
|
width: 10px;
|
||
|
|
height: 10px;
|
||
|
|
position: absolute;
|
||
|
|
right: 10px;
|
||
|
|
color: #4096ff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.selectedItem2 {
|
||
|
|
color: #4096ff;
|
||
|
|
position: relative;
|
||
|
|
&::after {
|
||
|
|
content: "√";
|
||
|
|
width: 10px;
|
||
|
|
height: 10px;
|
||
|
|
position: absolute;
|
||
|
|
right: 10px;
|
||
|
|
color: #4096ff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.tableBox {
|
||
|
|
.el-radio {
|
||
|
|
margin-left: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.topTitle {
|
||
|
|
padding: 0 20px 20px;
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
</style>
|