Commit 84f6449d by liangjianmin

update: 更新合同页面样式,添加电子签名区域并优化合同详情展示

parent 7b8aaa33
Showing with 43 additions and 47 deletions
...@@ -34,52 +34,64 @@ ...@@ -34,52 +34,64 @@
<el-select v-model="selectedLang" placeholder="" style="margin-left:10px;width: 5%;"> <el-select v-model="selectedLang" placeholder="" style="margin-left:10px;width: 5%;">
<el-option v-for="option in langOptions" :label="option.label" :value="option.value" :key="option.value"></el-option> <el-option v-for="option in langOptions" :label="option.label" :value="option.value" :key="option.value"></el-option>
</el-select> </el-select>
</div> </div>
<div class="data-box th-all" style="margin-bottom:20px;"> <div class="data-box th-all" style="margin-bottom:20px;">
<el-table :data="contractData" border> <el-table :data="contractData" border>
<el-table-column prop="languageType" label="语言" min-width="30"></el-table-column> <el-table-column prop="languageType" label="语言" width="50"></el-table-column>
<el-table-column prop="contractSn" label="合同编号" min-width="100"></el-table-column> <el-table-column prop="contractSn" label="合同编号" width="156" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="contractBuildTime" label="生成时间" min-width="80"></el-table-column> <el-table-column label="合同附件" min-width="100">
<el-table-column label="合同附件" min-width="150">
<template slot-scope="scope"> <template slot-scope="scope">
<el-link v-if="scope.row.contractFileUrl!=''" :href=" scope.row.contractFileUrl " target="_blank">{{ scope.row.contractFileUrl }}</el-link> <el-link v-if="scope.row.contractFileUrl!=''" :href=" scope.row.contractFileUrl " target="_blank">查看</el-link>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="contractReturnDate" label="回传时间" width="150"></el-table-column> <el-table-column prop="contractBuildTime" label="生成时间" width="160"></el-table-column>
<el-table-column prop="createName" label="上传人" width="120"></el-table-column> <el-table-column prop="createName" label="上传人" width="160"></el-table-column>
<el-table-column fixed="right" label="操作" width="150" align="center"> <el-table-column prop="contractReturnDate" label="回传时间" width="160"></el-table-column>
<el-table-column prop="sign_time_val" label="签署时间" width="160"></el-table-column>
<el-table-column prop="sign_status_val" label="签署状态" width="160"></el-table-column>
<el-table-column prop="statusValue" label="状态" width="80">
<template slot-scope="scope"> <template slot-scope="scope">
<!-- 订单状态不是“完成,作废”,合同状态为有效 --> <template v-if="scope.row.status == -1">
<span>{{ scope.row.statusValue }}</span>
<!-- 采购组织为“深贸电子”时,下载猎芯合同有中文,英文两种选择;列表有中文,英文两行,列表按钮分别为“上传PI,上传合同” --> <el-tooltip :aa="scope" class="item" effect="dark" placement="top-start">
<div v-if="infos.company_id==2 && infos.status!=4 && infos.status!=-3 && scope.row.status ==1"> <i class="el-icon-question" style="color:#ff7e11;margin-left:5px;cursor:pointer;font-size:16px;"></i>
<el-button type="primary" v-if=" scope.row.contractFileUrl!='' " @click="delContract(scope.row)"> <div slot="content">{{ scope.row.invalidate_reason }}</div>
<span>删除合同</span> </el-tooltip>
</template>
<span v-else>{{ scope.row.statusValue }}</span>
</template>
</el-table-column>
<el-table-column prop="expire_time_val" label="失效时间" width="145"></el-table-column>
<el-table-column prop="contract_type_val" label="类型" width="120"></el-table-column>
<el-table-column fixed="right" label="操作" width="200" align="center">
<template slot-scope="scope">
<el-row>
<template v-if="infos.company_id == 2 && infos.status != 4 && infos.status != -3 && scope.row.status == 1">
<el-button v-if="scope.row.contractFileUrl" type="primary" @click="delContract(scope.row)">
<span>删除</span>
</el-button> </el-button>
<el-upload v-else-if=" scope.row.languageType=='中文' " :headers="{ Authorization: 'Bearer ' + token }" :data="{supplier_id:supplier_id,contract_id:scope.row.contractId,type:'upload'}" :action="uploadUrl" :on-success="handleUploadSuccess"> <el-upload v-else-if="scope.row.languageType=='中文'" :headers="{ Authorization: 'Bearer ' + token }" :data="{supplier_id:supplier_id,contract_id:scope.row.contractId,type:'upload'}" :action="uploadUrl" :on-success="handleUploadSuccess">
<el-button type="primary">上传PI</el-button> <el-button type="primary">上传PI</el-button>
</el-upload> </el-upload>
<el-upload v-else-if=" scope.row.languageType=='英文' " :headers="{ Authorization: 'Bearer ' + token }" :data="{supplier_id:supplier_id,contract_id:scope.row.contractId,type:'upload'}" :action="uploadUrl" :on-success="handleUploadSuccess"> <el-upload v-else-if="scope.row.languageType=='英文'" :headers="{ Authorization: 'Bearer ' + token }" :data="{supplier_id:supplier_id,contract_id:scope.row.contractId,type:'upload'}" :action="uploadUrl" :on-success="handleUploadSuccess">
<el-button type="primary">上传合同</el-button> <el-button type="primary">上传合同</el-button>
</el-upload> </el-upload>
</div> </template>
<template v-else>
<!-- 采购组织为“猎芯科技”时,下载猎芯合同只能选择中文,列表也只有中文一行,列表按钮为“上传合同” --> <el-button v-if="scope.row.contractFileUrl" type="primary" @click="delContract(scope.row)">
<div v-if="infos.company_id==1 && infos.status!=4 && infos.status!=-3 && scope.row.status ==1"> <span>删除</span>
<el-button type="primary" v-if=" scope.row.contractFileUrl!='' " @click="delContract(scope.row)">
<span>删除合同</span>
</el-button> </el-button>
<el-upload v-else-if=" scope.row.languageType=='中文' " :headers="{ Authorization: 'Bearer ' + token }" :data="{supplier_id:supplier_id,contract_id:scope.row.contractId,type:'upload'}" :action="uploadUrl" :on-success="handleUploadSuccess"> <el-upload v-else-if="scope.row.languageType=='中文'" :headers="{ Authorization: 'Bearer ' + token }" :data="{supplier_id:supplier_id,contract_id:scope.row.contractId,type:'upload'}" :action="uploadUrl" :on-success="handleUploadSuccess">
<el-button type="primary">上传合同</el-button> <el-button type="primary">上传合同</el-button>
</el-upload> </el-upload>
</div> <el-button type="primary">签署合同</el-button>
</template>
</el-row>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<!-- 型号明细 -->
<div class="xktitle" style="margin-bottom:20px;">型号明细</div> <div class="xktitle" style="margin-bottom:20px;">型号明细</div>
<div class="data-box th-all" v-if="tableData"> <div class="data-box th-all" v-if="tableData">
<el-table :data="tableData" border> <el-table :data="tableData" border>
...@@ -103,13 +115,12 @@ ...@@ -103,13 +115,12 @@
import Vue from 'vue'; import Vue from 'vue';
import Tool from '../../tool' import Tool from '../../tool'
import Menu from "@/components/menu.vue"; import Menu from "@/components/menu.vue";
import {Col, Message, Pagination, Row, Table, TableColumn, Select, Option, Link, Upload} from 'element-ui'; import {Col, Message, Pagination, Row, Table, TableColumn, Select, Option, Link, Upload, Tooltip} from 'element-ui';
import axios from 'axios';
import {NODE_ENVS} from "../../ajax"; import {NODE_ENVS} from "../../ajax";
Vue.prototype.$message = Message; Vue.prototype.$message = Message;
Vue.use(Pagination); Vue.use(Pagination);
Vue.use(TableColumn).use(Table).use(Row).use(Col).use(Select).use(Option).use(Link).use(Upload); Vue.use(TableColumn).use(Table).use(Row).use(Col).use(Select).use(Option).use(Link).use(Upload).use(Tooltip);
export default { export default {
name: "orderTrackGoodsDetail", name: "orderTrackGoodsDetail",
data() { data() {
...@@ -122,7 +133,6 @@ export default { ...@@ -122,7 +133,6 @@ export default {
contractData: [], contractData: [],
langOptions: [], langOptions: [],
selectedLang: '', selectedLang: '',
uploadUrl: NODE_ENVS + '/api/purContract/updateOrderContract', uploadUrl: NODE_ENVS + '/api/purContract/updateOrderContract',
fileData: { fileData: {
token: this.token, token: this.token,
...@@ -149,15 +159,12 @@ export default { ...@@ -149,15 +159,12 @@ export default {
}, },
methods: { methods: {
getData(id) { getData(id) {
this.$http('post', "/api/purchase/purOrderDetail", { this.$http('post', "/api/purchase/purOrderDetail", { id: id }).then(res => {
id: id
}).then(res => {
console.log(res); console.log(res);
if (res.code === 0) { if (res.code === 0) {
this.infos = res.data.purchase_info; this.infos = res.data.purchase_info;
this.tableData = res.data.purchase_item_list || []; this.tableData = res.data.purchase_item_list || [];
this.contractData = res.data.pur_contract_list || []; this.contractData = res.data.pur_contract_list || [];
// 1猎芯科技,2深茂电子 // 1猎芯科技,2深茂电子
if (this.infos.company_id == 1) { if (this.infos.company_id == 1) {
this.langOptions = [ this.langOptions = [
...@@ -171,7 +178,6 @@ export default { ...@@ -171,7 +178,6 @@ export default {
]; ];
this.selectedLang = 2; this.selectedLang = 2;
} }
} else { } else {
this.$message({ this.$message({
message: res.msg, message: res.msg,
...@@ -180,7 +186,6 @@ export default { ...@@ -180,7 +186,6 @@ export default {
} }
}) })
}, },
handleUploadSuccess(file, fileList) { handleUploadSuccess(file, fileList) {
if (file.code === 0) { if (file.code === 0) {
this.$message({ this.$message({
...@@ -195,12 +200,8 @@ export default { ...@@ -195,12 +200,8 @@ export default {
}); });
} }
}, },
//下载猎芯合同 //下载猎芯合同
downloadContract() { downloadContract() {
// var that = this;
console.log(this.selectedLang);
let pdf_url = "" let pdf_url = ""
if (this.selectedLang == 1) { if (this.selectedLang == 1) {
pdf_url = "/api/purContract/pdf"; pdf_url = "/api/purContract/pdf";
...@@ -211,19 +212,14 @@ export default { ...@@ -211,19 +212,14 @@ export default {
if (this.selectedLang == 3) { if (this.selectedLang == 3) {
pdf_url = "/api/purContract/pdfUs"; pdf_url = "/api/purContract/pdfUs";
} }
this.$http('get', pdf_url, { id: this.$route.query.purchase_id }, true, 'blob').then(res => {
this.$http('get', pdf_url, {
id: this.$route.query.purchase_id
}, true, 'blob').then(res => {
// 包装成 Blob 对象 // 包装成 Blob 对象
const blob = new Blob([res], { type: 'application/pdf' }); const blob = new Blob([res], { type: 'application/pdf' });
// 创建 URL 对象 // 创建 URL 对象
let pdfUrl = window.URL.createObjectURL(blob); let pdfUrl = window.URL.createObjectURL(blob);
window.open(pdfUrl, '_blank'); window.open(pdfUrl, '_blank');
}) })
}, },
// 3 删除合同 // 3 删除合同
delContract(contractItem) { delContract(contractItem) {
this.$http('post', "/api/purContract/updateOrderContract", { this.$http('post', "/api/purContract/updateOrderContract", {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment