app填报

index.html

@@ -22,11 +22,29 @@
                 });
                 //接受子页面传递过来的消息数据
                 window.addEventListener('message', (event) => {
-                    uni.postMessage({
-                        data: event.data
-                    });
+                    if (event.data.source === 'web') {
+                        uni.postMessage({
+                            data: event.data
+                        });
+                    }
                 });
             });
+            //app改变显示模式
+            function editTypeClick(type) {
+                window?.postMessage({
+                    type: 'editTypeClick',
+                    source: 'app',
+                    data: type,
+                })
+            }
+            //app的表单提交保存
+            function formSave() {
+                window?.postMessage({
+                    type: 'formSave',
+                    source: 'app',
+                    data: {},
+                })
+            }
         </script>
         <script type="module" src="/src/main.js"></script>
     </body>

src/styles/uni-app/table-form.scss

@@ -1,65 +1,15 @@
 .hc-uni-app-table-form {
     position: relative;
-    height: 100%;
-    overflow: hidden;
-    .title-bar {
-        position: fixed;
-        top: 0;
-        display: flex;
-        width: 100%;
-        padding: 8px;
-        background: #E8EEF2;
-        overflow-x: auto;
-        white-space: nowrap;
-        z-index: 9999;
-        &::-webkit-scrollbar {
-            width: 0;
-            height: 0;
-        }
-        .el-button {
-            flex: 1;
-            --el-button-text-color: #6FCC9F !important;
-            --el-button-hover-text-color: #6FCC9F !important;
-        }
-        .el-button + .el-button {
-            margin-left: 10px;
-        }
-    }
-    .hc-app-table-form {
-        position: relative;
-        margin-top: 48px;
-        height: calc(100% - 48px - 73px);
-        overflow: auto;
-        background: white;
-        &::-webkit-scrollbar {
-            width: 0;
-            height: 0;
-        }
-        .hc-table-form-data-item {
-            min-width: 100%;
-            width: max-content !important;
-            height: max-content !important;
-            /* 日期范围选框太大 */
-            .el-date-range-picker {
-                zoom: 0.57;
-            }
-        }
-    }
-    .action-bar {
-        position: fixed;
-        bottom: 0;
-        width: 100%;
-        display: flex;
-        background: white;
-        padding: 12px 12px 16px;
-        z-index: 9999;
-        .el-button {
-            flex: 1;
-            height: 44px;
-            --el-font-size-base: 18px;
+    .hc-table-form-data-item {
+        min-width: 100%;
+        width: max-content !important;
+        height: max-content !important;
+        /* 日期范围选框太大 */
+        .el-date-range-picker {
+            zoom: 0.57;
         }
     }
-    &.form .hc-app-table-form .hc-table-form-data-item {
+    &.form .hc-table-form-data-item {
         width: 100% !important;
         table {
             min-width: 100%
@@ -80,7 +30,7 @@
             }
         }
     }
-    &.table .hc-app-table-form .hc-table-form-data-item {
+    &.table .hc-table-form-data-item {
         width: 100% !important;
     }
 }

src/views/uni-app/table-form.vue

@@ -1,20 +1,6 @@
 <template>
     <div v-loading="loading" class="hc-uni-app-table-form" :class="[editType]">
-        <div class="title-bar">
-            <el-button v-if="editType === 'form'" color="#EBF9F4" @click="editTypeClick('auto')">切换</el-button>
-            <el-button v-if="editType === 'auto'" color="#EBF9F4" @click="editTypeClick('table')">切换</el-button>
-            <el-button v-if="editType === 'table'" color="#EBF9F4" @click="editTypeClick('form')">切换</el-button>
-            <el-button color="#EBF9F4" @click="toCopyClick">复制</el-button>
-            <el-button color="#EBF9F4" @click="toHideClick">隐藏</el-button>
-            <el-button color="#EBF9F4" @click="previewClick">预览</el-button>
-            <el-button color="#EBF9F4">上传</el-button>
-        </div>
-        <div class="hc-app-table-form" :style="tableWidth > 0 ? `width: ${tableWidth}px;` : ''">
-            <hc-table-form ref="tableFormRef" :form="tableFormInfo" :html="excelHtml" :scroll="false" :pkey="appItem.pkeyId" @render="tableFormRender" />
-        </div>
-        <div class="action-bar">
-            <el-button hc-btn type="primary" size="large" @click="toSaveClick">保 存</el-button>
-        </div>
+        <hc-table-form ref="tableFormRef" :form="tableFormInfo" :html="excelHtml" :scroll="false" :pkey="appItem.pkeyId" @render="tableFormRender" />
     </div>
 </template>
 
@@ -24,19 +10,31 @@ import { useRoute } from 'vue-router'
 import wbsApi from '~api/data-fill/wbs'
 import { getObjVal, getObjValue, isString } from 'js-fast-way'
 
+//初始变量
 const useRoutes = useRoute()
 const appItem = useRoutes.query
 
+//基础变量
 const tableFormRef = ref(null)
-const editType = ref('table')
+const editType = ref('form')
 const loading = ref(false)
 
 //渲染完成
 onMounted(() => {
-    console.log(appItem)
     getWbsContractById()
     getDataApi()
-    editTypeClick('table')
+    editTypeClick('form')
+    //接受app传递过来的消息
+    window.addEventListener('message', (event) => {
+        const { source, data, type } = event.data
+        if (source === 'app') {
+            if (type === 'editTypeClick') {
+                editTypeClick(data)
+            } else if (type === 'formSave') {
+                toSaveClick()
+            }
+        }
+    })
 })
 
 const getDataApi = async () => {
@@ -104,9 +102,9 @@ const getExcelHtml = async () => {
 //渲染完成
 const tableFormRender = (form) => {
     tableFormInfo.value = form
-    //emit('render', form)
 }
 
+
 //切换显示模式
 const tableWidth = ref(0)
 const editTypeClick = (type) => {
@@ -114,9 +112,6 @@ const editTypeClick = (type) => {
     if (type === 'form') {
         metaEle.setAttribute('content', 'width=device-width,user-scalable=no,initial-scale=1.0')
         tableWidth.value = 0
-    } else if (type === 'auto') {
-        metaEle.setAttribute('content', 'width=1080, initial-scale=0.5,user-scalable=yes')
-        tableWidth.value = document.body.offsetWidth
     } else if (type === 'table') {
         metaEle.setAttribute('content', 'width=1080, initial-scale=0.5,user-scalable=yes')
         tableWidth.value = document.body.offsetWidth
@@ -124,89 +119,6 @@ const editTypeClick = (type) => {
     editType.value = type
 }
 
-//复制表
-const toCopyClick = async () => {
-    const { pkeyId, status } = appItem
-    if (!pkeyId) {
-        window?.$message?.warning('pkeyId为空')
-        return
-    } else if (status === '3') {
-        window?.$message?.warning('已上报的资料，不允许复制')
-        return
-    }
-    loading.value = true
-    const { error, code, msg } = await wbsApi.copeBussTab({
-        pkeyId: pkeyId,
-    }, false)
-    loading.value = false
-    if (!error && code === 200) {
-        window?.$message?.success('操作成功')
-        //通知 uni-app，该刷新列表了
-        window?.postMessage({
-            type: 'back',
-        })
-    } else {
-        window?.$message?.error(msg)
-    }
-}
-
-//隐藏表单
-const toHideClick = async () => {
-    const { pkeyId, status } = appItem
-    if (!pkeyId) {
-        window?.$message?.warning('pkeyId为空')
-        return
-    } else if (status === '3') {
-        window?.$message?.warning('已上报的资料，不允许隐藏示')
-        return
-    }
-    loading.value = true
-    const { error, code, msg } = await wbsApi.showBussTab({
-        pkeyId: pkeyId,
-        status: 2,
-    })
-    loading.value = false
-    if (!error && code === 200) {
-        window?.$message?.success('操作成功')
-        //通知 uni-app，该刷新列表了
-        window?.postMessage({
-            type: 'back',
-        })
-    } else {
-        window?.$message?.error(msg)
-    }
-}
-
-//预览表单
-const previewClick = async () => {
-    const { pkeyId } = appItem, { isBussShow, isTabPdf, pdfUrl } = wbsInfo.value
-    if (!pkeyId) {
-        window?.$message?.warning('pkeyId为空')
-        return
-    } else if (isBussShow === 2 || isTabPdf === 1 || pdfUrl === '') {
-        window?.$message?.warning('当前状态无法预览')
-        return
-    }
-    loading.value = true
-    const { error, code, data, msg } = await wbsApi.getBussPdfInfo({
-        pkeyId: pkeyId,
-    })
-    loading.value = false
-    if (!error && code === 200 && data) {
-        if (window.appType.h5) {
-            window.open(data, '_blank')
-        } else {
-            //当前非h5环境，通知 uni-app，打开pdf
-            window?.postMessage({
-                type: 'pdf',
-                url: data,
-            })
-        }
-    } else {
-        window?.$message?.error(msg)
-    }
-}
-
 //保存表单
 const toSaveClick = async () => {
     const { pkeyId, status } = appItem
@@ -222,8 +134,12 @@ const toSaveClick = async () => {
     const { error, code, msg } = await wbsApi.saveExcelBussData(formData, false)
     loading.value = false
     if (!error && code === 200) {
-        //window?.$message?.success('保存成功')
-        previewClick().then()
+        window?.$message?.success('保存成功')
+        window?.postMessage({
+            type: 'saveSuccess',
+            source: 'web',
+            data: {},
+        })
     } else {
         window?.$message?.error(msg)
     }