808项目页

src/components/layout/header.vue

@@ -52,6 +52,7 @@ import { UserFilled, ArrowDown, User, Key, SwitchButton } from '@element-plus/ic
 
 import useCurrentTime from "@/utils/useCurrentTime";
 import { useUserStore } from '@/store/user'
+import { useProjectStore } from '@/store/project'
 import { removeToken, removeUserId } from "@/utils/token";
 import { useRouter } from 'vue-router'
 
@@ -65,6 +66,7 @@ import frame from "@/assets/img/frame.png"
 const userinfoRef = ref(null)
 
 const userStore = useUserStore()
+const projectStore = useProjectStore()
 const router = useRouter()
 
 const nickName = computed(() => userStore.userInfo?.nickName || '用户登录')
@@ -72,6 +74,7 @@ const nickName = computed(() => userStore.userInfo?.nickName || '用户登录')
 const { currentTime } = useCurrentTime()
 
 const handleProjectManagement = () => {
+  projectStore.clearproject();
   router.push('/project')
 }
 

src/store/project.js

@@ -3,7 +3,6 @@ import { ref } from 'vue'
 
 export const useProjectStore = defineStore('project', () => {
   const pid = ref('');
-  const runtype = ref("");
 
   const projectInfo = ref(null);
   // 项目信息
@@ -15,21 +14,14 @@ export const useProjectStore = defineStore('project', () => {
     pid.value = val
   }
 
-  const setruntype = (val) => {
-    runtype.value = val
-  }
-
   const clearproject = () => {
     pid.value = ''
     projectInfo.value = null; // 清除项目信息
-    runtype.value = ""; // 清除运行类型
   }
   
   return {
     pid,
     setpid,
-    runtype,
-    setruntype,
     clearproject,
     projectInfo,
     setProjectInfo,

src/style/index.css

@@ -411,4 +411,42 @@ img{
   color: #FFFFFF;
   /* border: 1px solid rgba(61, 219, 252, 1); */
   border: none;
-}
+}
+
+.custom-table .el-table,.custom-table .el-table tr ,.custom-table .el-table th.el-table__cell{
+  background-color: transparent !important;
+  
+}
+
+.custom-table .el-table,.custom-table .el-table th,.custom-table .el-table td{
+  border: 1px solid #0048FF !important;
+}
+
+.custom-table .el-table thead {
+ color: #2CFFFF !important;
+}
+
+.custom-table .el-table {
+  --el-table-border-color: #0048FF;
+  color: #FFFFFF;
+}
+
+/* 修改行 hover 背景色 */
+.custom-table .el-table--enable-row-hover .el-table__body tr:hover>td {
+  background-color: rgba(61, 219, 252, 0.15) !important; /* 透明度降低 */
+  box-shadow: inset 0 0 0 1px rgba(61, 219, 252, 0.3); /* 添加内边框增强效果 */
+}
+
+/* 当前行 */
+.custom-table .el-table__body tr.current-row>td.el-table__cell {
+ background-color: rgba(61, 219, 252, 0.20) !important;
+}
+
+
+.custom-pagination .el-pagination .btn-prev , .custom-pagination .el-pagination .btn-next{
+  background-color: transparent !important;
+}
+
+.custom-pagination .el-pagination .el-pager li.is-active {
+  background-color: rgba(61, 219, 252, 0.20) !important;
+}

src/views/login/index.vue

@@ -168,7 +168,7 @@ const handleLogin = () => {
         mobileNo: res.mobileNo,
       })
 
-      router.push({ path: "/" })
+      router.push({ path: "/project" })
     })
     .catch((err) => {
       console.error('错误信息：',err);

src/views/mainContent/index.vue

@@ -4,7 +4,7 @@
       <el-container style="height: 100%;">
         <el-aside class="leftaside">
           <div class="left-1">
-            <ex-design />
+            <ex-design :exDatajson="oneData"/>
           </div>
           <div class="left-2">
             <agent-model />
@@ -34,6 +34,10 @@
 </template>
 
 <script setup>
+import { request, enPassword } from "@/utils/request";
+
+import { ElMessage, ElMessageBox } from 'element-plus'
+
 import infoLog from './footer/infoLog.vue';
 import exDesign from './leftaside/exDesign.vue';
 import agentModel from './leftaside/agentModel.vue';
@@ -42,6 +46,65 @@ import opRun from './leftaside/opRun.vue';
 import analyzeWork from './rightaside/analyzeWork.vue';
 import opProblem from './rightaside/opProblem.vue';
 
+import { useProjectStore } from '@/store/project'
+
+const projectStore = useProjectStore()
+
+const pid = computed(() => projectStore.pid)
+const type = ref(0)
+
+const projectInitJson = ref()
+
+const oneData = ref()
+const twoData = ref()
+const thirdData = ref()
+const fourData = ref()
+
+const getProjectInit = () => {
+  const params = {
+    transCode: 'AC00009',
+    pid: pid.value,
+    type: type.value,
+  };
+  request(params)
+    .then((res) => {
+      projectInitJson.value = JSON.parse(res.pattJson); // 转换为 JSON 对象
+      console.log(projectInitJson.value); // 输出解析后的对象
+
+      oneData.value = projectInitJson.value[0];
+      twoData.value = projectInitJson.value[1];
+      thirdData.value = projectInitJson.value[2];
+      fourData.value = projectInitJson.value[3];
+
+      // console.log(oneData.value);
+    })
+    .catch((err) => {
+      ElMessage.error(err.returnMsg || "初始化失败");
+      console.log(err);
+    });
+}
+
+const getProjectInit1 = () => {
+  const params = {
+    transCode: 'AC00004',
+    pid: pid.value,
+    type: type.value,
+  };
+  request(params)
+    .then((res) => {
+      console.log(res.rows);
+    })
+    .catch((err) => {
+      ElMessage.error(err.returnMsg || "初始化失败");
+      console.log(err);
+    });
+}
+
+onMounted(() => {
+  getProjectInit();
+});
+
+
 </script>
 
 <style scoped>

src/views/mainContent/leftaside/exDesign.vue

@@ -3,7 +3,7 @@
   <div style="height: 100%;">
     <el-card class="custom-card">
       <template #header>
-        <span>试验设计</span>
+        <span>{{ exDataObj.header?.name }}</span>
       </template>
       <div class="content-container">
         <div class="content-aside">
@@ -12,7 +12,7 @@
           </el-row>
           <el-row justify="center" align="middle" >
             <el-col :span="14" :push="4">
-              <span style="font-size: 10px;">代理优化</span>
+              <span style="font-size: 10px;">{{ exDataObj.swich?.name }}</span>
             </el-col>
             <el-col :span="10">
               <el-switch v-model="ExdeData.isAgentModel" class="custom-switch custom-switch-colors" />
@@ -43,6 +43,12 @@
 <script setup>
 
 
+const props = defineProps({
+  exDatajson: {
+    type: Object,
+  }
+})
+
 const Labelwidth = '70px';
 
 const ExdeData = ref({
@@ -52,6 +58,36 @@ const ExdeData = ref({
   randomSeed: 42,
 });
 
+const exDataObj  = ref({})
+
+const analysisJson = () => {
+  console.log("dayin",props.exDatajson)
+  exDataObj.value['header'] = props.exDatajson?.vo;
+  exDataObj.value['body'] = props.exDatajson?.svo;
+
+  // 遍历svo数组，查找vo.code为"switch"的项
+  if (props.exDatajson?.svo) {
+    const switchItem = props.exDatajson.svo.find(item => 
+      item?.vo?.code === "switch"
+    );
+    // 只赋值vo对象，不包含svo
+    exDataObj.value['swich'] = switchItem?.vo || null;  // 如果找不到设为null
+  } else {
+    exDataObj.value['swich'] = null;
+  }
+
+  console.log("sss",exDataObj.value)
+}
+
+// 监听 exDatajson 变化
+watch(
+  () => props.exDatajson,
+  (newVal) => {
+    analysisJson()
+  },
+  { deep: true } // 深度监听
+);
+
 
 </script>
 

src/views/project/index.vue

@@ -1,20 +1,97 @@
 <template>
-  <div class="home-page">
+  <div class="project-page">
     <img class="background-image" :src="bgback" alt="背景图">
     <el-header>
-        <myheader />
+      <myheader />
     </el-header>
-    <el-main>
-      
+    <el-main class="project-container">
+      <div class="project-content" id="projectContent">
+        
+        <div class="newproject" v-show="isnew">
+          <div class="newproject-header">
+            {{ titlename }}
+            <el-icon class="close-icon" @click="isnew = false">
+              <Close />
+            </el-icon>
+          </div>
+          <div class="newproject-body">
+            <el-form>
+              <el-row :gutter="20">
+                <el-col :span="10">
+                  <el-form-item label="项目名称:">
+                    <el-input v-model="newproject.name" maxlength="100"></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="11">
+                  <el-form-item label="备注:">
+                    <el-input v-model="newproject.remark" maxlength="500"></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="3">
+                  <el-form-item>
+                    <el-button @click="opProject">确定</el-button>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-form>
+          </div>
+        </div>
+        
+        <div class="project-table">
+          <div class="project-table-header">
+            项目集
+          </div>
+
+          <div class="table-container custom-table">
+            <el-table border 
+            :data="projectlists" 
+            style="width: 100%;height: 100%; overflow: auto;"
+            highlight-current-row
+            @current-change="handleRowChange"
+            >
+              <el-table-column prop="name" label="项目名称"></el-table-column>
+              <el-table-column prop="remark" label="备注"></el-table-column>
+              <el-table-column prop="updateTime" label="修改时间" min-width="100"></el-table-column>
+              <el-table-column prop="createTime" label="创建时间" min-width="100"></el-table-column>
+
+            </el-table>
+          </div>
+
+          <div class="project-footer">
+            <div class="project-main-pagination">
+              <div class="custom-pagination">
+                <el-pagination v-model:current-page="gd.currentPage" v-model:page-size="gd.pageSize"
+                  :page-sizes="[5, 10, 20, 50]" background size="default" layout="prev, slot, sizes, pager, next"
+                  :total="parseInt(gd.total)" class="mt-4" @size-change="handleSizeChange"
+                  @current-change="handleCurrentChange">
+                  <template #default>
+                    <span style="color: #FFFFFF;">总计 {{ gd.total }}</span>
+                  </template>
+                </el-pagination>
+              </div>
+            </div>
+
+            <div class="custom-btn">
+              <el-button @click="addone">新增</el-button>
+              <el-button @click="editSelected">编辑</el-button>
+              <el-button @click="deleteSelected">删除</el-button>
+              <el-button @click="confirmSelected">打开</el-button>
+            </div>
+          </div>
+          
+        </div>
+      </div>
     </el-main>
   </div>
 </template>
 <script setup>
 import myheader from '@/components/layout/header.vue'
 
-import { RouterView, RouterLink,useRouter, useRoute } from "vue-router"
+import { RouterView, RouterLink, useRouter, useRoute } from "vue-router"
 import { request, enPassword } from "@/utils/request";
-import { ElMessage } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { Close } from '@element-plus/icons-vue';
+import { useProjectStore } from '@/store/project'
 
 import bgback from "@/assets/img/project-bg.png"
 
@@ -22,32 +99,307 @@ const router = useRouter();
 // 获取路由实例
 const route = useRoute()
 
+const projectStore = useProjectStore()
+
+const isnew = ref(true)
+
+const newproject = ref({
+  name: '',
+  remark: ''
+})
+
+let gd = ref({
+    total: 1,
+    currentPage: 1,
+    pageSize:5,
+    searchtag: ''
+})
+
+
+const projectlists = ref()
+const currentRow = ref()
+const titlename = ref('新建项目')
+
+const handleSizeChange = (newSize) => {
+    gd.value.pageSize = newSize;
+    gd.value.currentPage = 1;
+    getprojectlist();
+}
+
+const handleCurrentChange=(val)=>{
+    getprojectlist();
+}
+
+const handleRowChange = (val) => {
+  console.log("当前行：",val)
+  currentRow.value = val;
+}
+
+const getprojectlist = () => {
+    const params = {
+        transCode: 'AC00001',
+        count: gd.value.pageSize,
+        page: gd.value.currentPage,
+        searchtag: gd.value.searchtag,
+    }
+    request(params)
+        .then((res) => {
+            // console.log(res);
+            gd.value.total = res.total;
+            projectlists.value=res.rows.map((item) =>({
+              ...item,
+              updateTime: item.updateTime.split(' +')[0],
+              createTime: item.createTime.split(' +')[0],
+            }))
+        })
+        .catch((err) => {
+            console.error(err);
+            ElMessage.error(err.returnMsg)
+        })
+};
+
+const opProject = () => {
+  if(titlename.value ==='新建项目'){
+    addProject();
+  }else {
+    editProject();
+  }
+}
+
+// 新增
+const addone = () => {
+  isnew.value = true;
+  titlename.value = '新建项目';
+}
+
+const addProject = () => {
+  const params = {
+    transCode: 'AC00002',
+    name: newproject.value.name,
+    remark: newproject.value.remark,
+  };
+  request(params)
+    .then((res) => {
+      console.log(res);
+      ElMessage.success('添加成功');
+      // isnew.value = false;
+      getprojectlist();
+    })
+    .catch((err) => {
+      ElMessage.error(err.returnMsg);
+    });
+};
+
+// 编辑选中行
+const editSelected = () => {
+  if (!currentRow.value) {
+    ElMessage.warning("请选择一个项目")
+    return
+  }
+  isnew.value = true;
+  titlename.value = '编辑项目';
+}
+
+const editProject = () => {
+  const pid = currentRow.value.pid
+  const params = {
+    transCode: 'AC00002',
+    pid:pid,
+    name: newproject.value.name,
+    remark: newproject.value.remark,
+  };
+  request(params)
+    .then((res) => {
+      console.log(res);
+      ElMessage.success('编辑成功');
+      // isnew.value = false;
+      getprojectlist();
+    })
+    .catch((err) => {
+      ElMessage.error(err.returnMsg);
+    });
+}
+
+
+// 删除选中行
+const deleteSelected = () => {
+  ElMessageBox.confirm(
+    "确定要删除选中的项目吗?", // "确定要删除选中的项目吗?"
+    "提示",           // "提示"
+    {
+      confirmButtonText: "确定", // "确定"
+      cancelButtonText: "取消",   // "取消"
+      type: 'warning'
+    }
+  ).then(() => {
+    const selectedIds = currentRow.value.pid;
+    // console.log('删除的项目ID:', selectedIds)
+    const params = {
+      transCode: 'AC00003',
+      pid: selectedIds
+    }
+
+    request(params)
+      .then((res) => {
+        ElMessage.success("删除成功") // "删除成功"
+        currentRow.value = ''
+        getprojectlist()
+      })
+      .catch((err) => {
+        ElMessage.error(err.returnMsg || "删除失败") // "删除失败"
+        console.log(err)
+      })
+  }).catch(() => {
+    ElMessage.info("已取消删除") // "已取消删除"
+  })
+}
+
+
+const confirmSelected = () => {
+  
+  if (!currentRow.value) {
+    ElMessage.warning("请选择一个项目")
+    return
+  }
+
+  // 获取选中项的pid
+  const pid = currentRow.value.pid
+  // console.log('选中的项目:', currentRow.value)
+  projectStore.setpid(pid)
+  projectStore.setProjectInfo({
+    name: currentRow.value.name,
+    remark: currentRow.value.remark,
+  })
+
+  router.push({
+    path: '/',
+  })
+}
 
 
 
+onMounted(() => {
+    getprojectlist();
+});
 
 
 </script>
 <style scoped>
-.home-page {
+.project-page {
   width: 100%;
   min-width: 1400px;
   min-height: 700px;
   height: 100vh;
   overflow: hidden;
 
-  position: relative; /* 关键：为子元素绝对定位提供参照 */
+  position: relative;
+  /* 关键：为子元素绝对定位提供参照 */
 }
 
 
 .background-image {
-  position: absolute; /* 脱离文档流 */
+  position: absolute;
+  /* 脱离文档流 */
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
-  object-fit: fill; /* 或 contain，根据需求选择 */
+  object-fit: fill;
+  /* 或 contain，根据需求选择 */
   object-position: center;
-  z-index: 0; /* 置于底层 */
+  z-index: 0;
+  /* 置于底层 */
+}
+
+.project-container {
+  position: relative;
+  /* 关键：确保内容在背景上方 */
+  z-index: 1;
+  /* 高于背景图的层级 */
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: calc(100vh - 70px);
+  min-height: 630px;
+}
+
+.project-content {
+  width: 80%;
+  height: 70%;
+  position: relative;
+  border: 1px solid transparent;
+  border-image: linear-gradient(to right, #0075FF, #00FFD8, #00FFD8) 1;
+}
+
+.newproject {
+  width: 100%;
+  height: 15%;
+  padding: 24px;
+
+  .newproject-header{
+    font-size: 20px;
+    color: #2CFFFF;
+    padding-bottom: 10px;
+
+    display: flex;
+    justify-content: space-between; /* 标题和图标两端对齐 */
+    align-items: center; /* 垂直居中 */
+  }
+
+  .newproject-body {
+    width: 100%;
+    padding-left: 5px;
+
+    :deep(.el-form-item__label) {
+      color: #2CFFFF;
+    }
+
+    .el-button {
+      width: 100%;
+      background: linear-gradient( 355deg, #00ABFF 0%, #023187 100%);
+      border-radius: 0px 0px 0px 0px;
+      border: 2px solid #52C6FF;
+
+      color: #FFFFFF;
+    }
+  }
+}
+
+.close-icon {
+  cursor: pointer; /* 鼠标悬停时显示手型 */
+  transition: color 0.3s;
+}
+
+.close-icon:hover {
+  color: #ff4d4f; /* 悬停时红色 */
+}
+
+.project-table {
+  width: 100%;
+  height: 85%;
+  display: flex;
+  flex-direction: column;
+  overflow: auto;
+  padding: 24px;
+}
+
+.project-table-header {
+  font-size: 20px;
+  color: #2CFFFF;
+  padding-bottom: 10px;
+}
+
+.table-container {
+  width: 100%;
+  height: 85%;
+}
+
+.project-footer {
+  width: 100%;
+
+  padding:10px;
+  display: flex;
+  justify-content: space-between;
 }
 </style>