Skip to content

Q
qr-consistency-vue3
Commit 53c55e16 authored by 祁正's avatar 祁正
Browse files
Options

ccap项目管理-抽屉列表

parent aaa7f8c7
Hide whitespace changes
Inline Side-by-side
Showing with 195 additions and 65 deletions
src/api/CCAPProjectManagement/list.js
View file @ 53c55e16
......@@ -17,3 +17,27 @@ export function getAllBusinessUnitList() {
method: 'get'
})
}
// 根据id获取所有项目列表
export function getProjectListById(data) {
return request({
url: '/control/ccapProjectManagement/getProjectListById',
method: 'get',
params:data
})
}
// 根据id新增一条抽屉里面的数据
export function inserTableData(data) {
return request({
url: '/control/ccapProjectManagement/inserTableData',
method: 'post',
data:data
})
}
// 批量删除
export function inserTableData(ids) {
return request({
url: '/control/ccapProjectManagement/batch/'+ids,
method: 'delete'
})
}
src/views/controlPlan/baseConfig/CCAPProjectManagement/index.vue
View file @ 53c55e16
<template>
<div class="app-container">
<el-form v-model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="70px">
<el-form-item label="事业部:" prop="status">
<el-select
v-model="queryParams.businessUnitId"
......@@ -22,7 +21,6 @@
</el-form-item>
</el-form>
<el-table :data="tableList">
<el-table-column type="index" width="55" align="center" label="序号"/>
<el-table-column label="事业部" align="center" prop="applicableBrand" />
......@@ -35,13 +33,12 @@
<el-table-column label="创建时间" align="center" prop="createTime" />
<el-table-column label="更新人" align="center" prop="updateUserName" />
<el-table-column label="更新时间" align="center" prop="updateTime" width="180" >
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<div style="display: flex;align-items: flex-start">
<el-button type="text" style="color: rgb(0,0,255)" @click="handleView(scope.row)">维护项目</el-button>
<el-button type="text" style="color: rgb(0,0,255)" @click="handleMaintain(scope.row)">维护项目</el-button>
<el-button type="text" style="color: rgb(255,153,0)" v-if="scope.row.id === adminId" @click="handleView(scope.row)">复制新增</el-button>
<el-button type="text" v-if="scope.row.id === adminId" @click="handleView(scope.row)">添加事业部</el-button>
<el-button type="text" style="color: rgb(244,93,93)" v-else="scope.row.id === adminId" @click="handleView(scope.row)">删除</el-button>
......@@ -59,7 +56,7 @@
/>
<!-- 抽屉-->
<el-drawer v-model="drawer2" size='40%'>
<el-drawer @close="closeDrawer" v-model="drawer2" size='40%'>
<template #header>
<div style="font-weight: bold;font-size: 14px">
维护项目（奇瑞、星途、智界)
......@@ -67,15 +64,14 @@
</template>
<template #default>
<div style="display: flex;justify-content: space-between">
<el-form class="drawer-form" v-model="drawerQueryParams" ref="queryRef" :inline="true" v-show="showSearch" >
<el-form-item label="项目:" prop="status">
<el-form class="drawer-form" v-model="drawerQueryParams" ref="drawerQueryRef" :inline="true" v-show="showSearch" >
<el-form-item label="项目:" prop="project">
<el-input v-model="drawerQueryParams.project" style="width: 110px" placeholder="请输入"/>
</el-form-item>
<el-form-item label="分组:" prop="status">
<el-form-item label="分组:" prop="groupName">
<el-select
v-model="queryParams.businessUnitId"
v-model="drawerQueryParams.groupName"
placeholder="请选择"
clearable
style="width: 125px"
......@@ -88,13 +84,13 @@
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery">查询</el-button>
<el-button @click="resetQuery">重置</el-button>
<el-button type="primary" @click="drawerHandleQuery">查询</el-button>
<el-button @click="drawerResetQuery">重置</el-button>
</el-form-item>
</el-form>
<div class="top-btn">
<el-button type="primary" plain @click="handleQuery">新增</el-button>
<el-button type="primary" plain @click="handleAdd">新增</el-button>
<el-button type="danger" plain @click="resetQuery">批量删除</el-button>
</div>
</div>
......@@ -102,13 +98,12 @@
<el-table border style="margin-top: 10px" :data="drawer2TableList">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column type="index" width="55" align="center" label="序号"/>
<el-table-column label="项目" align="center" prop="applicableBrand" />
<el-table-column label="分组" align="center" prop="createUserName" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<div style="display: flex;align-items: flex-start">
<el-table-column label="项目" align="center" prop="project" width="300"/>
<el-table-column label="分组" align="center" prop="groupName" />
<el-table-column label="操作" align="center">
<template #default="scope" align="center">
<div >
<el-button type="text" style="color: rgb(0,0,255)" @click="handleView(scope.row)">编辑</el-button>
<el-button type="text" style="color: rgb(244,93,93)" @click="handleView(scope.row)">删除</el-button>
</div>
</template>
......@@ -122,77 +117,174 @@
</div>
</template>
</el-drawer>
</div>
<!-- 对话框-->
<el-dialog
top="30"
v-model="dialogVisible"
:title="addTitle"
width="500"
>
<div style="width: 85%;margin-left: 7.5%">
<el-form v-model="dialogForm" ref="dialogQueryRef" >
<el-form-item label="项目:" prop="project" >
<el-input v-model="dialogForm.project" placeholder="请输入"/>
</el-form-item>
<el-form-item label="分组:" prop="groupName" >
<el-select
v-model="dialogForm.groupName"
placeholder="请选择"
clearable
>
<el-option
v-for="dict in groupList"
:label="dict"
:value="dict"
/>
</el-select>
</el-form-item>
</el-form>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="dialogCencal">取消</el-button>
<el-button type="primary" @click="dialogSave">
保存
</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import { getDataList,getAllBusinessUnitList } from "@/api/CCAPProjectManagement/list";
import { ElMessage } from 'element-plus'
import { ref, getCurrentInstance } from 'vue';
import {
getDataList,
getAllBusinessUnitList,
getProjectListById,
inserTableData
} from "@/api/CCAPProjectManagement/list";
const { proxy } = getCurrentInstance();
const tableList = ref([]);
const drawer2 = ref(false)
const dialogVisible = ref(false)
//第一条数据id
const adminId = '12321'
import { useRouter } from 'vue-router';
const businessList = ref([])
const drawer2TableList = ref([])
const router = useRouter();
const open = ref(false);
const loading = ref(true);
const drawer2TableList = ref([]);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const dialogQueryRef = ref(null);
const drawerQueryRef = ref(null);
const addTitle = ref('新增');
const total = ref(0);
const title = ref("");
const dialogRules = {
project: [{ required: true, message: '项目名称不能为空', trigger: 'blur' }],
groupName: [{ required: true, message: '分组不能为空', trigger: 'change' }]
};
const dialogForm = ref({
projectStatusId: null,
project: null,
groupName: null
});
const queryParams = ref({
pageNum: 1,
pageSize: 10,
businessUnitId:null
})
businessUnitId: null
});
const drawerQueryParams = ref({
})
id: null,
project: null,
groupName: null
});
const groupList = ref([
'制造','质管'
])
const data = reactive({
form: {},
'制造', '质管'
]);
function getList() {
getDataList(queryParams.value).then(res => {
tableList.value = res.rows.sort((a, b) => {
if (a.id === adminId) return 1
else if (b.id === adminId) return 1
});
total.value = res.total;
});
}
rules: {}
});
//获取抽屉里面的表格数据
function getDataProjectListById() {
getProjectListById(drawerQueryParams.value).then(res => {
console.log(res);
drawer2TableList.value = res.data;
});
}
const { form, rules } = toRefs(data);
function getBusinessList() {
getAllBusinessUnitList().then(res => {
console.log(res);
businessList.value = res.data;
});
}
function getList(){
getDataList(queryParams.value).then(res=>{
tableList.value =res.rows.sort((a,b)=>{
if(a.id === adminId) return 1
else if(b.id === adminId) return 1
})
total.value = res.total
})
//抽屉里面点击了新增按钮
function handleAdd() {
dialogVisible.value = true;
addTitle.value = '新增';
dialogForm.value.projectStatusId = drawerQueryParams.value.id;
}
function getBusinessList(){
getAllBusinessUnitList().then(res=>{
//对话框里面的保存
function dialogSave() {
console.log(dialogForm.value);
inserTableData(dialogForm.value).then(res=>{
console.log(res)
businessList.value =res.data
if(res.code === 200) {
ElMessage.success("新增成功")
dialogCencal()
getDataProjectListById()
}
})
// dialogQueryRef.value.validate((valid) => {
// if (valid) {
// console.log(dialogForm.value);
// } else {
// return false;
// }
// });
}
//对话框里面的取消
function dialogCencal() {
dialogForm.value.project = null;
dialogForm.value.groupName = null;
dialogForm.value.projectStatusId = null;
dialogVisible.value = false;
}
// 取消按钮
function cancelClick() {
drawer2.value = false;
reset();
drawerQueryParams.value.id = null;
drawer2TableList.value = [];
}
function drawerHandleQuery() {
getDataProjectListById();
}
//关闭抽屉的方法
function closeDrawer(){
getList()
}
// 表单重置
function reset() {
......@@ -222,6 +314,12 @@ function handleQuery() {
getList();
}
function drawerResetQuery() {
drawerQueryParams.value.groupName = null;
drawerQueryParams.value.project = null;
getDataProjectListById();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
......@@ -233,39 +331,47 @@ function resetQuery() {
listName: null,
listVersion: null,
listStatus: null,
}
};
handleQuery();
}
function handleView(row) {
console.log(row)
drawer2.value = true
function handleMaintain(row) {
drawerQueryParams.value.id = row.id;
drawer2.value = true;
getDataProjectListById();
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('marketRegulations/list/export', {
...queryParams.value
}, `list_${new Date().getTime()}.xlsx`)
}, `list_${new Date().getTime()}.xlsx`);
}
getList()
getBusinessList()
getList();
getBusinessList();
</script>
<style scoped lang="scss">
<style scoped lang="scss">
:deep(.drawer-form.el-form--inline .el-form-item) {
margin-right: 15px;
}
:deep(.drawer-form .el-button + .el-button) {
margin-left: 5px;
}
:deep(.top-btn .el-button + .el-button) {
margin-left: 5px;
}
:deep(.el-drawer__header) {
margin-bottom: 0;
padding-bottom: 20px;
background-color: rgb(245,245,245);
background-color: rgb(245, 245, 245);
}
:deep(.el-dialog) {
margin-top: 17% !important;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment