租赁协议

This commit is contained in:
hongchao 2024-12-16 17:57:28 +08:00
parent 1baeed8e2e
commit 24b016d69d
5 changed files with 6279 additions and 29 deletions

6143
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -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"
},

View File

@ -178,7 +178,8 @@
<div class="checkbox-container">
<el-checkbox v-model="protocolChecked">
我已阅读并同意签署
<a href="#"> xxxx公司租赁服务合同 </a>
<a @click="handleViewWord"> xxxx公司租赁服务合同 </a>
</el-checkbox>
</div>
</el-col>
@ -214,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">
@ -231,6 +255,8 @@ import { InfoFilled } from '@element-plus/icons-vue'
import CustomDatePickerButton from './components/date-picker-button.vue'
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)
@ -495,6 +521,34 @@ const onCartSubmit = async () => {
}
// console.log(res, '')
}
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(() => {
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);
}
</script>
<style lang="scss" scoped>

View File

@ -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: '确定',
@ -712,7 +737,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>
@ -1273,17 +1298,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>

View File

@ -13,6 +13,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()
/* ***
****
@ -620,11 +622,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({
@ -634,9 +650,13 @@ const contract = ref({
})
// Word
const downloadContract = () => {}
const downloadContract = () => {
window.location.href = wordUrl.value;
}
const wordUrl = ref("")
const wordUrl = ref('')
</script>
<template>
@ -1849,16 +1869,16 @@ const wordUrl = ref('')
>
<!-- <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>
<!-- </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>
@ -2240,4 +2260,8 @@ const wordUrl = ref('')
}
}
}
#mmm{
width:100%;
height: 500px;
}
</style>