New file |
| | |
| | | <template> |
| | | <div class="list"> |
| | | <TableCustom :queryForm="queryForm" :tableData="tableData" :total="total" @currentChange="handleCurrentChange" |
| | | @sizeChange="handleSizeChange"> |
| | | <template #search> |
| | | <el-form :model="form" label-width="140px" inline> |
| | | <el-form-item label="项目组名称:"> |
| | | <el-input v-model="form.name" placeholder="请输入"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="项目负责人:"> |
| | | <el-input v-model="form.name" placeholder="请输入"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="创建日期:"> |
| | | <el-date-picker v-model="value1" type="daterange" range-separator="至" start-placeholder="开始日期" |
| | | end-placeholder="结束日期"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item class="search-btn-box"> |
| | | <el-button>重置</el-button> |
| | | <el-button type="primary">查询</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </template> |
| | | <template #setting> |
| | | <el-button @click="handleAddProject" class="el-icon-plus" type="primary"> |
| | | 新增项目组</el-button> |
| | | </template> |
| | | <template #table> |
| | | <el-table-column prop="name" label="项目组名称" /> |
| | | <el-table-column prop="age" label="项目负责人" /> |
| | | <el-table-column prop="age" label="项目组成员" /> |
| | | <el-table-column prop="age" label="项目创建时间" /> |
| | | <el-table-column prop="age" label="状态"> |
| | | <template #default="{ row }"> |
| | | <el-tag v-if="row.status == 1" type="success">正常运作</el-tag> |
| | | <el-tag v-else type="danger">已封存</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="age" label="操作"> |
| | | <template #default="{ row }"> |
| | | <el-button type="text" @click="handleChangeStatus(row, 1)">封存</el-button> |
| | | <el-button type="text" @click="handleChangeStatus(row, 0)">解封</el-button> |
| | | <el-button type="text">编辑</el-button> |
| | | <el-button type="text">详情</el-button> |
| | | <el-button type="text" @click="handleDel(row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </template> |
| | | </TableCustom> |
| | | <ShowDelConfirm :show="showDelConfirm" @close="showDelConfirm = false" @confirm="handleDelConfirm" /> |
| | | <ShowDelConfirm :title="changeStatusTitle" :tip="changeStatusTip" :show="changeStatus" |
| | | @close="changeStatus = false" @confirm="handleChangeStatusConfirm" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'ProjectList', |
| | | data() { |
| | | return { |
| | | form: { |
| | | name: '' |
| | | }, |
| | | showDelConfirm: false, |
| | | rowId: '', |
| | | changeStatus: false, |
| | | changeStatusTitle: '', |
| | | changeStatusTip: '', |
| | | tableData: [], |
| | | queryForm: { |
| | | pageSize: 10, |
| | | pageNum: 1 |
| | | }, |
| | | total: 0 |
| | | } |
| | | }, |
| | | methods: { |
| | | handleAddProject() { |
| | | this.$router.push({ |
| | | path: '/projectList/addProject' |
| | | }) |
| | | }, |
| | | handleDel(row) { |
| | | this.rowId = row.id |
| | | this.showDelConfirm = true |
| | | }, |
| | | handleDelConfirm() { |
| | | this.showDelConfirm = false |
| | | this.msgsuccess('删除成功') |
| | | this.rowId = '' |
| | | this.getList() |
| | | }, |
| | | handleChangeStatus(row, status) { |
| | | this.rowId = row.id |
| | | this.changeStatusTitle = status == 1 ? '确认要封存这个项目组吗?' : '确认要解封该项目组吗?' |
| | | this.changeStatusTip = status == 1 ? '封存后项目组内人员看不到数据,审批人仍然可见数据。' : '解封后项目组内人员数据恢复。' |
| | | this.changeStatus = true |
| | | }, |
| | | handleChangeStatusConfirm() { |
| | | this.changeStatus = false |
| | | this.msgsuccess('操作成功') |
| | | this.rowId = '' |
| | | this.changeStatusTitle = '' |
| | | this.changeStatusTip = '' |
| | | this.getList() |
| | | }, |
| | | handleCurrentChange(page) { |
| | | this.queryForm.pageNum = page |
| | | this.getList() |
| | | }, |
| | | handleSizeChange(size) { |
| | | this.queryForm.pageSize = size |
| | | this.getList() |
| | | }, |
| | | getList() { |
| | | |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped lang="less"> |
| | | .list { |
| | | height: 100%; |
| | | } |
| | | </style> |