|
@@ -3,74 +3,91 @@
|
|
<!--工具条-->
|
|
<!--工具条-->
|
|
<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
|
|
<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
|
|
<el-form :inline="true">
|
|
<el-form :inline="true">
|
|
|
|
+ <div style="margin-left: 20px;display: inline-block">
|
|
<el-form-item label="任务列表">
|
|
<el-form-item label="任务列表">
|
|
-
|
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
|
+ </div>
|
|
<el-form-item >
|
|
<el-form-item >
|
|
- <div>
|
|
|
|
- <el-input style="float:left;" v-model="keyword" class="input-with-select" placeholder="请输入项目名称关键字" clearable="true">
|
|
|
|
|
|
+ <div style="margin-left: 8px">
|
|
|
|
+ <!-- <el-input style="float:left;" v-model="keyword" class="input-with-select" placeholder="请输入项目名称关键字" clearable="true"> -->
|
|
<el-select v-model="searchField" style="width:120px;" slot="prepend" placeholder="请选择">
|
|
<el-select v-model="searchField" style="width:120px;" slot="prepend" placeholder="请选择">
|
|
- <el-option label="项目名称" value=1 ></el-option>
|
|
|
|
- <el-option label="项目编码" value=2></el-option>
|
|
|
|
|
|
+ <el-option label="进行中" value="0" @click.native="hiddens()"></el-option>
|
|
|
|
+ <el-option label="已完成" value="1" @click.native="hiddens()"></el-option>
|
|
</el-select>
|
|
</el-select>
|
|
- <el-button slot="append" @click="searchList" icon="el-icon-search"></el-button>
|
|
|
|
- </el-input>
|
|
|
|
|
|
+ <!-- <el-button slot="append" @click="searchList" icon="el-icon-search"></el-button> -->
|
|
|
|
+ <!-- </el-input> -->
|
|
</div>
|
|
</div>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item style="float:right;">
|
|
|
|
- <el-link type="primary" :underline="false" @click="handleAdd(-1,null)">新增项目</el-link>
|
|
|
|
- </el-form-item>
|
|
|
|
|
|
+ <!-- <el-form-item style="float:right;">
|
|
|
|
+ <el-link type="primary" :underline="false" @click="handleAdd(-1,null)">新增任务</el-link>
|
|
|
|
+ </el-form-item> -->
|
|
</el-form>
|
|
</el-form>
|
|
</el-col>
|
|
</el-col>
|
|
|
|
+ <div style="display: flex;width: 100%;">
|
|
|
|
+ <div class="classification">
|
|
|
|
+ <div>
|
|
|
|
+ <p :class="idx == 1 ? 'on' : ''" @click="switchs(1)">我负责的</p>
|
|
|
|
+ <p :class="idx == 2 ? 'on' : ''" @click="switchs(2)">我创建的</p>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div style="width: 94%">
|
|
|
|
+ <!--列表-->
|
|
|
|
+ <el-table :data="list" highlight-current-row v-loading="listLoading" :height="tableHeight" style="width: 100%;">
|
|
|
|
+ <el-table-column type="index" width="60">
|
|
|
|
+ <template slot-scope="scope" >
|
|
|
|
+ {{scope.$index+1+(page-1)*size}}
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="name" label="任务名称" sortable width="350"></el-table-column>
|
|
|
|
+ <el-table-column prop="projectName" label="项目名称" sortable width="350"></el-table-column>
|
|
|
|
+ <el-table-column prop="executorName" label="负责人" sortable width="250">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <el-link type="primary" @click="showUser(scope.row.executorId)">{{scope.row.executorName}}</el-link>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="taskDesc" label="任务描述" sortable width="350">
|
|
|
|
+ <!-- <template slot-scope="scope">
|
|
|
|
+ <div class="acl"><span v-html='scope.row.taskDesc'></span></div>
|
|
|
|
+ </template> -->
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <el-popover trigger="hover" placement="top" width="450" v-if="scope.row.taskDesc">
|
|
|
|
+ <p v-html='scope.row.taskDesc'></p>
|
|
|
|
+ <div slot="reference" class="name-wrapper">
|
|
|
|
+ <div class="acl" v-html='scope.row.taskDesc'></div>
|
|
|
|
+ </div>
|
|
|
|
+ </el-popover>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="createDate" label="创建时间" sortable width="250"></el-table-column>
|
|
|
|
+ <el-table-column label="截止时间" width="290" fixed="right">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <div style="display: flex;justify-content: space-between;padding-right: 40px">
|
|
|
|
+ <span style="display: inline-block;margin-right: 55px">{{scope.row.endDate}}</span>
|
|
|
|
+ <el-button v-if="searchField == 0" size="small" type="primary" @click="completes(scope.row.id, 0)">完成</el-button>
|
|
|
|
+ <el-button v-if="searchField == 1" size="small" type="warning" @click="completes(scope.row.id, 1)">重启</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
|
|
- <!--列表-->
|
|
|
|
- <el-table :data="list" highlight-current-row v-loading="listLoading" :height="tableHeight" style="width: 100%;">
|
|
|
|
- <el-table-column type="index" width="60">
|
|
|
|
- <template slot-scope="scope" >
|
|
|
|
- {{scope.$index+1+(page-1)*size}}
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- <el-table-column prop="projectCode" label="项目编码" sortable width="150"></el-table-column>
|
|
|
|
- <el-table-column prop="projectName" label="项目名称" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="inchargerName" label="负责人" sortable width="150">
|
|
|
|
- <template slot-scope="scope">
|
|
|
|
- <el-link type="primary" @click="showUser(scope.row.inchargerId)">{{scope.row.inchargerName}}</el-link>
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- <el-table-column prop="participator" label="参与者" sortable>
|
|
|
|
-
|
|
|
|
- <template slot-scope="scope">
|
|
|
|
- <v-for v-for="par in scope.row.participator" :key="par.id" >
|
|
|
|
- <el-link style="margin-right:10px;" type="primary" @click="showUser(par.id)">{{par.name}}</el-link>
|
|
|
|
- </v-for>
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- <el-table-column label="操作" width="290">
|
|
|
|
- <template slot-scope="scope">
|
|
|
|
- <el-button v-if="user.role>0" size="small" type="primary" @click="subProject(scope.row)">子项目</el-button>
|
|
|
|
- <el-button size="small" type="primary" @click="handleAdd(scope.$index, scope.row)">编辑</el-button>
|
|
|
|
- <el-button v-if="user.role>0" size="small" type="danger" @click="deletePro(scope.$index, scope.row)">删除</el-button>
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
-
|
|
|
|
- <!--工具条-->
|
|
|
|
- <el-col :span="24" class="toolbar">
|
|
|
|
- <el-pagination
|
|
|
|
- @size-change="handleSizeChange"
|
|
|
|
- @current-change="handleCurrentChange"
|
|
|
|
- :page-sizes="[20 , 50 , 80 , 100]"
|
|
|
|
- :page-size="20"
|
|
|
|
- layout="total, sizes, prev, pager, next"
|
|
|
|
- :total="total"
|
|
|
|
- style="float:right;"
|
|
|
|
- ></el-pagination>
|
|
|
|
- </el-col>
|
|
|
|
-
|
|
|
|
|
|
+ <!--工具条-->
|
|
|
|
+ <el-col :span="24" class="toolbar">
|
|
|
|
+ <el-pagination
|
|
|
|
+ @size-change="handleSizeChange"
|
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
|
+ :page-sizes="[20 , 50 , 80 , 100]"
|
|
|
|
+ :page-size="20"
|
|
|
|
+ layout="total, sizes, prev, pager, next"
|
|
|
|
+ :total="total"
|
|
|
|
+ style="float:right;"
|
|
|
|
+ ></el-pagination>
|
|
|
|
+ </el-col>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
<!--新增界面-->
|
|
<!--新增界面-->
|
|
<el-dialog :title="title" v-if="addFormVisible" :visible.sync="addFormVisible" :close-on-click-modal="false" customClass="customWidth" width="600px">
|
|
<el-dialog :title="title" v-if="addFormVisible" :visible.sync="addFormVisible" :close-on-click-modal="false" customClass="customWidth" width="600px">
|
|
<el-form ref="form1" :model="addForm" :rules="rules" label-width="100px">
|
|
<el-form ref="form1" :model="addForm" :rules="rules" label-width="100px">
|
|
- <el-form-item label="项目编号" >
|
|
|
|
|
|
+ <el-form-item label="任务名称" >
|
|
<el-input v-model="addForm.code" :disabled="user.role==0" placeholder="请输入项目编号" clearable></el-input>
|
|
<el-input v-model="addForm.code" :disabled="user.role==0" placeholder="请输入项目编号" clearable></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="项目名称" prop="name">
|
|
<el-form-item label="项目名称" prop="name">
|
|
@@ -157,12 +174,13 @@
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|
|
<script>
|
|
<script>
|
|
|
|
+import { error } from 'dingtalk-jsapi';
|
|
import util from "../../common/js/util";
|
|
import util from "../../common/js/util";
|
|
|
|
|
|
export default {
|
|
export default {
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- searchField:null,
|
|
|
|
|
|
+ searchField: '0',
|
|
keyword:null,
|
|
keyword:null,
|
|
user: JSON.parse(sessionStorage.getItem("user")),
|
|
user: JSON.parse(sessionStorage.getItem("user")),
|
|
userDetailVisible: false,
|
|
userDetailVisible: false,
|
|
@@ -189,7 +207,8 @@
|
|
},
|
|
},
|
|
rules: {
|
|
rules: {
|
|
name: [{ required: true, message: "请输入项目名称", trigger: "blur" }],
|
|
name: [{ required: true, message: "请输入项目名称", trigger: "blur" }],
|
|
- }
|
|
|
|
|
|
+ },
|
|
|
|
+ idx: 1,
|
|
};
|
|
};
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
@@ -339,35 +358,24 @@
|
|
//获取项目列表
|
|
//获取项目列表
|
|
getList() {
|
|
getList() {
|
|
this.listLoading = true;
|
|
this.listLoading = true;
|
|
- this.http.post(this.port.project.listPage, {
|
|
|
|
|
|
+ this.http.post('task/listByPage', {
|
|
|
|
+ status: this.searchField,
|
|
|
|
+ viewId: this.idx,
|
|
pageIndex: this.page,
|
|
pageIndex: this.page,
|
|
pageSize: this.size,
|
|
pageSize: this.size,
|
|
- keyword:this.keyword,
|
|
|
|
- searchField: this.searchField,
|
|
|
|
},
|
|
},
|
|
res => {
|
|
res => {
|
|
this.listLoading = false;
|
|
this.listLoading = false;
|
|
- if (res.code == "ok") {
|
|
|
|
- var list = res.data.records;
|
|
|
|
- for(var i in list) {
|
|
|
|
- var participator = list[i].participator , str = "";
|
|
|
|
- for(var j in participator) {
|
|
|
|
- if(j == participator.length-1) {
|
|
|
|
- str += participator[j].name
|
|
|
|
- } else {
|
|
|
|
- str += participator[j].name + ','
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- list[i].userNames = str;
|
|
|
|
- }
|
|
|
|
- this.list = list;
|
|
|
|
- this.total = res.data.total;
|
|
|
|
|
|
+ if(res.code == 'ok') {
|
|
|
|
+ this.list = res.data.records
|
|
|
|
+ this.total = res.data.total
|
|
} else {
|
|
} else {
|
|
this.$message({
|
|
this.$message({
|
|
- message: res.msg,
|
|
|
|
- type: "error"
|
|
|
|
|
|
+ message: res.msg,
|
|
|
|
+ type: "error"
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
+ console.log(res)
|
|
},
|
|
},
|
|
error => {
|
|
error => {
|
|
this.listLoading = false;
|
|
this.listLoading = false;
|
|
@@ -375,13 +383,13 @@
|
|
message: error,
|
|
message: error,
|
|
type: "error"
|
|
type: "error"
|
|
});
|
|
});
|
|
- });
|
|
|
|
|
|
+ })
|
|
},
|
|
},
|
|
|
|
|
|
//显示新增界面
|
|
//显示新增界面
|
|
handleAdd(i, item) {
|
|
handleAdd(i, item) {
|
|
if(i == -1) {
|
|
if(i == -1) {
|
|
- this.title = "新增项目";
|
|
|
|
|
|
+ this.title = "新增任务";
|
|
this.addForm = {
|
|
this.addForm = {
|
|
name: '',
|
|
name: '',
|
|
userId: [],
|
|
userId: [],
|
|
@@ -528,6 +536,47 @@
|
|
|
|
|
|
detail(i) {
|
|
detail(i) {
|
|
this.$router.push("/list/" + this.list[i].id + "/" + this.list[i].projectName);
|
|
this.$router.push("/list/" + this.list[i].id + "/" + this.list[i].projectName);
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 切换当前选项的索引
|
|
|
|
+ switchs(e) {
|
|
|
|
+ this.idx = e
|
|
|
|
+ console.log(this.searchField)
|
|
|
|
+ this.getList()
|
|
|
|
+ },
|
|
|
|
+ // 下拉框选择
|
|
|
|
+ hiddens() {
|
|
|
|
+ console.log(this.searchField)
|
|
|
|
+ this.getList()
|
|
|
|
+ },
|
|
|
|
+ // 完成
|
|
|
|
+ completes(e, el) {
|
|
|
|
+ this.http.post('/task/finish', {
|
|
|
|
+ id: e,
|
|
|
|
+ taskStatus: el
|
|
|
|
+ },
|
|
|
|
+ res => {
|
|
|
|
+ if (res.code == "ok") {
|
|
|
|
+ this.$message({
|
|
|
|
+ message: "提交成功",
|
|
|
|
+ type: "success"
|
|
|
|
+ });
|
|
|
|
+ this.getList();
|
|
|
|
+ } else {
|
|
|
|
+ this.$message({
|
|
|
|
+ message: res.msg,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ error => {
|
|
|
|
+ this.listLoading = false;
|
|
|
|
+ this.$message({
|
|
|
|
+ message: error,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ )
|
|
}
|
|
}
|
|
},
|
|
},
|
|
created() {
|
|
created() {
|
|
@@ -546,4 +595,38 @@
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
|
|
+.classification {
|
|
|
|
+ width: 120px;
|
|
|
|
+ // height: 100%;
|
|
|
|
+ border-right: 1px solid #f2f2f2;
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
+ // align-items: center;
|
|
|
|
+ // justify-content: center;
|
|
|
|
+ padding-top: 20px;
|
|
|
|
+}
|
|
|
|
+.classification p{
|
|
|
|
+ width: 120px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ line-height: 50px;
|
|
|
|
+ margin: 0;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+}
|
|
|
|
+.classification p:hover {
|
|
|
|
+ background: #dddddd;
|
|
|
|
+}
|
|
|
|
+.on {
|
|
|
|
+ // background: #dddddd;
|
|
|
|
+ color: #409EFF;
|
|
|
|
+}
|
|
|
|
+.acl{
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 300px;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ margin: 0;
|
|
|
|
+ padding: 0;
|
|
|
|
+ line-height: 0;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|