新主题

src/global/components/hc-tab-card/hc-tab-card.vue

@@ -36,6 +36,10 @@ const props = defineProps({
         type: Boolean,
         default: false,
     },
+    disabled: {
+        type: Boolean,
+        default: false,
+    },
 })
 
 const emit = defineEmits(['change'])
@@ -52,12 +56,19 @@ watch(() => props.tabs, (val) => {
     tabsData.value = val
 }, { deep: true })
 
+//选项卡禁用
+const isDisabled = ref(props.disabled)
+watch(() => props.disabled, (val) => {
+    isDisabled.value = val
+}, { deep: true })
+
 //选项卡
 const tabsKey = ref(props.tabKey)
 watch(() => props.tabKey, (val) => {
     tabsKey.value = val
 }, { deep: true })
 const tabsClick = (item) => {
+    if (isDisabled.value) return
     tabsKey.value = item.key
     if (item.key !== props.tabKey) {
         emit('change', item)

src/styles/app/element.scss

@@ -33,12 +33,23 @@
     font-size: 14px;
     border: 0;
     box-shadow: none;
+    outline: 0;
 }
 
 .el-button + .el-button {
     margin-left: 10px;
 }
 
+.el-button + .el-dropdown {
+    margin-left: 10px;
+}
+
+.el-dropdown .el-button .hc-icon-i {
+    margin-left: 4px;
+    margin-right: 0;
+}
+
+
 //表格样式重写
 .el-table[hc] {
     --el-table-bg-color: initial;

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

@@ -1,53 +1,63 @@
 <template>
     <div class="hc-page-box">
-        <HcCard action-ui="text-center">
-            <template #header>
-                <el-button :type="authBtnTabKey === '1' ? 'primary' : ''" hc-btn :disabled="router.currentRoute.value.query?.id && router.currentRoute.value.query?.id.length > 0 || newId.length > 0" @click="authBtnTabClick('1')">
-                    <HcIcon name="folder-user" />
-                    <span>施工自检</span>
-                </el-button>
-                <el-button :type="authBtnTabKey === '2' ? 'primary' : ''" hc-btn :disabled="router.currentRoute.value.query?.id && router.currentRoute.value.query?.id.length > 0 || newId.length > 0" @click="authBtnTabClick('2')">
-                    <HcIcon name="folder-shield" />
-                    <span>监理质检</span>
-                </el-button>
-            </template>
+        <HcTabCard :tabs="authBtnTabdata" :tab-key="authBtnTabKey" :disabled="router.currentRoute.value.query?.id && router.currentRoute.value.query?.id.length > 0 || newId.length > 0" @change="authBtnTabClick">
             <template #extra>
-                <el-button :disabled="listItemData.length <= 0" hc-btn type="primary" @click="linksRelateModalClick">
-                    关联工程用途及部位
+                <el-button hc-btn type="info" @click="toBackClick">返回</el-button>
+                <el-button
+                    :disabled="NodeStatus === '3' || listItemData.length <= 0" :loading="tableFormSaveLoading" hc-btn
+                    color="#12C060" style="color: white; font-weight: bold" @click="tableFormSaveClick"
+                >
+                    保存
                 </el-button>
                 <el-button
-                    :disabled="!isMixRatioTestIds" :type="isMixRatioTestIds ? 'primary' : ''" hc-btn
-                    @click="linksRawModalClick"
+                    :disabled="NodeStatus === '3' || NodeStatus === '1'" :loading="reportLoading" hc-btn
+                    color="#FF976A" style="color: white;" @click="reportModalClick"
+                >
+                    上报
+                </el-button>
+                <el-button
+                    :disabled="NodeStatus === '1'" :loading="bussPdfsLoading" hc-btn color="#A16222"
+                    @click="bussPdfsClick(router.currentRoute.value.query.id || nodeIdvalue)"
                 >
-                    关联原材检测报告
+                    预览
                 </el-button>
-                <el-button hc-btn type="primary" @click="linksSampleModalClick">关联取样</el-button>
+                <el-button v-if="NodeStatus === '3'" hc-btn color="#FF976A" style="color: white;" @click="abolishOneClick">撤回上报流程</el-button>
+                <el-dropdown @command="dropdownCommand">
+                    <el-button type="primary" hc-btn>
+                        <span>更多</span>
+                        <HcIcon name="arrow-down-s" />
+                    </el-button>
+                    <template #dropdown>
+                        <el-dropdown-menu>
+                            <el-dropdown-item command="linksRelate" :disabled="listItemData.length <= 0">关联工程用途及部位</el-dropdown-item>
+                            <el-dropdown-item command="linksRaw" :disabled="!isMixRatioTestIds">关联原材检测报告</el-dropdown-item>
+                            <el-dropdown-item command="linksSample">关联取样</el-dropdown-item>
+                        </el-dropdown-menu>
+                    </template>
+                </el-dropdown>
             </template>
             <template #search>
-                <div class="flex-1">
-                    <HcNewSwitch :datas="tabTypeTab" :keys="tabTypeKey" :round="false" size="default" @change="tabTypeChange" />
+                <div class="w-32 mr-5">
+                    <el-select v-model="tabTypeKey" block @change="tabTypeChange">
+                        <el-option v-for="item in tabTypeTab" :key="item.key" :label="item.name" :value="item.key" />
+                    </el-select>
                 </div>
-                <div class="hc-search-top-form">
-                    <div class="w-40">
-                        <el-input v-model="listItemBaseData.trialUserName" clearable placeholder="请输入试验人员" />
-                    </div>
-                    <div v-if="tabTypeKey === '2'" class="w-36 ml-2">
-                        <el-date-picker
-                            v-model="listItemBaseData.reportDate" :clearable="false" class="block"
-                            placeholder="请选择报告日期" type="date" value-format="YYYY-MM-DD"
-                        />
-                    </div>
-                    <div v-if="tabTypeKey === '2'" class="w-28 ml-2">
-                        <el-select v-model="listItemBaseData.detectionResult" block placeholder="是否合格">
-                            <el-option label="合格" value="1" />
-                            <el-option label="不合格" value="0" />
-                        </el-select>
-                    </div>
-                    <div class="w-36 ml-2">
-                        <el-select v-model="listItemBaseData.detectionCategory" block placeholder="选择检测类型">
-                            <el-option v-for="item in categoryData" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
-                        </el-select>
-                    </div>
+                <div v-if="tabTypeKey === '2'" class="w-36 ml-2">
+                    <el-date-picker v-model="listItemBaseData.reportDate" :clearable="false" class="block" placeholder="请选择报告日期" type="date" value-format="YYYY-MM-DD" />
+                </div>
+                <div v-if="tabTypeKey === '2'" class="w-28 ml-2">
+                    <el-select v-model="listItemBaseData.detectionResult" block placeholder="是否合格">
+                        <el-option label="合格" value="1" />
+                        <el-option label="不合格" value="0" />
+                    </el-select>
+                </div>
+                <div class="w-36 ml-2">
+                    <el-select v-model="listItemBaseData.detectionCategory" block placeholder="选择检测类型">
+                        <el-option v-for="item in categoryData" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
+                    </el-select>
+                </div>
+                <div class="w-40 ml-2">
+                    <el-input v-model="listItemBaseData.trialUserName" clearable placeholder="请输入试验人员" />
                 </div>
             </template>
             <!-- 清表列表 -->
@@ -71,53 +81,7 @@
                 />
             </el-scrollbar>
             <HcStatus v-else v-loading="isLoadList" text="暂无表单" />
-            <template #action>
-                <div class="hc-table-form-action-tip">
-                    <el-alert
-                        :closable="false"
-                        class="hc-alert"
-                        show-icon
-                        style=""
-                        title="完善资料填写后记得一定要保存哦"
-                        type="warning"
-                    />
-                </div>
-                <el-button
-                    :disabled="NodeStatus === '3' || listItemData.length <= 0" :loading="tableFormSaveLoading"
-                    hc-btn
-                    type="primary" @click="tableFormSaveClick"
-                >
-                    <HcIcon name="save" />
-                    <span>保存</span>
-                </el-button>
-                <el-button
-                    :disabled="NodeStatus === '3' || NodeStatus === '1'" :loading="reportLoading" hc-btn
-                    @click="reportModalClick"
-                >
-                    <HcIcon name="send-plane-2" />
-                    <span>上报</span>
-                </el-button>
-                <!-- <el-button hc-btn :loading="reportLoading" @click="reportModalClick"  >
-                   <HcIcon name="send-plane-2"/>
-                   <span>上报</span>
-               </el-button> -->
-                <el-button
-                    :disabled="NodeStatus === '1'" :loading="bussPdfsLoading" hc-btn
-                    @click="bussPdfsClick(router.currentRoute.value.query.id || nodeIdvalue)"
-                >
-                    <HcIcon name="eye" />
-                    <span>预览</span>
-                </el-button>
-                <el-button v-if="NodeStatus === '3'" hc-btn @click="abolishOneClick">
-                    <HcIcon name="arrow-go-back" />
-                    <span>撤回上报流程</span>
-                </el-button>
-                <el-button hc-btn @click="toBackClick">
-                    <HcIcon name="delete-back" />
-                    <span>返回</span>
-                </el-button>
-            </template>
-        </HcCard>
+        </HcTabCard>
 
         <!-- 关联工程用途及部位 -->
         <HcDialog
@@ -247,19 +211,15 @@ import { nextTick, onDeactivated, onMounted, ref, watch } from 'vue'
 import { useAppStore } from '~src/store'
 import { useRoute, useRouter } from 'vue-router'
 import ListItem from './components/ListItem.vue'
-import DivisionTree from './components/DivisionTree.vue'
-import DivisionTree1 from './components/DivisionTree1.vue'
 import dataApi from '~api/tentative/detect/test'
 import samplingApi from '~api/tentative/material/sampling'
 import divisionApi from '~api/data-fill/division'
-import queryApi from '~api/data-fill/query'
 import { getStoreValue, setStoreValue } from '~src/utils/storage'
 import TestTree from '../material/components/TestTree.vue'
 import TestTreeMaterial from '../material/components/TestTreeMaterial.vue'
 import { arrToId, getArrValue, getObjValue, isNullES, isString } from 'js-fast-way'
 import { getDictionary } from '~api/other'
 import dayjs from 'dayjs'
-import { Loading } from 'element-plus/es/components/loading/src/service'
 import { eVisaTaskCheckApi } from '~api/other'
 import wbsApi from '~api/data-fill/wbs'
 
@@ -309,10 +269,8 @@ onMounted(() => {
         listItemBaseData.value.detectionResult = info.detectionResult.toString()
     }
     if (info && info.projectPosition) {
-
         defaultCheckarrIds.value = info.projectPosition.split(',')
         defaultprojectPositionName.value = info?.projectPositionName
-
     }
     getSearchNodeTables()
     getSearchNodeTablesall(1)
@@ -327,38 +285,42 @@ onDeactivated(() => {
 })
 //身份按钮切换数据
 const authBtnTabKey = ref(dataType)
-const authBtnTabClick = (val) => {
-    if (val !== authBtnTabKey.value) {
-        authBtnTabKey.value = val
-        listItemBaseData.value.type = val
-        listItemBaseData.value.detectionCategory = Number(val)
+const authBtnTabdata = ref([
+    { key: '1', name: '施工质检' },
+    { key: '2', name: '监理质检' },
+])
+const authBtnTabClick = ({ key }) => {
+    if (key !== authBtnTabKey.value) {
+        authBtnTabKey.value = key
+        listItemBaseData.value.type = key
+        listItemBaseData.value.detectionCategory = Number(key)
         getSearchNodeTables()
     }
 }
 
+//更多菜单
+const dropdownCommand = (val) => {
+    if (val === 'linksRelate') {
+        linksRelateModalClick()
+    } else if (val === 'linksRaw') {
+        linksRawModalClick()
+    } else if (val === 'linksSample') {
+        linksSampleModalClick()
+    }
+}
+
 //类型tab数据和相关处理
-const leftFormData = ref([])
-const rightFormData = ref([])
-const allFormData = ref([])
 const tabTypeTab = ref([
     { key: '1', name: '记录表' },
     { key: '2', name: '报告单' },
 ])
-const tabTypeChange = ({ key }) => {
-    // console.log(ListItemRef.value?.getFormData(),'ListItemRef.value?.getFormData()');
+const tabTypeChange = (key) => {
     tabTypeKey.value = key
     let curform = ListItemRef.value?.getFormData()
     setAllListData(curform)
     if (listItemBaseData.value.detectionResult === '' && tabTypeKey.value == 2) {
         window.$message?.warning('请选择报告单是否合格')
     }
-    // if(tabTypeKey.value==='2'){
-    //     leftFormData.value=ListItemRef.value?.getFormData()
-    // }else{
-    //       rightFormData.value=ListItemRef.value?.getFormData()
-    // }
-
-
     getSearchNodeTables()
 }