Merge branch 'main' into dev-sy

2024-12-16 18:16:13 +08:00 · 2024-12-16 18:16:13 +08:00 · 33b004bbe3
parent 98d2bce89c 2ebfb6c9ef
commit 33b004bbe3
5 changed files with 6276 additions and 109 deletions
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -15,6 +15,8 @@
  },
  "dependencies": {
    "@element-plus/icons-vue": "^2.3.1",
+    "@js-preview/docx": "^1.6.2",
+    "@vue-office/docx": "^1.6.2",
    "@vueuse/core": "^10.6.1",
    "axios": "^1.6.2",
    "element-plus": "^2.4.3",
@ -28,6 +30,7 @@
    "vite-plugin-html": "^3.2.0",
    "vite-plugin-zip-file": "^2.2.0",
    "vue": "^3.3.4",
+    "vue-demi": "^0.14.10",
    "vue-qrcode": "^2.2.2",
    "vue-router": "^4.2.5"
  },
@ -46,4 +49,4 @@
    "vite": "^4.4.11",
    "vue-tsc": "^1.8.19"
  }
-}
+}
--- a/src/views/cart/index.vue
+++ b/src/views/cart/index.vue
@ -173,47 +173,13 @@
        </div>

        <div class="protocol-handle" v-if="cardList.length > 0">
-            <el-row style="margin: 15px 0">
-                <el-col :span="24">
-                    <el-collapse v-model="activeNames">
-                        <el-collapse-item :title="addressTitle" name="1">
-                            <template v-if="addressList.length > 0">
-                                <div
-                                    :key="index"
-                                    class="address-item"
-                                    @click="onSelectAddress(item.addressName)"
-                                    v-for="(item, index) in addressList"
-                                >
-                                    {{ item.addressName }}
-                                </div>
-                            </template>
-
-                            <template v-else>
-                                <div style="width: 100%; text-align: center; font-size: 14px">
-                                    当前没有收货地址...
-                                    <a
-                                        style="
-                                            color: #00a288;
-                                            cursor: pointer;
-                                            margin-left: 5px;
-                                            text-decoration: underline;
-                                        "
-                                        @click="onAddAddress"
-                                    >
-                                        点击新增
-                                    </a>
-                                </div>
-                            </template>
-                        </el-collapse-item>
-                    </el-collapse>
-                </el-col>
-            </el-row>
            <el-row style="display: flex; align-items: center">
                <el-col :span="16">
                    <div class="checkbox-container">
                        <el-checkbox v-model="protocolChecked">
                            我已阅读并同意签署
-                            <a href="#"> 《xxxx公司租赁服务合同》 </a>
+                            
+                            <a @click="handleViewWord"> 《xxxx公司租赁服务合同》 </a>
                        </el-checkbox>
                    </div>
                </el-col>
@ -249,6 +215,29 @@
    </div>

    <FooterInfo />
+
+    <!-- 租赁协议 -->
+    <el-dialog
+        v-model="dialogFormVisibleSettleWord"
+        :title="settleWordTitle"
+        width="50%"
+        align-center
+        destroy-on-close
+        :close-on-click-modal="false"
+    >
+        <!-- <div style="display: flex; justify-content: center"> -->
+            <!-- <img src="@/assets/img/zuLin.png" style="width: 100%; height: 600px" /> -->
+        <!-- </div> -->
+        <div style="display: flex; justify-content: flex-end;margin-bottom: 10px;">
+                <span class="dialog-footer" >
+                    <el-button type="primary" @click="dialogFormVisibleSettleWord = false"
+                        >关 闭</el-button
+                    >
+                    <el-button @click="submitBtn" type="success"> 下载 </el-button>
+                </span>
+        </div>
+        <div id ="mmm" style="height:600px;"></div>
+    </el-dialog>
 </template>

 <script setup lang="ts">
@ -264,17 +253,15 @@ import {
 import moment, { max } from 'moment'
 import { InfoFilled } from '@element-plus/icons-vue'
 import CustomDatePickerButton from './components/date-picker-button.vue'
-import { getAddressListApi } from 'http/api/address-manage/index'
 import { useRoute, useRouter } from 'vue-router'
 import { useStore } from '../../store/user'
+import jsPreviewDocx from "@js-preview/docx";
+import "@js-preview/docx/lib/index.css";
 const userStore = useStore()
 const router = useRouter()
 const protocolChecked = ref<boolean>(false)
 const allKey = ref(0)
 const cardList = ref<any>([])
-const activeNames = ref('')
-const addressTitle = ref('请选择收货地址')
-const addressList = ref<any>([])
 const getBookCarDetailsData = async () => {
    const res: any = await getBookCarDetailsApi()

@ -449,14 +436,6 @@ const onCartSubmit = async () => {
        })
        return
    }
-    if (addressTitle.value === '请选择收货地址') {
-        ElMessage({
-            showClose: false,
-            message: '请选择收货地址',
-            type: 'error',
-        })
-        return
-    }

    let isDays = false
    try {
@ -508,7 +487,6 @@ const onCartSubmit = async () => {
        })
        paramsList[index] = {
            cost: 0,
-            address: addressTitle.value.split('：')[1],
            detailsList: itemsArray,
        }
    })
@ -544,31 +522,33 @@ const onCartSubmit = async () => {
    // console.log(res, '预约车提交结果')
 }

-// 获取收货地址
-const getReceiptGoodsAddress = async () => {
-    const res: any = await getAddressListApi({})
-    addressList.value = res.rows.map((e: any) => {
-        return {
-            addressName: `${e.provinceName}${e.cityName}${e.areaName}${e.address}`,
-        }
-    })
-}
-// 选择收货地址
-const onSelectAddress = (address: any) => {
-    addressTitle.value = '收货地址：' + address
-    activeNames.value = ''
-}
-// 去往地址管理
-const onAddAddress = () => {
-    userStore.editcurrentMenuItem('address-manage')
+const wordUrl = ref("")
+const settleWordTitle = ref('')
+const dialogFormVisibleSettleWord: any = ref(false)
+//租赁服务合同
+const handleViewWord = async() => {
+    settleWordTitle.value = '租赁服务合同'
+    // const orderId = row.orderId
+    // const res: any = await getContractDetailApi({ orderId })
+    // 打开租赁服务合同弹框
+      wordUrl.value = "http://127.0.0.1:29300/statics/2024/12/16/test_20241216154423A003.docx"
+    dialogFormVisibleSettleWord.value = true
    setTimeout(() => {
-        router.push({
-            name: 'my-user',
+  const myDocxPreviewer = jsPreviewDocx.init(document.getElementById("mmm"));
+    //传递要预览的文件地址即可
+    myDocxPreviewer
+        .preview(
+        wordUrl.value
+        )
+        .then((res) => {
+        console.log("预览完成");
        })
-    }, 500)
+        .catch((e) => {
+            console.log('1111', wordUrl.value)
+        console.log("预览失败", e);
+        });
+    }, 1000);
 }
-
-getReceiptGoodsAddress()
 </script>

 <style lang="scss" scoped>
@ -682,13 +662,4 @@ getReceiptGoodsAddress()
        }
    }
 }
-
-.address-item {
-    margin: 0 auto;
-    padding: 6px 10px;
-    cursor: pointer;
-}
-.address-item:hover {
-    background-color: #c9e7e5;
-}
 </style>
--- a/src/views/user/orderManagement/components/order-home.vue
+++ b/src/views/user/orderManagement/components/order-home.vue
@ -13,6 +13,8 @@ import { useStore } from 'store/user'
 import type { FormInstance } from 'element-plus'
 const store = useStore()
 import { mainStore } from 'store/main'
+import jsPreviewDocx from "@js-preview/docx";
+import "@js-preview/docx/lib/index.css";
 const store2 = mainStore()

 const overhaulDetails = ref<any>({})
@ -320,12 +322,12 @@ const tableData4: any = ref([
    },
 ])

+const wordUrl = ref("")
 const settleWordTitle = ref('')
 const dialogFormVisibleSettleWord: any = ref(false)
 //租赁协议
-const handleViewWord = () => {
+const handleViewWord = async(index: Number, row: any) => {
    settleWordTitle.value = '租赁协议'
-    console.log(12313131)
    moneyParams1.value = {
        /* 设备状态 */
        maStatus: 15,
@ -333,10 +335,33 @@ const handleViewWord = () => {
        insureList: [],
        picList: [],
    }
+    const orderId = row.orderId
+    // const res: any = await getContractDetailApi({ orderId })
+    // cardList.value = res.rows
+
    // 打开租赁协议弹框
+      wordUrl.value = "http://127.0.0.1:29300/statics/2024/12/16/test_20241216154423A003.docx"
    dialogFormVisibleSettleWord.value = true
+    setTimeout(() => {
+  const myDocxPreviewer = jsPreviewDocx.init(document.getElementById("mmm"));
+    //传递要预览的文件地址即可
+    myDocxPreviewer
+        .preview(
+        wordUrl.value
+        )
+        .then((res) => {
+        console.log("预览完成");
+        })
+        .catch((e) => {
+            console.log('1111', wordUrl.value)
+        console.log("预览失败", e);
+        });
+    }, 1000);
 }

+// 下载合同为 Word 文件
+const downloadContract = () => {}
+
 const confirmFail = async (index: number) => {
    ElMessageBox.confirm('是否确定取消订单？', {
        confirmButtonText: '确定',
@ -730,7 +755,7 @@ const costSubmit = () => {
                            >
                                订单详情
                            </el-button>
-                            <el-button @click="handleViewWord(j)" type="primary" size="small">
+                            <el-button @click="handleViewWord(j,item)" type="primary" size="small">
                                租赁协议
                            </el-button>

@ -1291,17 +1316,18 @@ const costSubmit = () => {
        destroy-on-close
        :close-on-click-modal="false"
    >
-        <div style="display: flex; justify-content: center">
-            <img src="@/assets/img/zuLin.png" style="width: 100%; height: 600px" />
+        <!-- <div style="display: flex; justify-content: center"> -->
+            <!-- <img src="@/assets/img/zuLin.png" style="width: 100%; height: 600px" /> -->
+        <!-- </div> -->
+        <div style="display: flex; justify-content: flex-end;margin-bottom: 10px;">
+                <span class="dialog-footer" >
+                    <el-button type="primary" @click="dialogFormVisibleSettleWord = false"
+                        >关 闭</el-button
+                    >
+                    <el-button @click="downloadContract" type="success"> 下载 </el-button>
+                </span>
        </div>
-        <template #footer>
-            <span class="dialog-footer">
-                <el-button type="primary" @click="dialogFormVisibleSettleWord = false"
-                    >关 闭</el-button
-                >
-                <el-button @click="submitBtn" type="success"> 下载 </el-button>
-            </span>
-        </template>
+        <div id ="mmm" style="height:600px;"></div>
    </el-dialog>
 </template>

--- a/src/views/user/orderManagementCz/components/order-home.vue
+++ b/src/views/user/orderManagementCz/components/order-home.vue
@ -18,6 +18,8 @@ import type { FormInstance } from 'element-plus'
 import { useStore } from 'store/user'
 const store = useStore()
 import { mainStore } from 'store/main'
+import jsPreviewDocx from "@js-preview/docx";
+import "@js-preview/docx/lib/index.css";
 const store2 = mainStore()
 /* 查询参数 ***
 ****
@ -625,11 +627,25 @@ const handleViewWord = async (index: Number, row: any) => {
    }
    const orderId = row.orderId
    const res: any = await getContractDetailApi({ orderId })
-    cardList.value = res.rows
-    total.value = res.total
-    wordUrl.value = 'http://127.0.0.1:29300/statics/2024/12/13/合同模板2_20241213133604A002.doc'
+    // cardList.value = res.rows
    // 打开租赁协议弹框
+      wordUrl.value = res.data.url
    dialogFormVisibleSettleWord.value = true
+    setTimeout(() => {
+  const myDocxPreviewer = jsPreviewDocx.init(document.getElementById("mmm"));
+    //传递要预览的文件地址即可
+    myDocxPreviewer
+        .preview(
+        wordUrl.value
+        )
+        .then((res) => {
+        console.log("预览完成");
+        })
+        .catch((e) => {
+            console.log('1111', wordUrl.value)
+        console.log("预览失败", e);
+        });
+    }, 1000);
 }

 const contract = ref({
@ -639,9 +655,13 @@ const contract = ref({
 })

 // 下载合同为 Word 文件
-const downloadContract = () => {}
+const downloadContract = () => {
+    window.location.href = wordUrl.value;
+}
+
+const wordUrl = ref("")
+

-const wordUrl = ref('')
 </script>

 <template>
@ -1866,17 +1886,17 @@ const wordUrl = ref('')
        :close-on-click-modal="false"
    >
        <!-- <div style="display: flex; justify-content: center"> -->
-        <!-- <img src="@/assets/img/zuLin.png" style="width: 100%; height: 600px" /> -->
-        <iframe :src="wordUrl" width="100%" height="501px"></iframe>
+            <!-- <img src="@/assets/img/zuLin.png" style="width: 100%; height: 600px" /> -->
        <!-- </div> -->
-        <template #footer>
-            <span class="dialog-footer">
-                <el-button type="primary" @click="dialogFormVisibleSettleWord = false"
-                    >关 闭</el-button
-                >
-                <el-button @click="submitBtn" type="success"> 下载 </el-button>
-            </span>
-        </template>
+        <div style="display: flex; justify-content: flex-end;margin-bottom: 10px;">
+                <span class="dialog-footer" >
+                    <el-button type="primary" @click="dialogFormVisibleSettleWord = false"
+                        >关 闭</el-button
+                    >
+                    <el-button @click="downloadContract" type="success"> 下载 </el-button>
+                </span>
+        </div>
+        <div id ="mmm" style="height:600px;"></div>
    </el-dialog>
 </template>

@ -2259,4 +2279,8 @@ const wordUrl = ref('')
        }
    }
 }
+#mmm{
+    width:100%;
+    height: 500px;
+}
 </style>