试验检测表单

src/layout/index.vue

@@ -26,7 +26,7 @@
             <el-header class="hc-header-view">
                 <div class="hc-header-page-name">
                     {{RoutesTitle}}
-                    <!--input multiple type="file" id="file" @change="handleChange" v-if="userInfo?.user_id == '1541381503819694081'"-->
+                    <input multiple type="file" id="file" @change="handleChange" v-if="userInfo?.user_id == '1541381503819694081'">
                 </div>
                 <div class="hc-header-content">
                     <div class="hc-header-cascader-box">

src/layout/modules/MenuItem.vue

@@ -1,6 +1,6 @@
 <template>
     <template v-for="item in datas">
-        <el-sub-menu :index="item?.code" :popper-offset="0" :popper-class="'aside-menu-popper ' + curKey" v-if="item?.children && item?.children.length > 0 && item?.code !== 'tentative-menu'">
+        <el-sub-menu :index="item?.code" :popper-offset="0" :popper-class="'aside-menu-popper ' + curKey" v-if="item?.children && item?.children.length > 0">
             <template #title>
                 <div class="hc-aside-menu-item">
                     <div class="menu---item">
@@ -14,7 +14,7 @@
             </template>
             <MenuItem :datas="item?.children" :cur="curKey" @change="MenuClick"/>
         </el-sub-menu>
-        <el-menu-item :index="item?.code" v-else-if="item?.code !== 'tentative-menu'" @click="MenuClick(item)">
+        <el-menu-item :index="item?.code" v-else @click="MenuClick(item)">
             <div class="hc-aside-menu-item">
                 <div class="menu---item">
                     <HcIcon :name="item?.source" :fill="curKey === item?.code" class="hc-menu-icon" v-if="item?.source"/>

src/styles/tentative/detect/test-form.scss

@@ -3,3 +3,34 @@
     display: flex;
     align-items: center;
 }
+.hc-links-relate-tree-box {
+    position: relative;
+    height: 100%;
+    .hc-search-tree-val {
+        position: relative;
+        margin-bottom: 24px;
+    }
+    .hc-tree-scrollbar {
+        position: relative;
+        height: calc(100% - 50px);
+    }
+}
+
+.hc-links-sample-modal-box {
+    position: relative;
+    height: 100%;
+    display: flex;
+    .hc-links-sample-tree-box,
+    .hc-links-sample-table-box {
+        position: relative;
+        height: 100%;
+    }
+    .hc-links-sample-tree-box {
+        margin-right: 24px;
+        border: 1px solid #EEEEEE;
+    }
+    .hc-links-sample-table-box {
+        flex: 1;
+    }
+}
+

src/views/tentative/detect/test-form.vue

@@ -12,9 +12,9 @@
                 </el-button>
             </template>
             <template #extra>
-                <el-button type="primary" hc-btn>关联工程用途及部位</el-button>
-                <el-button type="primary" hc-btn>关联原材检测报告</el-button>
-                <el-button type="primary" hc-btn>关联取样</el-button>
+                <el-button type="primary" hc-btn @click="linksRelateModalClick">关联工程用途及部位</el-button>
+                <el-button type="primary" hc-btn @click="linksRawModalClick">关联原材检测报告</el-button>
+                <el-button type="primary" hc-btn @click="linksSampleModalClick">关联取样</el-button>
             </template>
             <template #search>
                 <div class="flex-1">
@@ -65,6 +65,53 @@
                 </el-button>
             </template>
         </HcCard>
+
+        <!--关联工程用途及部位-->
+        <HcDialog :show="linksRelateModal" title="关联工程用途及部位" widths="50rem" isTable saveText="确认关联" @close="linksRelateModalClose" @save="linksRelateModalSave">
+            <div class="hc-links-relate-tree-box">
+                <div class="hc-search-tree-val">
+                    <el-input v-model="linksRelateSearchTreeVal" block size="large" placeholder="请输入名称关键词检索" clearable>
+                        <template #suffix>
+                            <HcIcon name="search-2" ui="text-xl"/>
+                        </template>
+                    </el-input>
+                </div>
+                <div class="hc-tree-scrollbar" v-loading="linksRelateTreeLoading" element-loading-text="获取数据中...">
+                    <el-scrollbar>
+                        <WbsTree :projectId="projectId" :contractId="contractId"/>
+                    </el-scrollbar>
+                </div>
+            </div>
+        </HcDialog>
+
+        <!--关联原材检测报告-->
+        <HcDialog :show="linksRawModal" title="关联原材检测报告" widths="75rem" isTable saveText="确认关联" @close="linksRawModalClose" @save="linksRawModalSave">
+            <div class="hc-links-sample-modal-box">
+                <div class="hc-links-sample-tree-box">
+                    <el-scrollbar>
+                        <WbsTree :projectId="projectId" :contractId="contractId"/>
+                    </el-scrollbar>
+                </div>
+                <div class="hc-links-sample-table-box">
+                    <HcTable ref="tableRawRef" :column="linksRawTableColumn" :datas="linksRawTableData" :loading="linksRawTableLoading" :isIndex="false" isCheck @selection-change="linksRawTableSelection"/>
+                </div>
+            </div>
+        </HcDialog>
+
+        <!--关联取样-->
+        <HcDialog :show="linksSampleModal" title="关联取样信息" widths="75rem" isTable saveText="确认" @close="linksSampleModalClose" @save="linksSampleModalSave">
+            <div class="hc-links-sample-modal-box">
+                <div class="hc-links-sample-tree-box">
+                    <el-scrollbar>
+                        <WbsTree :projectId="projectId" :contractId="contractId"/>
+                    </el-scrollbar>
+                </div>
+                <div class="hc-links-sample-table-box">
+                    <HcTable ref="tableSampleRef" :column="linksSampleTableColumn" :datas="linksSampleTableData" :loading="linksSampleTableLoading" :isIndex="false" isCheck @selection-change="linksSampleTableSelection"/>
+                </div>
+            </div>
+        </HcDialog>
+
     </div>
 </template>
 
@@ -73,6 +120,7 @@ import {ref, watch, onMounted} from "vue";
 import {useAppStore} from "~src/store";
 import {useRoute} from 'vue-router'
 import ListItem from "./components/ListItem.vue"
+import WbsTree from "../../data-fill/components/WbsTree.vue"
 
 //变量
 const useRoutes = useRoute()
@@ -122,18 +170,100 @@ const tabTypeChange = (item) => {
 }
 
 //顶部表单
-const topFormRef = ref(null)
 const topFormModel = ref({})
-const topFormRules = {
-    key1: {
-        required: true,
-        trigger: 'blur',
-        message: "请输入"
-    }
-}
 
 const searchForm = ref({})
 
+//关联工程用途及部位 树
+const linksRelateModal = ref(false)
+const linksRelateModalClick = () => {
+    linksRelateModal.value = true
+}
+
+const linksRelateSearchTreeVal = ref('')
+const linksRelateTreeLoading = ref(false)
+
+//确认关联
+const linksRelateModalSave = () => {
+    linksRelateModal.value = false
+}
+const linksRelateModalClose = () => {
+    linksRelateModal.value = false
+}
+
+
+//关联原材检测报告
+const linksRawModal = ref(false)
+const linksRawModalClick = () => {
+    linksRawModal.value = true
+}
+
+//原材检测报告数据
+const tableRawRef = ref(null)
+const linksRawTableColumn = ref([
+    {key:'key1', name: '报告编号'},
+    {key:'key2', name: '试验项目名称'},
+    {key:'key3', name: '工程部位及用途'},
+    {key:'key4', name: '报告日期'}
+])
+const linksRawTableData = ref([])
+const linksRawTableLoading = ref(false)
+
+//多选
+const tableRawCheckedKeys = ref([]);
+const linksRawTableSelection = (rows) => {
+    tableRawCheckedKeys.value = rows.filter((item) => {
+        return (item??'') !== '';
+    })
+}
+
+const linksRawModalSave = () => {
+
+}
+
+//关闭原材检测报告
+const linksRawModalClose = () => {
+    linksRawModal.value = false
+}
+
+
+
+//关联进场材料
+const linksSampleModal = ref(false)
+const linksSampleModalClick = () => {
+    linksSampleModal.value = true
+}
+
+//关联进场材料数据
+const tableSampleRef = ref(null)
+const linksSampleTableColumn = ref([
+    {key:'key1', name: '样品名称'},
+    {key:'key2', name: '取样日期'},
+    {key:'key4', name: '规格型号'},
+    {key:'key7', name: '拟用部位'},
+    {key:'key9', name: '取样人'},
+])
+const linksSampleTableData = ref([])
+const linksSampleTableLoading = ref(false)
+
+//多选
+const tableSampleCheckedKeys = ref([]);
+const linksSampleTableSelection = (rows) => {
+    tableSampleCheckedKeys.value = rows.filter((item) => {
+        return (item??'') !== '';
+    })
+}
+
+const linksSampleModalSave = () => {
+
+}
+
+//关闭关联进场材料
+const linksSampleModalClose = () => {
+    linksSampleModal.value = false
+}
+
+
 </script>
 
 <style lang="scss" scoped>