You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
601 lines
20 KiB
601 lines
20 KiB
<!DOCTYPE html> |
|
<html lang="en"> |
|
|
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<meta http-equiv="X-UA-Compatible" content="ie=edge"> |
|
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> |
|
<title>新疆恒联能源有限公司</title> |
|
<link rel="shortcut icon" type="image/x-icon" href="./images/logo.png"> |
|
<link rel="stylesheet prefetch" href="./css/index.css"> |
|
<link rel="stylesheet prefetch" href="./css/layer.css"> |
|
|
|
<script src="./js/vue.min.js"></script> |
|
<script src="./js/jquery.js"></script> |
|
<script src="./js/currency.js"></script> |
|
<script src="./js/layer.js"></script> |
|
<style> |
|
html, |
|
body { |
|
background: #F6F5FB; |
|
} |
|
|
|
#index { |
|
padding-top: 90px; |
|
padding-bottom: 80px; |
|
} |
|
|
|
header { |
|
position: fixed; |
|
top: 0; |
|
left: 0; |
|
right: 0; |
|
box-sizing: border-box !important; |
|
height: 92px; |
|
background: #fff; |
|
border-bottom: 1px solid #bbb; |
|
align-items: flex-end !important; |
|
} |
|
|
|
.mian { |
|
max-width: 1200px; |
|
width: 100%; |
|
margin: 0 auto; |
|
} |
|
|
|
/* 头部 */ |
|
.logo { |
|
width: 300px; |
|
} |
|
|
|
.head_right { |
|
margin-left: 10%; |
|
} |
|
|
|
.head_right .head_li { |
|
margin: 0 40px; |
|
padding: 13px 0; |
|
border-bottom: 10px solid transparent; |
|
cursor: pointer; |
|
font-size: 22px; |
|
color: #fff; |
|
} |
|
|
|
.head_right .head_li.selected { |
|
border-color: #fff; |
|
} |
|
|
|
.head_div { |
|
height: 128px; |
|
} |
|
|
|
.head_right .search_div { |
|
border: 2px solid #2cb7ca; |
|
border-radius: 6px; |
|
height: 42px; |
|
width: 70%; |
|
} |
|
|
|
.head_right .search_div .search_input { |
|
height: 100%; |
|
} |
|
|
|
.head_right .search_div .search_input>img { |
|
width: 30px; |
|
margin: 0 16px; |
|
} |
|
|
|
.head_right .search_div .search_input>input { |
|
height: 100%; |
|
font-size: 15px; |
|
} |
|
|
|
.search_button { |
|
width: 100px; |
|
height: 100%; |
|
font-size: 18px; |
|
color: #fff; |
|
background: #2cb7ca; |
|
cursor: pointer; |
|
} |
|
|
|
.user_div { |
|
margin-left: 60px; |
|
align-items: flex-end; |
|
} |
|
|
|
.user_div span { |
|
font-weight: bold; |
|
font-size: 30px; |
|
color: #000; |
|
white-space: nowrap; |
|
} |
|
|
|
.user_div a { |
|
font-size: 14px; |
|
margin-left: 16px; |
|
color: #f00; |
|
white-space: nowrap; |
|
text-decoration: underline; |
|
} |
|
|
|
/* 内容 */ |
|
/* .center_div {} */ |
|
|
|
.bread { |
|
height: 40px; |
|
} |
|
|
|
.bread>a { |
|
text-decoration: underline; |
|
color: #f00; |
|
} |
|
|
|
.bread>span { |
|
margin-left: 6px; |
|
} |
|
|
|
.title_div { |
|
padding: 20px 30px; |
|
background-color: #fff; |
|
} |
|
|
|
.title_div .title { |
|
font-size: 32px; |
|
color: #000; |
|
margin-bottom: 20px; |
|
} |
|
|
|
.tag_ul .tag_li { |
|
height: 26px; |
|
padding: 0 10px; |
|
border-radius: 4px; |
|
background: #00D08E; |
|
font-size: 15px; |
|
color: #fff; |
|
margin-right: 8px; |
|
white-space: nowrap; |
|
|
|
} |
|
|
|
.tag_ul .tag_li.lv { |
|
background: #00D08E; |
|
} |
|
|
|
.tag_ul .tag_li.cheng { |
|
background: #FF8C1B; |
|
} |
|
|
|
.time { |
|
font-size: 20px; |
|
color: #333; |
|
} |
|
|
|
.center_div { |
|
margin-top: 10px; |
|
background: #fff; |
|
} |
|
|
|
.center_head { |
|
border-bottom: 1px solid #ebebeb; |
|
} |
|
|
|
.center_head .center_head_li { |
|
height: 45px; |
|
width: 240px; |
|
border-right: 1px solid #ebebeb; |
|
cursor: pointer; |
|
font-size: 16px; |
|
border-bottom: 2px solid #fff; |
|
} |
|
|
|
.center_head .center_head_li.selected { |
|
color: #2cb7ca; |
|
border-bottom: 2px solid #2cb7ca; |
|
} |
|
|
|
.information { |
|
padding: 20px 30px; |
|
} |
|
|
|
.information .information_title { |
|
font-size: 18px; |
|
margin-bottom: 20px; |
|
} |
|
|
|
.baseTable { |
|
width: 100%; |
|
} |
|
|
|
.baseTable table { |
|
width: 100%; |
|
} |
|
|
|
.baseTable table tr { |
|
border: 1px solid #EBEBEB; |
|
} |
|
|
|
.tab-type { |
|
border-right: 1px solid #EBEBEB; |
|
padding: 10px; |
|
width: 100px; |
|
background-color: #F4F4F9; |
|
color: #686868; |
|
} |
|
|
|
.tab-cont { |
|
border-right: 1px solid #EBEBEB; |
|
padding: 10px; |
|
width: 350px; |
|
font-size: 16px; |
|
color: #1d1d1d; |
|
line-height: 24px; |
|
position: relative; |
|
} |
|
|
|
.operation { |
|
position: fixed; |
|
bottom: 0; |
|
left: 0; |
|
width: 100%; |
|
height: 70px; |
|
background: #fff; |
|
box-shadow: -2px 0 20px rgba(0, 0, 0, .1); |
|
} |
|
|
|
.operation .button_ul>button { |
|
width: 180px; |
|
height: 45px; |
|
cursor: pointer; |
|
font-size: 18px; |
|
color: #fff; |
|
font-weight: bold; |
|
border-radius: 6px; |
|
margin: 0 20px; |
|
|
|
} |
|
|
|
.operation .button_ul>button.download { |
|
background-image: linear-gradient(90deg, #FF954F, #FF7215); |
|
} |
|
|
|
.operation .button_ul>button.upload { |
|
background: #00C99C; |
|
} |
|
|
|
.boox { |
|
position: relative; |
|
} |
|
|
|
.choice { |
|
position: absolute; |
|
top: 0px; |
|
bottom: 0px; |
|
right: 20px; |
|
width: 180px; |
|
height: 45px; |
|
opacity: 0; |
|
/* cursor: pointer; */ |
|
} |
|
</style> |
|
</head> |
|
|
|
<body> |
|
<div id="index"> |
|
<!-- 头部 --> |
|
<header class="flex_center header"> |
|
<div class="mian flex_between"> |
|
<a href="./index.html"><img class="logo" src="./images/logo.png" alt=""></a> |
|
<div class="flex_between head_right flex1"> |
|
<div class="search_div flex_center"> |
|
<div class="search_input flex_center flex1"> |
|
<img src="./images/search_icon.png" alt=""> |
|
<input class="flex1" type="text" placeholder="搜索内容"> |
|
</div> |
|
<div class="search_button flex_center"> |
|
搜索 |
|
</div> |
|
</div> |
|
|
|
<div class="user_div flex_center"> |
|
<span>{{userData.username}}</span> |
|
<a href="javaScript:void(0)" @click="escFun">退出</a> |
|
|
|
</div> |
|
</div> |
|
</div> |
|
</header> |
|
<section class=" "> |
|
<div class="bread flex_start flex_items mian"> |
|
<a class="flex_center" @click="Jump">列表</a> |
|
<span>></span> |
|
<span class="flex_center">招标公告</span> |
|
</div> |
|
</section> |
|
<section class="mian"> |
|
<div class="title_div "> |
|
<div class="title"> |
|
招标公告：{{tenderData.title}} |
|
</div> |
|
<div class="title_buttom flex_between"> |
|
<div class="tag_ul flex_center"> |
|
<div class="tag_li flex_center lv" v-if="tenderData.status === 1">投标结束</div> |
|
<div class="tag_li flex_center cheng" v-if="tenderData.status === 0">招标中</div> |
|
</div> |
|
<div class="time"> |
|
{{tenderData.create_time}} |
|
</div> |
|
</div> |
|
</div> |
|
</section> |
|
<section class="mian center_div"> |
|
<div class="center_head flex_start flex_items"> |
|
<div class="flex_center center_head_li " :class="{'selected': head_index == 1}" @click="head_index = 1"> |
|
公告摘要 |
|
</div> |
|
<div class="flex_center center_head_li" v-if="tenderData.tender" :class="{'selected': head_index == 2}" |
|
@click="head_index = 2"> |
|
公告正文 |
|
</div> |
|
</div> |
|
</section> |
|
<section class="mian center_div" v-if="head_index == 1"> |
|
<div class="information"> |
|
<div class="information_title"> |
|
基本信息 |
|
</div> |
|
<div class="baseTable"> |
|
<table> |
|
<tbody> |
|
<tr> |
|
<td class="tab-type">省份</td> |
|
<td class="tab-cont">{{tenderData.province}}</td> |
|
<td class="tab-type">城市</td> |
|
<td class="tab-cont">{{tenderData.city}}</td> |
|
</tr> |
|
<tr> |
|
<td class="tab-type">采购单位</td> |
|
<td class="tab-cont"> |
|
<div class="cont-cont">{{tenderData.purchase_unit}}</div> |
|
</td> |
|
<td class="tab-type" style="padding-right: 9px;">采购联系人</td> |
|
<td class="tab-cont"> |
|
<div class="cont-cont">{{tenderData.contact_person}}</div> |
|
</td> |
|
</tr> |
|
<tr> |
|
<td class="tab-type">采购电话</td> |
|
<td class="tab-cont"> |
|
<div class="cont-cont">{{tenderData.contact_person_tel}}</div> |
|
</td> |
|
<td class="tab-type " id="tdbudget">投标截止时间</td> |
|
<td class="tab-cont"> |
|
<div class="cont-cont">{{tenderData.open_bid_time}}</div> |
|
</td> |
|
</tr> |
|
|
|
</tbody> |
|
</table> |
|
</div> |
|
</div> |
|
<div class="information" v-if="tenderData.tender" style="display: none"> |
|
<div class="information_title"> |
|
中标信息 |
|
</div> |
|
<div class="baseTable"> |
|
<table> |
|
<tbody> |
|
<!-- <tr> |
|
<td class="tab-type">中标单位：</td> |
|
<td class="tab-cont">{{tenderData.tender.company}}</td> |
|
</tr>--> |
|
<tr> |
|
<td class="tab-type">中标金额(元)：</td> |
|
<td class="tab-cont"> |
|
<div class="cont-cont">{{tenderData.tender.tender_price}}</div> |
|
</td> |
|
</tr> |
|
</tbody> |
|
</table> |
|
</div> |
|
</div> |
|
</section> |
|
<section class="mian center_div" v-if="head_index == 2"> |
|
<div class="information"> |
|
<div class="information_title"> |
|
正文 |
|
</div> |
|
<div class="baseTable"> |
|
<table> |
|
<tbody> |
|
<tr> |
|
<td class="tab-type">项目名称：</td> |
|
<td class="tab-cont">{{tenderData.project_title}}</td> |
|
</tr> |
|
<tr> |
|
<td class="tab-type">项目所在地：</td> |
|
<td class="tab-cont">{{tenderData.project_address}}</td> |
|
</tr> |
|
<!-- <tr> |
|
<td class="tab-type">招标人：</td> |
|
<td class="tab-cont">{{tenderData.bidding_person}}</td> |
|
</tr>--> |
|
<tr> |
|
<td class="tab-type">开标时间：</td> |
|
<td class="tab-cont">{{tenderData.open_bid_time}}</td> |
|
</tr> |
|
<!-- <tr> |
|
<td class="tab-type">中标单位：</td> |
|
<td class="tab-cont">{{tenderData.tender.company}}</td> |
|
</tr>--> |
|
<!--<tr> |
|
<td class="tab-type">中标通知书：</td> |
|
<td class="tab-cont">2020/11/18</td> |
|
</tr> |
|
<tr> |
|
<td class="tab-type">中标价格：</td> |
|
<td class="tab-cont">{{tenderData.tender.tender_price}}</td> |
|
</tr>--> |
|
<tr> |
|
<td class="tab-type">采购人：</td> |
|
<td class="tab-cont">{{tenderData.contact_person}}</td> |
|
</tr> |
|
<tr> |
|
<td class="tab-type">联系电话：</td> |
|
<td class="tab-cont">{{tenderData.contact_person_tel}}</td> |
|
</tr> |
|
<tr> |
|
<td class="tab-type">其他信息：</td> |
|
<td class="tab-cont">XXX</td> |
|
</tr> |
|
</tbody> |
|
</table> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
|
|
<!-- 上传\下载按钮 --> |
|
<div v-if="tenderData.status === 0"> |
|
<section class="operation flex_center"> |
|
<div class="boox"> |
|
<div class="flex_center mian button_ul"> |
|
<button class="flex_center download" @click="TenderDownload">标书下载</button> |
|
<button class="flex_center upload" @click="Tenderupload"> |
|
<input type="file" class="choice" id="upload" accept=".xlsx*,.pdf*,image/*"> |
|
标书上传</button> |
|
|
|
</div> |
|
</div> |
|
</section> |
|
</div> |
|
|
|
|
|
</div> |
|
<script> |
|
var vm = new Vue({ |
|
el: '#index', |
|
data: { |
|
head_index: 1, |
|
id: "",//传进的id |
|
tenderData: {}, |
|
userData:false,//用户信息 |
|
uploadId: "",//上传标书的id |
|
}, |
|
watch: { |
|
|
|
}, |
|
computed: {// |
|
|
|
}, |
|
methods: { |
|
escFun() { |
|
REOVE(); |
|
window.open('./login.html') |
|
}, |
|
// 详情数据 |
|
TenderDetails() { |
|
let that = this; |
|
this.id = window.localStorage.getItem("id"); |
|
console.log(this.id) |
|
AJAX({ |
|
url: 'biding-details',//请求地址 |
|
method: 'get',//请求方法 |
|
data: { |
|
id: this.id, |
|
},//参数 |
|
token: true,//是否添加token |
|
is_loading: true,//是否显示加载框。 |
|
success: function (eve) { |
|
that.tenderData = eve.data |
|
console.log(that.tenderData, "招标详情"); |
|
|
|
},//请求成功 |
|
|
|
}) |
|
}, |
|
// 标书上传 |
|
Tenderupload() { |
|
document.getElementById('upload').addEventListener('change', function (event) { |
|
console.log(event, 111) |
|
let $file = event.target; |
|
let formData = new FormData(); |
|
let file = $file.files; |
|
formData = new FormData(); |
|
formData.append('excel*pdf*image', file[0]); |
|
|
|
$.ajax({ |
|
url: URL + '/upload-file', |
|
type: 'POST', |
|
dataType: 'json', |
|
data: formData, |
|
contentType: false, |
|
processData: false |
|
}).done(data => { |
|
// console.log(data) |
|
this.uploadId = data.data.id |
|
console.log(this.uploadId, "上传标书id") |
|
this.id = window.localStorage.getItem("id"); |
|
AJAX({ |
|
url: 'tender',//请求地址 |
|
method: 'post',//请求方法 |
|
data: { |
|
bidding_id: this.id, |
|
file_id: this.uploadId |
|
},//参数 |
|
token: true,//是否添加token |
|
is_loading: true,//是否显示加载框。 |
|
success: function (eve) { |
|
console.log(eve, "标书上传") |
|
layer.open({ |
|
content: '上传成功' |
|
, skin: 'msg' |
|
, time: 1.5 |
|
}); |
|
},//请求成功 |
|
}) |
|
|
|
}) |
|
.fail(data => { |
|
console.log(data); |
|
}); |
|
}); |
|
}, |
|
|
|
// 标书下载 |
|
TenderDownload() { |
|
if(!this.tenderData.file_download.download_url){ |
|
layer.open({ |
|
content: '没有标书文件' |
|
, skin: 'msg' |
|
, time: 1.5 |
|
}); |
|
return false; |
|
} |
|
window.location.href = URL_WEB + this.tenderData.file_download.download_url |
|
}, |
|
|
|
// 跳转到列表 |
|
Jump() { |
|
window.location.href = './index.html' |
|
} |
|
}, |
|
created() { |
|
this.Tenderupload(); |
|
}, |
|
mounted() { |
|
if (USER()) { |
|
this.userData = USER(); |
|
this.TenderDetails()//招标详情 |
|
} else { |
|
window.location.href='./login.html' |
|
} |
|
|
|
} |
|
}) |
|
|
|
</script> |
|
</body> |
|
|
|
</html> |