项目工程管理
This commit is contained in:
parent
e7828f0f80
commit
81f3469476
|
|
@ -124,6 +124,7 @@ export default {
|
|||
methods: {
|
||||
// 查询
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
// 重置
|
||||
|
|
|
|||
|
|
@ -224,6 +224,7 @@ export default {
|
|||
methods: {
|
||||
// 查询
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
// 重置
|
||||
|
|
|
|||
|
|
@ -1,6 +1,33 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%">
|
||||
<el-form v-if="showSearch" :model="queryParams" ref="queryForm" size="small" inline @submit.native.prevent>
|
||||
<el-form-item label="" prop="companyName">
|
||||
<el-select class="w240" v-model="queryParams.companyName" placeholder="请选择分公司" clearable filterable>
|
||||
<el-option v-for="item in companyNameOpts" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="" prop="lotName">
|
||||
<el-input
|
||||
class="w240"
|
||||
v-model="queryParams.lotName"
|
||||
placeholder="请输入标段名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="" prop="proStatus">
|
||||
<el-select class="w240" v-model="queryParams.proStatus" placeholder="请选择工程状态" clearable>
|
||||
<el-option v-for="item in proStatusOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 表单按钮 -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table :data="tableList" fit highlight-current-row style="width: 100%" v-loading="loading">
|
||||
<!-- 多选 -->
|
||||
<el-table-column
|
||||
|
|
@ -20,7 +47,7 @@
|
|||
>
|
||||
</el-table-column>
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" align="center" width="150">
|
||||
<el-table-column label="操作" align="center" width="80">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" size="mini" @click="handleDetails(row)">详情</el-button>
|
||||
</template>
|
||||
|
|
@ -45,11 +72,15 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import LotListDetails from './LotListDetails.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
LotListDetails,
|
||||
LotListDetails: () => import('./LotListDetails.vue'),
|
||||
},
|
||||
props: {
|
||||
showSearch: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -59,8 +90,21 @@ export default {
|
|||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
companyName: '', // 分公司
|
||||
lotName: '', // 标段名称
|
||||
proStatus: '', // 工程状态
|
||||
},
|
||||
total: 0, // 总条数
|
||||
companyNameOpts: [
|
||||
{ label: '分公司1', value: '1' },
|
||||
{ label: '分公司2', value: '2' },
|
||||
{ label: '分公司3', value: '3' },
|
||||
], // 分公司
|
||||
proStatusOptions: [
|
||||
{ label: '停工', value: '0' },
|
||||
{ label: '在建', value: '1' },
|
||||
{ label: '已完工', value: '2' },
|
||||
], // 工程状态
|
||||
// 表头
|
||||
tableColumns: [
|
||||
{ label: '标段名称', prop: 'lotName' },
|
||||
|
|
@ -104,6 +148,18 @@ export default {
|
|||
this.dialogVisible = true
|
||||
this.getDialogList()
|
||||
},
|
||||
// 查询
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getDialogList()
|
||||
},
|
||||
// 重置
|
||||
handleReset() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.queryParams.pageSize = 10
|
||||
this.$refs.queryForm.resetFields()
|
||||
this.getDialogList()
|
||||
},
|
||||
// 获取列表数据
|
||||
async getDialogList() {
|
||||
console.log('列表-查询', this.queryParams)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,232 @@
|
|||
<template>
|
||||
<!-- 基础页面 -->
|
||||
<div class="app-container">
|
||||
<el-form v-show="showSearch" :model="queryParams" ref="queryForm" size="small" inline @submit.native.prevent>
|
||||
<el-form-item prop="keyWord">
|
||||
<el-input
|
||||
class="w240"
|
||||
v-model="queryParams.keyWord"
|
||||
placeholder="请输入关键字"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 表单按钮 -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增项目部</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table :data="tableList" fit highlight-current-row style="width: 100%" border>
|
||||
<el-table-column
|
||||
type="index"
|
||||
width="55"
|
||||
label="序号"
|
||||
align="center"
|
||||
:index="(index) => (queryParams.pageNum - 1) * queryParams.pageSize + index + 1"
|
||||
/>
|
||||
<el-table-column
|
||||
v-for="(column, index) in tableColumns"
|
||||
show-overflow-tooltip
|
||||
:key="index"
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
align="center"
|
||||
>
|
||||
<!-- 插槽 -->
|
||||
<template v-slot="{ row }" v-if="column.prop == 'status'">
|
||||
<span>
|
||||
<el-switch
|
||||
v-model="row.status"
|
||||
active-value="1"
|
||||
inactive-value="0"
|
||||
@change="changeSwitch(row)"
|
||||
></el-switch>
|
||||
</span>
|
||||
</template>
|
||||
<template v-slot="{ row }" v-else-if="column.prop == 'lotCount'">
|
||||
<span v-if="row.lotCount > 0" @click="handleLot(row)" style="color: #409eff; cursor: pointer">{{
|
||||
row.lotCount
|
||||
}}</span>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" align="center" width="150">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" size="mini" icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
|
||||
<el-button type="text" size="mini" icon="el-icon-delete" style="color: #f56c6c" @click="handleDelete(row)">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<LotList ref="lotList" :showSearch="true" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {
|
||||
LotList: () => import('./components/LotList'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showSearch: true,
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
keyWord: '', // 关键字
|
||||
},
|
||||
total: 0, // 总条数
|
||||
// 表头
|
||||
tableColumns: [
|
||||
{ label: '分公司名称', prop: 'proName' },
|
||||
{ label: '项目部名称', prop: 'projectDepartment' },
|
||||
{ label: '状态', prop: 'status' },
|
||||
{ label: '标段工程数量', prop: 'lotCount' },
|
||||
{ label: '更新人员', prop: 'updateUser' },
|
||||
{ label: '更新时间', prop: 'updateTime' },
|
||||
{ label: '备注', prop: 'remark' },
|
||||
],
|
||||
// 表格数据
|
||||
tableList: [
|
||||
{
|
||||
id: 1,
|
||||
proName: '分公司名称',
|
||||
projectDepartment: '项目部名称',
|
||||
status: '1',
|
||||
lotCount: 10,
|
||||
updateUser: '更新人员',
|
||||
updateTime: '2023-10-01 12:00:00',
|
||||
remark: '备注',
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
// 查询
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
// 重置
|
||||
handleReset() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.queryParams.pageSize = 10
|
||||
this.$refs.queryForm.resetFields()
|
||||
this.getList()
|
||||
},
|
||||
// 获取列表
|
||||
async getList() {
|
||||
console.log('列表-查询', this.queryParams)
|
||||
const loading = this.$loading({ text: '加载中...' })
|
||||
try {
|
||||
const params = { ...this.queryParams }
|
||||
// const res = await
|
||||
// console.log('🚀 ~ 获取列表 ~ res:', res)
|
||||
// this.tableList = res.rows
|
||||
// this.total = res.total
|
||||
loading.close()
|
||||
} catch (error) {
|
||||
console.log('🚀 ~ 获取列表 ~ error:', error)
|
||||
this.tableList = []
|
||||
this.total = 0
|
||||
loading.close()
|
||||
}
|
||||
},
|
||||
changeSwitch(row) {
|
||||
console.log('🚀 ~ changeSwitch ~ row:', row)
|
||||
this.$confirm('是否确认修改状态?', '提示', {
|
||||
type: 'warning',
|
||||
showCancelButton: true,
|
||||
cancelButtonText: '取消',
|
||||
confirmButtonText: '确定',
|
||||
})
|
||||
.then(() => {
|
||||
// const res = await
|
||||
// console.log('🚀 ~ 修改状态 ~ res:', res)
|
||||
row.status = row.status == '1' ? '1' : '0'
|
||||
})
|
||||
.catch(() => {
|
||||
console.log('取消修改', row.status)
|
||||
row.status = row.status == '1' ? '0' : '1'
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消',
|
||||
})
|
||||
})
|
||||
},
|
||||
handleLot(data) {
|
||||
this.$refs.lotList.openDialog(data)
|
||||
},
|
||||
handleAdd() {
|
||||
console.log('🚀 ~ handleAdd ~:')
|
||||
},
|
||||
handleEdit(row) {
|
||||
console.log('🚀 ~ handleEdit ~ row:', row)
|
||||
},
|
||||
handleDelete(row) {
|
||||
console.log('🚀 ~ handleDelete ~ row:', row)
|
||||
this.$confirm('是否确定删除?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
// const res = await
|
||||
// console.log('🚀 ~ 删除 ~ res:', res)
|
||||
this.getList()
|
||||
})
|
||||
.catch(() => {
|
||||
console.log('取消删除')
|
||||
})
|
||||
},
|
||||
// 导出数据
|
||||
handleExport() {
|
||||
this.$message({
|
||||
type: 'warning',
|
||||
message: '导出功能开发中,敬请期待!',
|
||||
})
|
||||
return
|
||||
try {
|
||||
let fileName = `项目部管理_${new Date().getTime()}.xLsx`
|
||||
let url = ''
|
||||
const params = { ...this.queryParams }
|
||||
console.log('🚀 ~ 导出 ~ params:', params)
|
||||
this.download(url, params, fileName)
|
||||
} catch (error) {
|
||||
console.log('导出数据失败', error)
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
Loading…
Reference in New Issue