合同材料

src/api/modules/debit-pay/material/adjustment.js

@@ -0,0 +1,43 @@
+import { HcApi } from '../../../request/index'
+export default {
+    //列表
+    async getAllMaterial(form) {
+        return HcApi({
+            url: '/api/blade-meter/contractMaterial/get-all-material2',
+            method: 'post',
+            data: form,
+        }, false)
+    },
+    //获取清单树
+    async getAdjustFormTree(form) {
+        return HcApi({
+            url: '/api/blade-meter/contractMaterial/get-adjust-form-tree',
+            method: 'get',
+            params: form,
+        }, false)
+    },
+    //确定绑定
+    async linkFormMaterial(form) {
+        return HcApi({
+            url: '/api/blade-meter/contractMaterial/material-link-form',
+            method: 'post',
+            data: form,
+        }, false)
+    },
+     //获取清单列表
+    async linkAllForm(form) {
+        return HcApi({
+            url: '/api/blade-meter/contractMaterial/get-link-all-form',
+            method: 'get',
+            params: form,
+        }, false)
+    },
+    //解除绑定关系
+    async removeLinkForm(id) {
+        return HcApi({
+            url: '/api/blade-meter/contractMaterial/remove-link-form',
+            method: 'get',
+            params: { id },
+        }, false)
+    },
+}

src/styles/app/element.scss

@@ -208,14 +208,3 @@
     color: #a9abb2;
     cursor: not-allowed;
 }
-
-//树只显示子级的复选框
-.el-tree.hc-tree-node.tree-data-check .el-tree-node__content,
-.el-tree.hc-tree-node-v2.tree-data-check .el-tree-node__content {
-    .is-leaf + .el-checkbox {
-        display: inline-flex;
-    }
-    .el-checkbox {
-        display: none;
-    }
-}

src/views/debit-pay/material/adjustment.vue

@@ -2,10 +2,10 @@
     <hc-card class="hc-debit-pay-material-adjustment">
         <template #header>
             <div class="w-40">
-                <el-input v-model="searchForm.key1" placeholder="材料编码" />
+                <el-input v-model="searchForm.materialNumber" placeholder="材料编码" />
             </div>
             <div class="ml-3 w-60">
-                <hc-search-input v-model="searchForm.key2" placeholder="请输入材料名称" @search="getTableData" />
+                <hc-search-input v-model="searchForm.materialName" placeholder="请输入材料名称" @search="getTableData" />
             </div>
         </template>
         <hc-body :split="rowBindingShow" padding="0">
@@ -13,7 +13,7 @@
                 <hc-table :column="tableColumn" :datas="tableData" :is-index="false" :loading="tableLoading">
                     <template #action="{ row }">
                         <template v-if="row.rowBindingData">
-                            <el-link type="success" @click="confirmBinding(row)">确认绑定</el-link>
+                            <el-link type="success" :disabled="treeLoadNode.length <= 0" @click="confirmBinding(row)">确认绑定</el-link>
                             <el-link type="danger" @click="cancelBinding(row)">取消绑定</el-link>
                         </template>
                         <template v-else>
@@ -25,19 +25,21 @@
             </hc-card-item>
             <template #right>
                 <hc-card-item scrollbar>
-                    <hc-data-tree ui="tree-data-check" tree-key="id" :h-props="treeProps" :datas="treeLoadNode" show-checkbox check-strictly @check="treeNodeCheck">
-                        <template #default="{ node, data }">
-                            <div class="level">{{ data.label }}</div>
-                            <div v-if="node.isLeaf" class="submit-input w-100px">
-                                <el-input v-model="data.param" size="small" placeholder="请输入调差参数" />
+                    <el-tree ref="treeRef" :data="treeLoadNode" node-key="id" :props="treeProps" :default-checked-keys="treeNodeCheckList" show-checkbox check-strictly>
+                        <template #default="{ data }">
+                            <div class="data-custom-tree-node">
+                                <div class="level">{{ data.formName }}</div>
+                                <div v-if="data.isFormNode" class="submit-input">
+                                    <el-input v-model="data.param" size="small" placeholder="请输入调差参数" />
+                                </div>
                             </div>
                         </template>
-                    </hc-data-tree>
+                    </el-tree>
                 </hc-card-item>
             </template>
         </hc-body>
         <!-- 调差系数编辑 -->
-        <hc-new-dialog :show="isFormModal" title="调差系数编辑" is-footer-center is-table widths="50rem" @close="modalClose">
+        <hc-new-dialog :show="isFormModal" title="调差系数编辑" :footer="false" is-table widths="50rem" @close="modalClose">
             <hc-table :column="tableColumn1" :datas="tableData2" :is-index="false">
                 <template #key4="{ row }">
                     <hc-table-input v-model="row.key4" />
@@ -46,16 +48,21 @@
                     <el-link type="danger" @click="dischargeBinding(row)">解除绑定关系</el-link>
                 </template>
             </hc-table>
-            <template #footer>
-                <el-button hc-btn @click="modalClose">取消</el-button>
-                <el-button :loading="saveLoaing" hc-btn type="primary" @click="modalSave">提交</el-button>
-            </template>
         </hc-new-dialog>
     </hc-card>
 </template>
 
 <script setup>
 import { onActivated, ref } from 'vue'
+import { useAppStore } from '~src/store'
+import { HcDelMsg } from 'hc-vue3-ui'
+import { getArrValue } from 'js-fast-way'
+import mainApi from '~api/debit-pay/material/adjustment'
+
+//初始化
+const store = useAppStore()
+const projectId = ref(store.getProjectId)
+const contractId = ref(store.getContractId)
 
 //渲染完成
 onActivated(() => {
@@ -63,7 +70,7 @@ onActivated(() => {
 })
 
 //搜索表单
-const searchForm = ref({ key1: '', key2: '' })
+const searchForm = ref({ materialNumber: '', materialName: '' })
 
 //表格
 const tableColumn = [
@@ -72,57 +79,65 @@ const tableColumn = [
     { key: 'unit', name: '材料单位' },
     { key: 'action', name: '操作', width: 140, align: 'center' },
 ]
-const tableData = ref([
-    {},
-])
+const tableData = ref([])
 
 //获取表格数据
 const tableLoading = ref(false)
 const getTableData = async () => {
-
+    tableLoading.value = true
+    const { error, code, data } = await mainApi.getAllMaterial({
+        ...searchForm.value,
+        projectId: projectId.value,
+        contractId: contractId.value,
+    })
+    tableLoading.value = false
+    if (!error && code === 200) {
+        tableData.value = getArrValue(data)
+    } else {
+        tableData.value = []
+    }
 }
 
 //调差树
-const treeProps = { label: 'label', children: 'children' }
-const treeLoadNode = ref([
-    {
-        id: 1,
-        label: 'Level one 1',
-        children: [
-            {
-                id: 2,
-                label: 'Level two',
-                children: [
-                    {
-                        id: 3,
-                        label: 'Level three',
-                    },
-                ],
-            },
-        ],
+const treeRef = ref(null)
+const treeProps = {
+    label: 'formName', children: 'children',
+    disabled: (data) => {
+        return data.isQuote === 1
+    },
+    class: (data) => {
+        return `${data.isFormNode === 1 ? 'is-form-node' : 'no-form-check'}`
     },
-])
-
-//节点被选择
-const treeNodeCheck = (_, { checkedNodes, checkedKeys, halfCheckedNodes, halfCheckedKeys }) => {
-    console.log(checkedNodes, checkedKeys, halfCheckedNodes, halfCheckedKeys)
 }
+const treeLoadNode = ref([])
 
 //绑定清单
 const rowBindingShow = ref(false)
-const rowBinding = (row) => {
+const treeNodeCheckList = ref([])
+const rowBinding = async (row) => {
     if (rowBindingShow.value) {
         window.$message.error('请先操作完上一个清单')
         return
     }
     rowBindingShow.value = true
     row.rowBindingData = true
+    //获取树的数据
+    const { data } = await mainApi.getAdjustFormTree({
+        projectId: projectId.value,
+        contractId: contractId.value,
+        materialId: row.id,
+    })
+    treeLoadNode.value = getArrValue(data['vo2s'])
+    treeNodeCheckList.value = getArrValue(data['ids'])
 }
 
 //确认绑定
 const confirmBinding = async (row) => {
-    rowBindingShow.value = false
-    row.rowBindingData = false
+    const list = treeNodeCheckList.value
+    console.log(list)
+
+    //rowBindingShow.value = false
+    //row.rowBindingData = false
 }
 
 //取消绑定
@@ -131,51 +146,94 @@ const cancelBinding = (row) => {
     row.rowBindingData = false
 }
 
+//编辑表格
 const tableColumn1 = [
-    { key: 'key1', name: '清单名称' },
-    { key: 'key2', name: '清单编号' },
-    { key: 'key3', name: '绑定材料名称' },
-    { key: 'key4', name: '调差系数' },
+    { key: 'formName', name: '清单名称' },
+    { key: 'formNumber', name: '清单编号' },
+    { key: 'materialName', name: '绑定材料名称' },
+    { key: 'adjustFactor', name: '调差系数' },
     { key: 'action', name: '操作', width: 140, align: 'center' },
 ]
-const tableData2 = ref([
-    {},
-])
-
-//解除绑定关系
-const dischargeBinding = (row) => {
-    console.log(row)
+const tableData2 = ref([])
+const getLinkAllForm = async (id) => {
+    const { data } = await mainApi.linkAllForm({
+        projectId: projectId.value,
+        contractId: contractId.value,
+        materialId: id,
+    })
+    tableData2.value = getArrValue(data)
 }
 
 //编辑
 const isFormModal = ref(false)
 const rowEditClick = (row) => {
     isFormModal.value = true
+    getLinkAllForm(row.id)
 }
 
-//提交保存
-const saveLoaing = ref(false)
-const modalSave = async () => {
-    modalClose()
+//解除绑定关系
+const dischargeBinding = (row) => {
+    HcDelMsg({
+        title: '确认操作提醒',
+        text: '确认要解除绑定关系？',
+    }, async (resolve) => {
+        const { error, code, msg } = await mainApi.removeLinkForm(row.id)
+        if (!error && code === 200) {
+            window.$message.success(msg)
+            getLinkAllForm(row.id).then()
+            resolve()
+        } else {
+            window.$message.error(msg ?? '操作失败')
+        }
+    })
 }
 
 //取消关闭
 const modalClose = () => {
     isFormModal.value = false
+    tableData2.value = []
 }
 </script>
 
 <style lang="scss">
-.hc-debit-pay-material-adjustment .el-tree.tree-data-check .data-custom-tree-node {
-    .level {
-        flex: 1;
+.hc-debit-pay-material-adjustment .el-tree {
+    --el-fill-color-blank: transparent;
+    --el-tree-node-hover-bg-color: white;
+    .el-tree-node.no-form-check .el-tree-node__content .el-checkbox {
+        display: none;
     }
-    .submit-input {
-        margin-left: 10px;
-        margin-right: 2px;
+    .el-tree-node.is-form-node .el-tree-node__content .el-checkbox {
+        display: inline-flex;
     }
-    .el-input .el-input__wrapper {
-        background-color: white;
+    .data-custom-tree-node {
+        position: relative;
+        display: flex;
+        align-items: center;
+        width: 100%;
+        flex: 1;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        color: #101010;
+        .level {
+            position: relative;
+            flex: 1;
+            height: 100%;
+            display: flex;
+            align-items: center;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+        .submit-input {
+            position: unset;
+            margin-left: 10px;
+            margin-right: 2px;
+            width: 100px;
+        }
+        .el-input .el-input__wrapper {
+            background-color: white;
+        }
     }
 }
 </style>