1111

src/styles/tentative/acquisition/data.scss

@@ -0,0 +1,22 @@
+.hc-tentative-acquisition-data {
+    .el-menu {
+        border: 0;
+        background: transparent;
+        --el-menu-base-level-padding: 10px;
+        .el-sub-menu__title {
+            --el-menu-item-height: 40px;
+            border-left: 3px solid transparent;
+        }
+        .el-sub-menu.is-active .el-sub-menu__title {
+            border-color: var(--el-menu-active-color);
+            background: var(--el-color-primary-light-9);
+            color: var(--el-color-primary);
+        }
+        .el-sub-menu .el-menu-item {
+            --el-menu-sub-item-height: 40px;
+        }
+        .el-menu-item.is-active {
+            background: var(--el-color-primary-light-8);
+        }
+    }
+}

src/views/tentative/acquisition/data.vue

@@ -1,11 +1,207 @@
 <template>
-    <div>数据采集</div>
+    <hc-body split :options="bodySplitOptions" class="hc-tentative-acquisition-data">
+        <template #left>
+            <hc-card scrollbar>
+                <template #header>
+                    <span class="text-18px">数据采集分类</span>
+                </template>
+                <template #extra>
+                    <el-button _icon hc-btn size="small" type="primary">
+                        <hc-icon name="add" />
+                    </el-button>
+                </template>
+                <el-menu unique-opened>
+                    <template v-for="(item, index) in menuData" :key="index">
+                        <el-sub-menu :index="item.key">
+                            <template #title>
+                                <span>{{ item.name }}</span>
+                            </template>
+                            <template v-for="(items, indexs) in item.children" :key="indexs">
+                                <el-menu-item :index="items.key" @contextmenu.prevent.stop="itemsContextMenu($event, items)">
+                                    {{ items.name }}
+                                </el-menu-item>
+                            </template>
+                        </el-sub-menu>
+                    </template>
+                </el-menu>
+                <!-- 右键菜单 -->
+                <hc-context-menu ref="contextMenuItemRef" :datas="menuItemData" @item-click="handleMenuItemSelect" />
+            </hc-card>
+        </template>
+        <hc-card>
+            <template #header>
+                <div class="w-50">
+                    <el-select v-model="searchForm.contractId" placeholder="选择合同段" filterable clearable block>
+                        <el-option label="测试1" value="1" />
+                        <el-option label="测试2" value="2" />
+                    </el-select>
+                </div>
+                <div class="ml-2 w-40">
+                    <el-select v-model="searchForm.key1" placeholder="是否合格" filterable clearable block>
+                        <el-option label="合格" value="1" />
+                        <el-option label="不合格" value="2" />
+                    </el-select>
+                </div>
+                <div class="ml-2 w-40">
+                    <el-select v-model="searchForm.key2" placeholder="数据状态" filterable clearable block>
+                        <el-option label="已引用" value="1" />
+                        <el-option label="未引用" value="2" />
+                    </el-select>
+                </div>
+                <div class="ml-2 w-150px">
+                    <el-date-picker v-model="searchForm.date" class="block" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" clearable placeholder="试验时间" />
+                </div>
+                <div class="ml-2">
+                    <el-button type="primary" @click="searchClick">
+                        <hc-icon name="search-2" />
+                        <span>搜索</span>
+                    </el-button>
+                </div>
+            </template>
+            <template #extra>
+                <el-button :disabled="tableCheckedKeys.length <= 0" hc-btn type="warning">
+                    <hc-icon name="eye-off" />
+                    <span>隐藏</span>
+                </el-button>
+                <el-button :disabled="tableCheckedKeys.length <= 0" hc-btn type="danger">
+                    <hc-icon name="delete-bin-2" />
+                    <span>删除</span>
+                </el-button>
+            </template>
+            <hc-table
+                :column="tableColumn" :datas="tableData" :loading="tableLoading" is-check
+                :index-style="{ width: 60 }" :check-style="{ width: 29 }" @selection-change="tableSelection"
+            >
+                <template #key23="{ row }">
+                    <span v-if="row.key23 === 1" class="text-green">合格</span>
+                    <span v-else class="text-red">不合格</span>
+                </template>
+                <template #key24="{ row }">
+                    <el-tag v-if="row.key24 === 1" type="success" effect="dark">已引用</el-tag>
+                    <el-tag v-else type="info" effect="dark">未引用</el-tag>
+                </template>
+            </hc-table>
+            <template #action>
+                <hc-pages :pages="searchForm" @change="pageChange" />
+            </template>
+        </hc-card>
+    </hc-body>
 </template>
 
 <script setup>
+import { onMounted, ref, watch } from 'vue'
 
-</script>
+//分割配置
+const bodySplitOptions = {
+    sizes: [16, 84],
+    minSize: 240,
+}
+
+//搜索表单
+const searchForm = ref({ current: 1, size: 20, total: 0 })
+
+//分类数据
+const menuData = ref([
+    {
+        key: '1',
+        name: '压力机',
+        children: [
+            { key: '1-1', name: '水泥xxx1' },
+            { key: '1-2', name: '水泥xxx2' },
+            { key: '1-3', name: '水泥xxx3' },
+        ],
+    },
+    {
+        key: '2',
+        name: '万能机',
+        children: [
+            { key: '2-1', name: '钢筋xxx1' },
+            { key: '2-2', name: '钢筋xxx2' },
+            { key: '2-3', name: '钢筋xxx3' },
+        ],
+    },
+])
+
+//右键菜单数据
+const contextMenuItemRef = ref(null)
+const menuItemData = ref([
+    { icon: 'edit-2', label: '修改', key: 'test-1' },
+    { icon: 'delete-bin-2', label: '删除', key: 'test-2' },
+])
+
+//右键菜单
+const itemsContextMenu = (event, item) => {
+    event.preventDefault()
+    contextMenuItemRef.value?.showMenu(event)
+}
+
+//右键菜单被点击
+const handleMenuItemSelect = (item) => {
+    console.log('菜单被点击', item)
+}
 
-<style scoped lang="scss">
+//搜索
+const searchClick = () => {
+    searchForm.value.current = 1
+    getTableData()
+}
+
+//分页被点击
+const pageChange = ({ current, size }) => {
+    searchForm.value.current = current
+    searchForm.value.size = size
+    getTableData()
+}
+
+//表格数据
+const tableColumn = ref([
+    { key: 'key1', name: '工程部位' },
+    { key: 'key2', name: '设备名称' },
+    { key: 'key3', name: '设备采集编号' },
+    { key: 'key4', name: '试验日期' },
+    { key: 'key5', name: '样品编号' },
+    { key: 'key6', name: '试验类型' },
+    { key: 'key7', name: '承压面积(mm2)' },
+    { key: 'key8', name: '试件尺寸(mm)' },
+    { key: 'key9', name: '设计强度(MPa)' },
+    { key: 'key10', name: '龄期(d)' },
+    { key: 'key11', name: '荷载1(KN)' },
+    { key: 'key12', name: '荷载1(KN)' },
+    { key: 'key13', name: '荷载2(KN)' },
+    { key: 'key14', name: '荷载3(KN)' },
+    { key: 'key15', name: '荷载4(KN)' },
+    { key: 'key16', name: '荷载5(KN)' },
+    { key: 'key17', name: '荷载6(KN)' },
+    { key: 'key18', name: '其余荷载(KN)' },
+    { key: 'key19', name: '强度代表值(MPa)' },
+    {
+        name: '最大力总延伸(%)',
+        children: [
+            { key: 'key20', name: '1' },
+            { key: 'key21', name: '2' },
+            { key: 'key22', name: '3' },
+        ],
+    },
+    { key: 'key23', name: '是否合格', width: 100, align: 'center' },
+    { key: 'key24', name: '数据状态', width: 100, align: 'center' },
+])
+const tableData = ref([
+    { key23: 1, key24:1 }, { key23: 2, key24:2 },
+])
+
+//获取表格数据
+const tableLoading = ref(false)
+const getTableData = async () => {
+
+}
+
+//多选
+const tableCheckedKeys = ref([])
+const tableSelection = (rows) => {
+    tableCheckedKeys.value = rows
+}
+</script>
 
+<style lang="scss">
+@import "~src/styles/tentative/acquisition/data";
 </style>

src/views/tentative/parameter/container.vue

@@ -2,16 +2,16 @@
     <div class="hc-page-layout-box">
         <div :style="`width:${leftWidth}px;`" class="hc-layout-left-box menu">
             <div class="hc-menu-header-box">
-                <div class="text-xl name">试验容器</div>
-                <HcTooltip keys="tentative_parameter_container_menu_add">
+                <div class="name text-xl">试验容器</div>
+                <hc-tooltip keys="tentative_parameter_container_menu_add">
                     <el-button _icon hc-btn size="small" type="primary" @click="addEditNodeFormModalClick">
-                        <HcIcon name="add" />
+                        <hc-icon name="add" />
                     </el-button>
-                </HcTooltip>
+                </hc-tooltip>
             </div>
             <div class="hc-menu-contents-box">
                 <el-scrollbar>
-                    <HcMenuSimple
+                    <hc-menu-simple
                         :datas="menus" :keys="menuKey" :menus="contextMenu" :props="menuProps"
                         @change="menuChange" @menu-tap="contextMenuClick"
                     />
@@ -21,7 +21,7 @@
             <div class="horizontal-drag-line" @mousedown="onmousedown" />
         </div>
         <div class="hc-page-content-box">
-            <HcNewCard>
+            <hc-new-card>
                 <template #header>
                     <div class="w-72">
                         <el-input v-model="searchForm.queryValue" clearable placeholder="请输入容器编号查询" @keyup="keyUpEvent" />
@@ -73,7 +73,7 @@
                 <template #action>
                     <HcPages :pages="searchForm" @change="pageChange" />
                 </template>
-            </HcNewCard>
+            </hc-new-card>
         </div>
 
         <!-- 新增/编辑 节点 -->
@@ -584,7 +584,7 @@ const addEditFormClick = async () => {
             window?.$message?.success('操作成功')
             addEditFormModal.value = false
 
-          
+
 
             await getTableData()
             console.log(addEditFormLoading.value, 'addEditFormLoading.value')