ccap项目管理列表搭建

src/views/baseData/marketRegulations/info.vue

@@ -41,14 +41,9 @@
       </el-row>
 
       <el-row>
-        <el-col :span="2">
-          <span >密级</span>
-        </el-col>
-        <el-col :span="2">
-          <span >{{dataOBj.securityLevel}}</span>
-        </el-col>
 
-        <el-col :offset="5" :span="2">
+
+        <el-col :span="2">
           <span >作者</span>
         </el-col>
         <el-col :span="2">
@@ -64,12 +59,7 @@
           <span >{{dataOBj.releaseDate}}</span>
         </el-col>
 
-        <el-col :offset="5" :span="2">
-          <span >附件</span>
-        </el-col>
-        <el-col :span="2">
-          <span >{{dataOBj.attachment || '---'}}</span>
-        </el-col>
+
       </el-row>
 
       <el-row>

src/views/controlPlan/baseConfig/CCAPProjectManagement/index.vue

@@ -58,8 +58,74 @@
       @pagination="getList"
     />
 
+    <!--  抽屉-->
+    <el-drawer v-model="drawer2" size='40%'>
+      <template #header>
+        <div style="font-weight: bold;font-size: 14px">
+          维护项目（奇瑞、星途、智界)
+        </div>
+      </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-input v-model="drawerQueryParams.project" style="width: 110px" placeholder="请输入"/>
+            </el-form-item>
 
+            <el-form-item label="分组:" prop="status">
+              <el-select
+                v-model="queryParams.businessUnitId"
+                placeholder="请选择"
+                clearable
+                style="width: 125px"
+              >
+                <el-option
+                  v-for="dict in groupList"
+                  :label="dict"
+                  :value="dict"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary"  @click="handleQuery">查询</el-button>
+              <el-button  @click="resetQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+
+          <div class="top-btn">
+            <el-button type="primary" plain @click="handleQuery">新增</el-button>
+            <el-button type="danger" plain  @click="resetQuery">批量删除</el-button>
           </div>
+        </div>
+
+        <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-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>
+          </el-table-column>
+        </el-table>
+      </template>
+      <template #footer>
+        <div style="flex: auto">
+          <el-button @click="cancelClick">取消</el-button>
+          <el-button type="primary" @click="confirmClick">保存</el-button>
+        </div>
+      </template>
+    </el-drawer>
+  </div>
+
+
+
 </template>
 
 <script setup>
@@ -67,10 +133,12 @@ import { getDataList,getAllBusinessUnitList } from "@/api/CCAPProjectManagement/
 
 const { proxy } = getCurrentInstance();
 const tableList = ref([]);
+const drawer2 = 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);
@@ -85,7 +153,13 @@ const queryParams = ref({
   pageSize: 10,
   businessUnitId:null
 })
+const drawerQueryParams = ref({
+
+})
 
+const groupList = ref([
+  '制造','质管'
+])
 
 const data = reactive({
   form: {},
@@ -113,8 +187,8 @@ function getBusinessList(){
 }
 
 // 取消按钮
-function cancel() {
-  open.value = false;
+function cancelClick() {
+  drawer2.value = false;
   reset();
 }
 
@@ -165,7 +239,7 @@ function resetQuery() {
 
 function handleView(row) {
   console.log(row)
-
+  drawer2.value = true
 }
 
 
@@ -178,8 +252,16 @@ function handleExport() {
 getList()
 getBusinessList()
 </script>
-<style scoped lang="scss">
-:deep(.el-form--inline .el-form-item) {
-  margin-right: 20px;
+  <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;
 }
+
+
 </style>