Skip to content

严立 / cd-bid

Go to a project
Commit 7b7f1087 by 严立
Options

竞价变更公告

parent b75bec94
Inline Side-by-side
Showing with 4534 additions and 4372 deletions
package-lock.json
This diff could not be displayed because it is too large.
package.json
{
"name": "merchant2.1.x",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "立 <236048639@qq.com>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
"dependencies": {
"babel-preset-es2015": "^6.24.1",
"crypto-js": "^4.0.0",
"downloadjs": "^1.4.7",
"element-ui": "^2.13.2",
"miment": "0.0.9",
"vue": "^2.6.11",
"vue-router": "^3.3.4"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-polyfill": "^6.26.0",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.4",
"font-spider": "^1.3.5",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"js-base64": "^2.6.2",
"less": "^3.11.3",
"less-loader": "^4.1.0",
"node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.26",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"postcss-url": "^7.2.1",
"rimraf": "^2.6.0",
"sass-resources-loader": "^2.0.3",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^0.5.8",
"vue-baidu-map": "^0.21.22",
"vue-cli-plugin-style-resources-loader": "^0.1.4",
"vue-loader": "^13.3.0",
"vue-pdf": "^4.1.0",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.6.11",
"vuex": "^3.5.1",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
{
"name": "merchant2.1.x",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "立 <236048639@qq.com>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
"dependencies": {
"babel-preset-es2015": "^6.24.1",
"crypto-js": "^4.0.0",
"downloadjs": "^1.4.7",
"element-ui": "^2.13.2",
"miment": "0.0.9",
"vue": "^2.6.11",
"vue-calendar-component": "^2.8.2",
"vue-router": "^3.3.4"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-polyfill": "^6.26.0",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.4",
"font-spider": "^1.3.5",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"js-base64": "^2.6.2",
"less": "^3.11.3",
"less-loader": "^4.1.0",
"node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.26",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"postcss-url": "^7.2.1",
"rimraf": "^2.6.0",
"sass-resources-loader": "^2.0.3",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^0.5.8",
"vue-baidu-map": "^0.21.22",
"vue-cli-plugin-style-resources-loader": "^0.1.4",
"vue-loader": "^13.3.0",
"vue-pdf": "^4.1.0",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.6.11",
"vuex": "^3.5.1",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
src/common/css/global.less
@maxWidth: 1200px;
@fontSizeBase: 12;
@fontSizeMultiple: 2;
@fontSize00: @fontSizeBase + @fontSizeMultiple * 0px; // 12px
@fontSize01: @fontSizeBase + @fontSizeMultiple * 1px; // 14px
@fontSize02: @fontSizeBase + @fontSizeMultiple * 2px; // 16px
@fontSize03: @fontSizeBase + @fontSizeMultiple * 3px; // 18px
@fontSize04: @fontSizeBase + @fontSizeMultiple * 4px; // 20px
@fontSize06: @fontSizeBase + @fontSizeMultiple * 6px; // 24px
@fontSize07: @fontSizeBase + @fontSizeMultiple * 7px; // 26px
@fontSize08: @fontSizeBase + @fontSizeMultiple * 8px; // 28px
@fontSize09: @fontSizeBase + @fontSizeMultiple * 9px; // 30px
@fontSize10: @fontSizeBase + @fontSizeMultiple * 10px; // 32px
@colorGrey00: #000000;
@colorGrey10: #1A1A1A;
@colorGrey20: #333333;
@colorGrey30: #4D4D4D;
@colorGrey40: #666666;
@colorGrey50: #808080;
@colorGrey60: #999999;
@colorGrey70: #B3B3B3;
@colorGrey80: #CCCCCC;
@colorGrey90: #E5E5E5;
@colorRed: #CF2F1D;
@colorBlue: #2575FA;
@colorGreen: #49B939;
@colorWhite: #FFFFFF;
@colorYellow: #EBA947;
@backgroundImageUrl: '~@/assets/bg-06.png';
// 页面正文宽度
.global-maxwidth {
width: @maxWidth;
max-width: @maxWidth;
}
// 单行文本超出省略
.global-overflow-ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.global-color-red { color: @colorRed; }
.global-color-blue { color: @colorBlue; }
.global-color-grey { color: @colorGrey60; }
.global-color-green { color: @colorGreen; }
.global-color-white { color: @colorWhite; }
.global-color-yellow { color: @colorYellow; }
// 禁用文本样式
.global-disable-font {
color: @colorGrey60 !important;
}
// 禁用背景样式
.global-disable {
background: @colorGrey60 !important;
}
// 置灰背景样式
.global-enable {
background: @colorBlue !important;
}
// 选中文本样式
.global-enable-font {
color: @colorBlue !important;
}
.global-none {
display: none !important;
}
.global-cursor {
cursor: pointer;
}
.global-hover:hover {
color: @colorBlue;
}
.global-routine-button {
width: 160px;
height: 52px;
margin: 0 40px !important;
border-radius: 26px;
border: 1px @colorBlue solid !important;
color: @colorBlue !important;
background: @colorWhite !important;
}
.global-routine-button:focus,
.global-routine-button:hover {
border: 1px @colorBlue solid !important;
color: @colorBlue !important;
background: @colorWhite !important;
}
.global-enable-button {
width: 160px;
height: 52px;
margin: 0 40px !important;
border-radius: 26px;
border: 1px @colorBlue solid !important;
color: @colorWhite !important;
background: @colorBlue !important;
}
.global-enable-button:focus,
.global-enable-button:hover {
border: 1px @colorBlue solid !important;
color: @colorWhite !important;
background: @colorBlue !important;
}
.global-disable-button {
width: 160px;
height: 52px;
margin: 0 40px !important;
border-radius: 26px;
border: 1px @colorGrey50 solid !important;
color: @colorWhite !important;
background: @colorGrey50 !important;
}
.global-disable-button:focus,
.global-disable-button:hover {
border: 1px @colorGrey50 solid !important;
color: @colorWhite !important;
background: @colorGrey50 !important;
}
// element-ui 自定样式
//按钮组件
.el-button:hover {
color: #000000;
border-color: #dcdfe6;
background-color: #ffffff;
}
// 文件上传组件清除渐变动画
.el-upload-list__item {
transition: none !important;
}
// 分页组件
.el-pagination {
display: flex;
flex-direction: row;
align-items: center;
.btn-prev,
.btn-next {
display: none;
}
> span {
display: inline-block;
height: 46px !important;
}
> span:nth-child(1) {
padding-top: 8px;
font-size: @fontSize02;
}
> span:nth-child(2) {
width: 136px;
height: 46px;
font-size: @fontSize02;
div,
input {
width: 136px;
height: 46px;
margin: 0 !important;
padding: 0 !important;
}
span {
font-size: @fontSize02;
}
.el-input__inner {
border: none;
font-size: @fontSize02 !important;
background: #f6f6f9;
}
}
.el-pager {
display: flex;
flex-direction: row;
.active {
color: #FFFFFF;
background: #CF2F1D !important;
}
.more,
.number {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 46px;
height: 46px;
margin: 0 4px;
padding: 0;
font-size: @fontSize02;
font-weight: 500;
}
.number {
background: #f6f6f9;
}
}
> span:nth-child(6) {
width: 130px;
font-size: @fontSize02;
.el-input {
margin: 0 8px 0 12px;
}
.el-input__inner {
width: 46px;
height: 46px;
font-size: @fontSize02;
}
}
@maxWidth: 1200px;
@fontSizeBase: 12;
@fontSizeMultiple: 2;
@fontSize00: @fontSizeBase + @fontSizeMultiple * 0px; // 12px
@fontSize01: @fontSizeBase + @fontSizeMultiple * 1px; // 14px
@fontSize02: @fontSizeBase + @fontSizeMultiple * 2px; // 16px
@fontSize03: @fontSizeBase + @fontSizeMultiple * 3px; // 18px
@fontSize04: @fontSizeBase + @fontSizeMultiple * 4px; // 20px
@fontSize06: @fontSizeBase + @fontSizeMultiple * 6px; // 24px
@fontSize07: @fontSizeBase + @fontSizeMultiple * 7px; // 26px
@fontSize08: @fontSizeBase + @fontSizeMultiple * 8px; // 28px
@fontSize09: @fontSizeBase + @fontSizeMultiple * 9px; // 30px
@fontSize10: @fontSizeBase + @fontSizeMultiple * 10px; // 32px
@colorGrey00: #000000;
@colorGrey10: #1A1A1A;
@colorGrey20: #333333;
@colorGrey30: #4D4D4D;
@colorGrey40: #666666;
@colorGrey50: #808080;
@colorGrey60: #999999;
@colorGrey70: #B3B3B3;
@colorGrey80: #CCCCCC;
@colorGrey90: #E5E5E5;
@colorRed: #CF2F1D;
@colorBlue: #2575FA;
@colorGreen: #49B939;
@colorWhite: #FFFFFF;
@colorYellow: #EBA947;
@backgroundImageUrl: '~@/assets/bg-06.png';
// 页面正文宽度
.global-maxwidth {
width: @maxWidth;
max-width: @maxWidth;
}
// 单行文本超出省略
.global-overflow-ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.global-color-red { color: @colorRed; }
.global-color-blue { color: @colorBlue; }
.global-color-grey { color: @colorGrey60; }
.global-color-green { color: @colorGreen; }
.global-color-white { color: @colorWhite; }
.global-color-yellow { color: @colorYellow; }
// 禁用文本样式
.global-disable-font {
color: @colorGrey60 !important;
}
// 禁用背景样式
.global-disable {
background: @colorGrey60 !important;
}
// 置灰背景样式
.global-enable {
background: @colorBlue !important;
}
// 选中文本样式
.global-enable-font {
color: @colorBlue !important;
}
.global-none {
display: none !important;
}
.global-cursor {
cursor: pointer;
}
.global-hover:hover {
color: @colorBlue;
}
.global-routine-button {
width: 160px;
height: 52px;
margin: 0 40px !important;
border-radius: 26px;
border: 1px @colorBlue solid !important;
color: @colorBlue !important;
background: @colorWhite !important;
}
.global-routine-button:focus,
.global-routine-button:hover {
border: 1px @colorBlue solid !important;
color: @colorBlue !important;
background: @colorWhite !important;
}
.global-enable-button {
width: 160px;
height: 52px;
margin: 0 40px !important;
border-radius: 26px;
border: 1px @colorBlue solid !important;
color: @colorWhite !important;
background: @colorBlue !important;
}
.global-enable-button:focus,
.global-enable-button:hover {
border: 1px @colorBlue solid !important;
color: @colorWhite !important;
background: @colorBlue !important;
}
.global-disable-button {
width: 160px;
height: 52px;
margin: 0 40px !important;
border-radius: 26px;
border: 1px @colorGrey50 solid !important;
color: @colorWhite !important;
background: @colorGrey50 !important;
}
.global-disable-button:focus,
.global-disable-button:hover {
border: 1px @colorGrey50 solid !important;
color: @colorWhite !important;
background: @colorGrey50 !important;
}
// element-ui 自定样式
//按钮组件
.el-button:hover {
color: #000000;
border-color: #dcdfe6;
background-color: #ffffff;
}
// 文件上传组件清除渐变动画
.el-upload-list__item {
transition: none !important;
}
// 分页组件
.el-pagination {
display: flex;
flex-direction: row;
align-items: center;
.btn-prev,
.btn-next {
display: none;
}
> span {
display: inline-block;
height: 46px !important;
}
> span:nth-child(1) {
padding-top: 8px;
font-size: @fontSize02;
}
> span:nth-child(2) {
width: 136px;
height: 46px;
font-size: @fontSize02;
div,
input {
width: 136px;
height: 46px;
margin: 0 !important;
padding: 0 !important;
}
span {
font-size: @fontSize02;
}
.el-input__inner {
border: none;
font-size: @fontSize02 !important;
background: #f6f6f9;
}
}
.el-pager {
display: flex;
flex-direction: row;
.active {
color: #FFFFFF;
background: #CF2F1D !important;
}
.more,
.number {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 46px;
height: 46px;
margin: 0 4px;
padding: 0;
font-size: @fontSize02;
font-weight: 500;
}
.number {
background: #f6f6f9;
}
}
> span:nth-child(6) {
width: 130px;
font-size: @fontSize02;
.el-input {
margin: 0 8px 0 12px;
}
.el-input__inner {
width: 46px;
height: 46px;
font-size: @fontSize02;
}
}
}
\ No newline at end of file
src/common/js/dictionary.js
let output = {
// 配置后台公告字典标识映射
// 避免后台更变数值影响逻辑
// - 全部
// 0 - 竞价报价
// 1 - 竞价结果
// 2 - 招标采购
// 3 - 资格预审
// 4 - 变更澄清
// 5 - 中标候选
// 6 - 招标结果
// 9 - 其他公告
noticeType: {
raw: ['', 1, 2, 5, 3, 4, 7, 8, 6],
mapping: ['', 2, 3, 4, 5, 6, 0, 1, 9],
}
}
let output = {
// 配置后台公告字典标识映射
// 避免后台更变数值影响逻辑
// - 全部
// 0 - 竞价报价
// 1 - 竞价结果
// 2 - 招标采购
// 3 - 资格预审
// 4 - 变更澄清
// 5 - 中标候选
// 6 - 招标结果
// 9 - 其他公告
// 10 - 竞价变更公告
noticeType: {
raw: ['', 1, 2, 5, 3, 4, 7, 9, 8, 6],
mapping: ['', 2, 3, 4, 5, 6, 0, 10, 1, 9],
}
}
export default output
\ No newline at end of file
src/common/js/host.js
let output = {
// 开发路径
// base: 'http://bid-server.meiqicloud.com/',
// resources: 'http://bid-web.meiqicloud.com/',
// agentSignIn: 'http://bid-vue.meiqicloud.com/'
// 测试环境
// base: '/Api/',
// resources: 'http://bid-web.meiqicloud.com',
// agentSignIn: 'http://bid-vue.meiqicloud.com/'
base: 'http://bid-server.meiqicloud.com/', // 开发路径
// base: '/Api/', // 部署路径
resources: 'http://bid-web.meiqicloud.com',
agentSignIn: 'http://bid-vue.meiqicloud.com/'
// 正式环境
base: '/Api/',
resources: 'https://www.fjbidding.com',
agentSignIn: 'https://www.fjbidding.com/admin/'
// base: '/Api/',
// resources: 'https://www.fjbidding.com',
// agentSignIn: 'https://www.fjbidding.com/admin/'
}
output.uploadFile = output.base + 'bid/common/webupload/upload'
......
src/components/notice-agency.vue
<template>
<!-- 信息模板 - 代理机构 -->
<div class="components-agency">
<div class="info">
<div class="info-item row align-c">
<span>招标代理机构：</span>
<span>{{componentAgency.name}}</span>
</div>
<div class="info-item row align-c">
<span>地址：</span>
<span>{{componentAgency.address}}</span>
</div>
<div class="info-item row align-c">
<span>联系人：</span>
<span>{{componentAgency.liaison}}</span>
</div>
<div class="info-item row align-c">
<span>联系电话：</span>
<span>{{componentAgency.phone}}</span>
</div>
<div class="info-item row align-c">
<span>邮箱：</span>
<span>{{componentAgency.email}}</span>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {
}
},
computed: {
componentAgency: function () {
return this.$store.state.componentAgency
},
},
}
</script>
<style lang="less">
.components-agency {
.info {
.info-item {
margin: 10px 0;
span:nth-child(1) {
min-width: 160px;
margin-right: 10px;
text-align: right;
font-size: @fontSize02;
}
span:nth-child(2) {
text-align: left;
font-size: @fontSize01;
}
}
}
}
</style>
<template>
<!-- 信息模板 - 代理机构 -->
<div class="components-agency">
<div class="info">
<div class="info-item row align-c">
<span>招标代理机构：</span>
<span>{{componentAgency.name}}</span>
</div>
<div class="info-item row align-c">
<span>地址：</span>
<span>{{componentAgency.address}}</span>
</div>
<div class="info-item row align-c">
<span>联系人：</span>
<span>{{componentAgency.liaison}}</span>
</div>
<div class="info-item row align-c">
<span>联系电话：</span>
<span>{{componentAgency.phone}}</span>
</div>
<div class="info-item row align-c">
<span>邮箱：</span>
<span>{{componentAgency.email}}</span>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {
}
},
computed: {
componentAgency: function () {
console.log('this.$store.state.componentAgency', this.$store.state.componentAgency)
return this.$store.state.componentAgency
},
},
}
</script>
<style lang="less">
.components-agency {
.info {
.info-item {
margin: 10px 0;
span:nth-child(1) {
min-width: 160px;
margin-right: 10px;
text-align: right;
font-size: @fontSize02;
}
span:nth-child(2) {
text-align: left;
font-size: @fontSize01;
}
}
}
}
</style>
src/components/notice-progress.vue
<template>
<!-- 信息模板 - 项目进度 -->
<div class="components-progress row align-c">
<div v-if="componentProject.noticeType !== 0" class="row">
<!-- 节点显示 -->
<div class="node row">
<div class="col con-c align-c">
<div class="node-point"></div>
<div class="node-name">{{progressNode[0].text}}</div>
<div class="node-time">{{progressNode[0].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState >= 2 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[1].text}}</div>
<div class="node-time">{{progressNode[1].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState > 3 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[2].text}}</div>
<div class="node-time">{{progressNode[2].time}}</div>
</div>
<div :style="'background-image: linear-gradient(to right, #CF2F1D 0%, #CF2F1D ' + progressWidth * progressState + '%, #FFFFFF ' + progressWidth * progressState + '%);'"></div>
</div>
<!-- 操作按钮 -->
<div v-if="componentProject.isOnline" class="operate row con-e align-c">
<div class="col con-c align-c">
<div v-if="operateText !== ''" class="operate-button">
<!-- 不含合同包的公告 -->
<button v-if="progressState === 2 && !componentProject.isPackage && !operateIsBuy" class="global-enable" @click="onEntered()">立即报名</button>
<button v-if="progressState === 2 && !componentProject.isPackage && operateIsBuy" class="global-enable global-cursor" @click="onDocument()">下载标书</button>
<!-- 包含合同包的公告 -->
<button v-if="progressState === 2 && componentProject.isPackage" class="global-enable" @click="onEntered()">立即报名</button>
<button v-if="progressState === 3" class="global-disable" disabled>报名已截止</button>
<button v-if="progressState === 4" class="global-disable" disabled>报名已截止</button>
</div>
<div class="operate-tip">
<span v-if="progressState === 1">开始报名仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
<span v-if="progressState === 2 && !operateIsBuy">报名仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
</div>
<div v-if="progressState === 2 && componentProject.isPackage && operateIsBuy" class="operate-bid row align-c">
<span class="global-cursor" @click="onDocument()">下载标书</span>
</div>
</div>
</div>
</div>
<!-- 竞标公告进度样式 -->
<div v-if="[0].indexOf(componentProject.noticeType) >= 0" class="row">
<!-- 节点显示 -->
<div class="node row">
<div class="col con-c align-c">
<div class="node-point"></div>
<div class="node-name">{{progressNode[0].text}}</div>
<div class="node-time">{{progressNode[0].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState >= 2 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[1].text}}</div>
<div class="node-time">{{progressNode[1].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState > 3 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[2].text}}</div>
<div class="node-time">{{'　'}}</div>
</div>
<div :style="'background-image: linear-gradient(to right, #CF2F1D 0%, #CF2F1D ' + progressWidth * progressState + '%, #FFFFFF ' + progressWidth * progressState + '%);'"></div>
</div>
<!-- 操作按钮 -->
<div v-if="componentProject.isOnline" class="operate row con-e align-c">
<div class="col con-c align-c">
<img v-if="componentProject.noticeType === 0" class="operate-img" src="../assets/notice-bitton.png" alt="">
<div v-if="operateText !== ''" class="operate-button">
<button v-if="progressState === 2" class="global-enable" @click="onOffer()">立即报价</button>
<button v-if="progressState === 3" class="global-disable" disabled>报价已结束</button>
<button v-if="progressState === 4" class="global-disable" disabled>报价已结束</button>
</div>
<div class="operate-tip">
<span v-if="progressState === 1">距离报价开始仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
<span v-if="progressState === 2 && !operateIsBuy">报价仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import iMiment from 'miment'
import iTime from '@/common/js/time.js'
export default {
data () {
return {
detailsType: 0,
progressNode: [],
progressWidth: 25,
progressState: 1,
operateIsBuy: false,
operateDay: 0,
operateHour: 0,
operateText: '立即报名',
}
},
computed: {
componentProject: function () {
return this.$store.state.componentProject
},
componentProgress: function () {
return this.$store.state.componentProgress
}
},
watch: {
componentProject: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
},
componentProgress: {
handler: function (funcNewValue, funcOldValue) {
if (JSON.stringify(funcNewValue) !== '{}') {
console.log('mark', funcNewValue)
this.setProgressTime(funcNewValue)
this.setOperate(funcNewValue)
}
},
deep: true,
immediate: true,
}
},
created: function () {
this.progressNode = [
{ 'text': '　', 'time': '　' },
{ 'text': '　', 'time': '　' },
{ 'text': '　', 'time': '　' },
]
},
methods: {
/**
* 设置进度时间数据
* @function
* @param {object} funcProgressData - 进度原始数据
* @returns
*/
setProgressTime: function (funcProgressData) {
this.progressNode = [
{
text: funcProgressData.text[0],
time: iMiment(funcProgressData.timestamp[0]).format('YYYY-MM-DD hh:mm')
},
{
text: funcProgressData.text[1],
time: iMiment(funcProgressData.timestamp[1]).format('YYYY-MM-DD hh:mm') + ' - ' + iMiment(funcProgressData.timestamp[2]).format('YYYY-MM-DD hh:mm')
},
{
text: funcProgressData.text[2],
time: iMiment(funcProgressData.timestamp[3]).format('YYYY-MM-DD hh:mm')
},
]
if (this.componentProject.noticeType === 0) {
this.progressNode[2].time = '　'
}
},
/**
* 设置按钮数据
* @function
* @param {object} funcProgressData - 进度原始数据
* @returns
*/
setOperate: function (funcProgressData) {
// 计算进度状态
let funcIndex = 0
for (funcIndex; funcIndex < funcProgressData.timestamp.length; funcIndex++) {
if (iTime() < funcProgressData.timestamp[funcIndex]) {
break
}
}
this.progressState = funcIndex
// 计算剩余天数
let funcDistance = iMiment().distance(iTime(), funcProgressData.timestamp[funcIndex]).format('YYYY-MM-DD hh:mm:ss', true)
let funcRegExpDate = new RegExp('[0-9]+-[0-9]+-[0-9]+')
let funcDate = funcDistance.match(funcRegExpDate)[0].split('-')
let funcRegExpTime = new RegExp('[0-9]+:[0-9]+:[0-9]+')
let funcTime = funcDistance.match(funcRegExpTime)[0].split(':')
let funcReturn = {
year: funcDate[0],
month: funcDate[1],
day: funcDate[2],
hour: funcTime[0],
minute: funcTime[1],
second: funcTime[2],
}
this.operateDay = funcReturn.day
this.operateHour = parseInt(funcReturn.hour) + 1
// 设置其他状态
this.operateIsBuy = funcProgressData.isBuy
},
/**
* 报名
* @function
* @returns
*/
onEntered: function () {
// 公告为预览状态禁止操作
if (this.$route.query.preview) return
this.$emit('entered')
},
/**
* 下载标书
* @function
* @returns
*/
onDocument: function () {
console.log('onDocument')
// 公告为预览状态禁止操作
if (this.$route.query.preview) return
this.$emit('document')
},
onOffer: function () {
// 公告为预览状态禁止操作
if (this.$route.query.preview) return
this.$emit('offer')
},
}
}
</script>
<style lang="less">
.components-progress {
position: relative;
width: 100%;
background: #F2F2F2;
.node {
position: relative;
.node-point {
width: 24px;
height: 24px;
margin-bottom: 8px;
border-radius: 50%;
border: 2px #FFFFFF solid;
background: #CF2F1D;
}
.node-point-unactive {
width: 24px;
height: 24px;
margin-bottom: 8px;
border-radius: 50%;
border: 2px #FFFFFF solid;
background: #E5E5E5;
}
.node-name {
margin-bottom: 4px;
font-size: @fontSize02;
}
.node-time {
margin-bottom: 4px;
font-size: @fontSize01;
}
> div:nth-child(1) {
z-index: 5;
width: 210px;
height: 120px;
}
> div:nth-child(2) {
z-index: 5;
width: 380px;
height: 120px;
}
> div:nth-child(3) {
z-index: 5;
width: 210px;
height: 120px;
}
> div:nth-child(4) {
z-index: 0;
position: absolute;
top: 24px;
left: 100px;
width: 600px;
height: 12px;
background: #FFFFFF;
border: 2px #FFFFFF solid;
}
}
.operate {
width: 340px;
> div {
margin-right: 40px;
.operate-img {
z-index: 0;
position: absolute;
top: 0;
right: 0;
}
.operate-button {
z-index: 5;
margin-bottom: 8px;
}
.operate-tip {
z-index: 5;
}
span {
margin-top: 6px;
font-size: @fontSize01;
}
}
button {
width: 160px;
height: 50px;
border-radius: 25px;
border: none;
color: #FFFFFF;
font-size: @fontSize02;
}
}
}
</style>
<template>
<!-- 信息模板 - 项目进度 -->
<div class="components-progress row align-c">
<div v-if="componentProject.noticeType !== 0" class="row">
<!-- 节点显示 -->
<div class="node row">
<div class="col con-c align-c">
<div class="node-point"></div>
<div class="node-name">{{progressNode[0].text}}</div>
<div class="node-time">{{progressNode[0].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState >= 2 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[1].text}}</div>
<div class="node-time">{{progressNode[1].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState > 3 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[2].text}}</div>
<div class="node-time">{{progressNode[2].time}}</div>
</div>
<div :style="'background-image: linear-gradient(to right, #CF2F1D 0%, #CF2F1D ' + progressWidth * progressState + '%, #FFFFFF ' + progressWidth * progressState + '%);'"></div>
</div>
<!-- 操作按钮 -->
<div v-if="componentProject.isOnline" class="operate row con-e align-c">
<div class="col con-c align-c">
<div v-if="operateText !== ''" class="operate-button">
<!-- 不含合同包的公告 -->
<button v-if="progressState === 2 && !componentProject.isPackage && !operateIsBuy" class="global-enable" @click="onEntered()">立即报名</button>
<button v-if="progressState === 2 && !componentProject.isPackage && operateIsBuy" class="global-enable global-cursor" @click="onDocument()">下载标书</button>
<!-- 包含合同包的公告 -->
<button v-if="progressState === 2 && componentProject.isPackage" class="global-enable" @click="onEntered()">立即报名</button>
<button v-if="progressState === 3" class="global-disable" disabled>报名已截止</button>
<button v-if="progressState === 4" class="global-disable" disabled>报名已截止</button>
</div>
<div class="operate-tip">
<span v-if="progressState === 1">开始报名仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
<span v-if="progressState === 2 && !operateIsBuy">报名仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
</div>
<div v-if="progressState === 2 && componentProject.isPackage && operateIsBuy" class="operate-bid row align-c">
<span class="global-cursor" @click="onDocument()">下载标书</span>
</div>
</div>
</div>
</div>
<!-- 竞标公告进度样式 -->
<div v-if="[0].indexOf(componentProject.noticeType) >= 0" class="row">
<!-- 节点显示 -->
<div class="node row">
<div class="col con-c align-c">
<div class="node-point"></div>
<div class="node-name">{{progressNode[0].text}}</div>
<div class="node-time">{{progressNode[0].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState >= 2 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[1].text}}</div>
<div class="node-time">{{progressNode[1].time}}</div>
</div>
<div class="col con-c align-c">
<div :class="progressState > 3 ? 'node-point' : 'node-point-unactive'"></div>
<div class="node-name">{{progressNode[2].text}}</div>
<div class="node-time">{{'　'}}</div>
</div>
<div :style="'background-image: linear-gradient(to right, #CF2F1D 0%, #CF2F1D ' + progressWidth * progressState + '%, #FFFFFF ' + progressWidth * progressState + '%);'"></div>
</div>
<!-- 操作按钮 -->
<div v-if="componentProject.isOnline" class="operate row con-e align-c">
<div class="col con-c align-c">
<img v-if="componentProject.noticeType === 0" class="operate-img" src="../assets/notice-bitton.png" alt="">
<div v-if="operateText !== ''" class="operate-button">
<button v-if="[2].indexOf(componentProgress.state) >= 0" class="global-enable" @click="onOffer()">立即报价</button>
<button v-if="[3, 4].indexOf(componentProgress.state) >= 0" class="global-disable" disabled>报价已结束</button>
<button v-if="[5].indexOf(componentProgress.state) >= 0" class="global-disable" disabled>报价已暂停</button>
<button v-if="[6].indexOf(componentProgress.state) >= 0" class="global-disable" disabled>报价已终止</button>
</div>
<div class="operate-tip">
<span v-if="progressState === 1">距离报价开始仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
<span v-if="[2].indexOf(componentProgress.state) >= 0 && !operateIsBuy">报价仅剩 <span class="global-color-red">{{operateDay}}</span> 天 <span class="global-color-red">{{operateHour}}</span> 小时</span>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import iMiment from 'miment'
import iTime from '@/common/js/time.js'
export default {
data () {
return {
detailsType: 0,
progressNode: [],
progressWidth: 25,
progressState: 1,
operateIsBuy: false,
operateDay: 0,
operateHour: 0,
operateText: '立即报名',
}
},
computed: {
componentProject: function () {
return this.$store.state.componentProject
},
componentProgress: function () {
console.log('this.$store.state.componentProgress', this.$store.state.componentProgress)
return this.$store.state.componentProgress
}
},
watch: {
componentProject: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
},
componentProgress: {
handler: function (funcNewValue, funcOldValue) {
if (JSON.stringify(funcNewValue) !== '{}') {
this.setProgressTime(funcNewValue)
this.setOperate(funcNewValue)
}
},
deep: true,
immediate: true,
}
},
created: function () {
this.progressNode = [
{ 'text': '　', 'time': '　' },
{ 'text': '　', 'time': '　' },
{ 'text': '　', 'time': '　' },
]
},
methods: {
/**
* 设置进度时间数据
* @function
* @param {object} funcProgressData - 进度原始数据
* @returns
*/
setProgressTime: function (funcProgressData) {
this.progressNode = [
{
text: funcProgressData.text[0],
time: iMiment(funcProgressData.timestamp[0]).format('YYYY-MM-DD')
},
{
text: funcProgressData.text[1],
time: iMiment(funcProgressData.timestamp[1]).format('YYYY-MM-DD hh:mm') + ' - ' + iMiment(funcProgressData.timestamp[2]).format('YYYY-MM-DD hh:mm')
},
{
text: funcProgressData.text[2],
time: iMiment(funcProgressData.timestamp[3]).format('YYYY-MM-DD hh:mm')
},
]
if (this.componentProject.noticeType === 0) {
this.progressNode[2].time = '　'
}
},
/**
* 设置按钮数据
* @function
* @param {object} funcProgressData - 进度原始数据
* @returns
*/
setOperate: function (funcProgressData) {
// 计算进度状态
let funcIndex = 0
for (funcIndex; funcIndex < funcProgressData.timestamp.length; funcIndex++) {
if (iTime() < funcProgressData.timestamp[funcIndex]) {
break
}
}
this.progressState = funcIndex
// 计算剩余天数
let funcDistance = iMiment().distance(iTime(), funcProgressData.timestamp[funcIndex]).format('YYYY-MM-DD hh:mm:ss', true)
let funcRegExpDate = new RegExp('[0-9]+-[0-9]+-[0-9]+')
let funcDate = funcDistance.match(funcRegExpDate)[0].split('-')
let funcRegExpTime = new RegExp('[0-9]+:[0-9]+:[0-9]+')
let funcTime = funcDistance.match(funcRegExpTime)[0].split(':')
let funcReturn = {
year: funcDate[0],
month: funcDate[1],
day: funcDate[2],
hour: funcTime[0],
minute: funcTime[1],
second: funcTime[2],
}
this.operateDay = funcReturn.day
this.operateHour = parseInt(funcReturn.hour) + 1
// 设置其他状态
this.operateIsBuy = funcProgressData.isBuy
},
/**
* 报名
* @function
* @returns
*/
onEntered: function () {
// 公告为预览状态禁止操作
if (this.$route.query.preview) return
this.$emit('entered')
},
/**
* 下载标书
* @function
* @returns
*/
onDocument: function () {
// 公告为预览状态禁止操作
if (this.$route.query.preview) return
this.$emit('document')
},
onOffer: function () {
// 公告为预览状态禁止操作
if (this.$route.query.preview) return
this.$emit('offer')
},
}
}
</script>
<style lang="less">
.components-progress {
position: relative;
width: 100%;
background: #F2F2F2;
.node {
position: relative;
.node-point {
width: 24px;
height: 24px;
margin-bottom: 8px;
border-radius: 50%;
border: 2px #FFFFFF solid;
background: #CF2F1D;
}
.node-point-unactive {
width: 24px;
height: 24px;
margin-bottom: 8px;
border-radius: 50%;
border: 2px #FFFFFF solid;
background: #E5E5E5;
}
.node-name {
margin-bottom: 4px;
font-size: @fontSize02;
}
.node-time {
margin-bottom: 4px;
font-size: @fontSize01;
}
> div:nth-child(1) {
z-index: 5;
width: 210px;
height: 120px;
}
> div:nth-child(2) {
z-index: 5;
width: 380px;
height: 120px;
}
> div:nth-child(3) {
z-index: 5;
width: 210px;
height: 120px;
}
> div:nth-child(4) {
z-index: 0;
position: absolute;
top: 24px;
left: 100px;
width: 600px;
height: 12px;
background: #FFFFFF;
border: 2px #FFFFFF solid;
}
}
.operate {
width: 340px;
> div {
margin-right: 40px;
.operate-img {
z-index: 0;
position: absolute;
top: 0;
right: 0;
}
.operate-button {
z-index: 5;
margin-bottom: 8px;
}
.operate-tip {
z-index: 5;
}
span {
margin-top: 6px;
font-size: @fontSize01;
}
}
button {
width: 160px;
height: 50px;
border-radius: 25px;
border: none;
color: #FFFFFF;
font-size: @fontSize02;
}
}
}
</style>
src/components/notice-project.vue
<template>
<!-- updata：06-06 -->
<!-- 信息模板 - 投标项目 -->
<div class="component-project">
<!-- 竞价报价公告 -->
<div v-if="noticeType === 0" class="info">
<div class="item-text row align-c">
<span>竞价项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>竞价项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位性质：</span>
<span>{{componentProject.buyCompanyType}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>竞价时间：</span>
<span>{{componentProject.timeBegin + '　-　' + componentProject.timeEnd}}</span>
</div>
<div class="item-text row align-s">
<span>竞价标的：</span>
<el-table :data="componentContract" stripe :header-cell-style="tableHeaderStyle">
<el-table-column prop="index" label="合同包" width="80" align="center"></el-table-column>
<el-table-column prop="object" label="标的" min-width="140"></el-table-column>
<el-table-column prop="requirement" label="参数要求" min-width="230"></el-table-column>
<el-table-column prop="quantity" label="数量" min-width="120" align="center"></el-table-column>
<el-table-column prop="budget" label="限价（元）" min-width="180" align="center">
<template slot-scope="scope">
<span>{{scope.row.budget === 0 ? '无' : scope.row.budget}}</span>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 竞价结果公告 -->
<div v-if="noticeType === 1" class="info">
<div class="item-text row align-c">
<span>竞价项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>竞价项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位性质：</span>
<span>{{componentProject.buyCompanyType}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>竞价时间：</span>
<span>{{componentProject.timeBegin + '　-　' + componentProject.timeEnd}}</span>
</div>
</div>
<!-- 招标采购公告 -->
<div v-if="noticeType === 2" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>文件发售时间：</span>
<span>{{componentProject.timeBegin + '　-　' + componentProject.timeEnd}}</span>
</div>
<!-- 单一合同 -->
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>文件售价：</span>
<span>{{componentContract[0] ? componentContract[0].budget + ' 元' : ''}}</span>
</div>
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>投标截止、开标时间：</span>
<span>{{componentProject.timeClose}}</span>
</div>
<div class="item-text row align-c">
<span>开标地点：</span>
<span>{{componentProject.address}}</span>
</div>
<!-- 多个合同 -->
<div v-if="componentProject.isPackage" class="item-text row align-s">
<span>合同包：</span>
<el-table :data="componentContract" stripe :header-cell-style="tableHeaderStyle">
<el-table-column type="index" label="合同包" width="80" align="center"></el-table-column>
<el-table-column prop="number" label="合同包编号" min-width="140"></el-table-column>
<el-table-column prop="object" label="标的" min-width="230"></el-table-column>
<el-table-column prop="quantity" label="数量" min-width="120" align="center"></el-table-column>
<el-table-column prop="budget" label="预算总金额（元）" min-width="180" align="center"></el-table-column>
<el-table-column prop="timeClose" label="投标截止、开标时间" min-width="190"></el-table-column>
</el-table>
</div>
</div>
<!-- 资格预审公告 -->
<div v-if="noticeType === 3" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>领取资格预审文件时间：</span>
<span>{{componentProject.timeBegin + ' - ' + componentProject.timeEnd}}</span>
</div>
<!-- 单一合同 -->
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>文件售价：</span>
<span>{{componentContract[0] ? componentContract[0].budget + ' 元' : ''}}</span>
</div>
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>申请文件提交截止、开标时间：</span>
<span>{{componentProject.timeClose}}</span>
</div>
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>开标地点：</span>
<span>{{componentProject.address}}</span>
</div>
<!-- 多个合同 -->
<div v-if="componentProject.isPackag" class="item-text row align-c">
<span>开标地点：</span>
<span>{{componentProject.address}}</span>
</div>
<div v-if="componentProject.isPackage" class="item-text row align-s">
<span>合同包：</span>
<el-table :data="componentContract" stripe :header-cell-style="tableHeaderStyle">
<el-table-column type="index" label="合同包" width="80" align="center"></el-table-column>
<el-table-column prop="number" label="合同包编号" min-width="140"></el-table-column>
<el-table-column prop="object" label="标的" min-width="230"></el-table-column>
<el-table-column prop="quantity" label="数量" min-width="120" align="center"></el-table-column>
<el-table-column prop="budget" label="预算总金额（元）" min-width="180" align="center"></el-table-column>
<el-table-column prop="timeClose" label="投标截止、开标时间" min-width="190"></el-table-column>
</el-table>
</div>
</div>
<!-- 变更澄清公告 -->
<div v-if="noticeType === 4" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
</div>
<!-- 中标候选公告 -->
<div v-if="noticeType === 5" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>公示发布日期：</span>
<span>{{componentProject.timeRelease}}</span>
</div>
</div>
<!-- 招标结果公告 -->
<div v-if="noticeType === 6" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
</div>
<!-- 其他公告 -->
<div v-if="noticeType === 9" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
</div>
</div>
</template>
<script>
export default {
data: function () {
return {
tableHeaderStyle: {
color: '#000000',
background: '#F2F2F2'
},
noticeType: '',
}
},
computed: {
componentProject: function () {
return this.$store.state.componentProject
},
componentContract: function () {
return this.$store.state.componentContract
},
},
watch: {
$route: function () {
this.noticeType = this.$route.query.type ? Number(this.$route.query.type) : 0
},
componentContract: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
}
},
created: function () {
this.noticeType = this.$route.query.type ? Number(this.$route.query.type) : 0
},
methods: {
}
}
</script>
<style lang="less">
.component-project {
.info {
.item-text {
margin: 16px 0;
span:nth-child(1) {
min-width: 180px;
margin-right: 10px;
text-align: right;
font-size: @fontSize02;
}
span:nth-child(2) {
text-align: left;
font-size: @fontSize01;
}
}
}
}
</style>
<template>
<!-- updata：06-06 -->
<!-- 信息模板 - 投标项目 -->
<div class="component-project">
<!-- 竞价报价公告 -->
<div v-if="noticeType === 0" class="info">
<div class="item-text row align-c">
<span>竞价项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>竞价项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位性质：</span>
<span>{{componentProject.buyCompanyType}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>竞价时间：</span>
<span>{{componentProject.timeBegin + '　-　' + componentProject.timeEnd}}</span>
</div>
<div class="item-text row align-s">
<span>竞价标的：</span>
<el-table :data="componentContract" stripe :header-cell-style="tableHeaderStyle">
<el-table-column prop="index" label="合同包" width="80" align="center"></el-table-column>
<el-table-column prop="object" label="标的" min-width="140"></el-table-column>
<el-table-column prop="requirement" label="参数要求" min-width="230"></el-table-column>
<el-table-column prop="quantity" label="数量" min-width="120" align="center"></el-table-column>
<el-table-column prop="budget" label="限价（元）" min-width="180" align="center">
<template slot-scope="scope">
<span>{{scope.row.budget === 0 ? '无' : scope.row.budget}}</span>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 竞价结果公告 -->
<div v-if="noticeType === 1" class="info">
<div class="item-text row align-c">
<span>竞价项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>竞价项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位性质：</span>
<span>{{componentProject.buyCompanyType}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>竞价时间：</span>
<span>{{componentProject.timeBegin + '　-　' + componentProject.timeEnd}}</span>
</div>
</div>
<!-- 招标采购公告 -->
<div v-if="noticeType === 2" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>文件发售时间：</span>
<span>{{componentProject.timeBegin + '　-　' + componentProject.timeEnd}}</span>
</div>
<!-- 单一合同 -->
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>文件售价：</span>
<span>{{componentContract[0] ? componentContract[0].budget + ' 元' : ''}}</span>
</div>
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>投标截止、开标时间：</span>
<span>{{componentProject.timeClose}}</span>
</div>
<div class="item-text row align-c">
<span>开标地点：</span>
<span>{{componentProject.address}}</span>
</div>
<!-- 多个合同 -->
<div v-if="componentProject.isPackage" class="item-text row align-s">
<span>合同包：</span>
<el-table :data="componentContract" stripe :header-cell-style="tableHeaderStyle">
<el-table-column type="index" label="合同包" width="80" align="center"></el-table-column>
<el-table-column prop="number" label="合同包编号" min-width="140"></el-table-column>
<el-table-column prop="object" label="标的" min-width="230"></el-table-column>
<el-table-column prop="quantity" label="数量" min-width="120" align="center"></el-table-column>
<el-table-column prop="budget" label="预算总金额（元）" min-width="180" align="center"></el-table-column>
<el-table-column prop="timeClose" label="投标截止、开标时间" min-width="190"></el-table-column>
</el-table>
</div>
</div>
<!-- 资格预审公告 -->
<div v-if="noticeType === 3" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>领取资格预审文件时间：</span>
<span>{{componentProject.timeBegin + ' - ' + componentProject.timeEnd}}</span>
</div>
<!-- 单一合同 -->
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>文件售价：</span>
<span>{{componentContract[0] ? componentContract[0].budget + ' 元' : ''}}</span>
</div>
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>申请文件提交截止、开标时间：</span>
<span>{{componentProject.timeClose}}</span>
</div>
<div v-if="!componentProject.isPackage" class="item-text row align-c">
<span>开标地点：</span>
<span>{{componentProject.address}}</span>
</div>
<!-- 多个合同 -->
<div v-if="componentProject.isPackag" class="item-text row align-c">
<span>开标地点：</span>
<span>{{componentProject.address}}</span>
</div>
<div v-if="componentProject.isPackage" class="item-text row align-s">
<span>合同包：</span>
<el-table :data="componentContract" stripe :header-cell-style="tableHeaderStyle">
<el-table-column type="index" label="合同包" width="80" align="center"></el-table-column>
<el-table-column prop="number" label="合同包编号" min-width="140"></el-table-column>
<el-table-column prop="object" label="标的" min-width="230"></el-table-column>
<el-table-column prop="quantity" label="数量" min-width="120" align="center"></el-table-column>
<el-table-column prop="budget" label="预算总金额（元）" min-width="180" align="center"></el-table-column>
<el-table-column prop="timeClose" label="投标截止、开标时间" min-width="190"></el-table-column>
</el-table>
</div>
</div>
<!-- 变更澄清公告 -->
<div v-if="noticeType === 4" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
</div>
<!-- 中标候选公告 -->
<div v-if="noticeType === 5" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>公示发布日期：</span>
<span>{{componentProject.timeRelease}}</span>
</div>
</div>
<!-- 招标结果公告 -->
<div v-if="noticeType === 6" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
</div>
<!-- 其他公告 -->
<div v-if="noticeType === 9" class="info">
<div class="item-text row align-c">
<span>项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购方式：</span>
<span>{{componentProject.buyWay}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
</div>
<!-- 竞价变更澄清公告 -->
<div v-if="noticeType === 10" class="info">
<div class="item-text row align-c">
<span>竞价项目编号：</span>
<span>{{componentProject.projectIdentity}}</span>
</div>
<div class="item-text row align-c">
<span>竞价项目名称：</span>
<span>{{componentProject.projectName}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位：</span>
<span>{{componentProject.buyCompany}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位性质：</span>
<span>{{componentProject.buyCompanyType}}</span>
</div>
<div class="item-text row align-c">
<span>采购单位联系人：</span>
<span>{{componentProject.buyLiaison}}</span>
</div>
<div class="item-text row align-c">
<span>联系电话：</span>
<span>{{componentProject.buyPhone}}</span>
</div>
<div class="item-text row align-c">
<span>竞价时间：</span>
<span>{{componentProject.timeBegin + '　-　' + componentProject.timeEnd}}</span>
</div>
</div>
</div>
</template>
<script>
export default {
data: function () {
return {
tableHeaderStyle: {
color: '#000000',
background: '#F2F2F2'
},
noticeType: '',
}
},
computed: {
componentProject: function () {
return this.$store.state.componentProject
},
componentContract: function () {
return this.$store.state.componentContract
},
},
watch: {
$route: function () {
this.noticeType = this.$route.query.type ? Number(this.$route.query.type) : 0
},
componentContract: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
}
},
created: function () {
this.noticeType = this.$route.query.type ? Number(this.$route.query.type) : 0
},
methods: {
}
}
</script>
<style lang="less">
.component-project {
.info {
.item-text {
margin: 16px 0;
span:nth-child(1) {
min-width: 180px;
margin-right: 10px;
text-align: right;
font-size: @fontSize02;
}
span:nth-child(2) {
text-align: left;
font-size: @fontSize01;
}
}
}
}
</style>
src/view/home.vue
<template>
<div class="home col align-c">
<componentHeader></componentHeader>
<componentNavigation></componentNavigation>
<div class="home-banner">
<el-carousel v-if="listBanner.length > 0" class="home-carousel" trigger="click" height="400px" :autoplay="true">
<el-carousel-item v-for="(item, index) in listBanner" :key="index">
<img :src="listBanner[index].url" alt="" :class="item.isLink ? 'global-cursor' : ''" @click="onBanner(item)">
</el-carousel-item>
</el-carousel>
<div v-if="listBanner.length === 0" class="home-carousel row con-c align-c">
<img src="../assets/home-banner.png" alt="">
</div>
</div>
<!-- 今日开标 -->
<div class="new-bid row con-c">
<div class="global-maxwidth row con-b">
<div>
<div class="row align-e">
<span class="title">今日开标</span>
<span class="title-extra global-color-red">{{timeDate + '开标项目'}}</span>
</div>
<div v-if="listBid.length" class="list col">
<div class="global-hover row con-b align-e" v-for="(item, index) in listBid" :key="index" @click="onDetail(item)">
<span class="global-cursor global-overflow-ellipsis ">{{item.noticeTitle}}</span>
<span>{{item.timeRelease}}</span>
</div>
</div>
<div v-if="!listBid.length" class="nothing col con-c align-c">
<img src="../assets/nothing.png" alt="">
<span>今日暂无开标项目</span>
</div>
</div>
<!-- 未登录状态展示 -->
<div v-if="!isSignIn" class="home-signin col">
<div class="home-signin-entry row">
<div class="row con-c align-c" @click="signInEntry = 'signIn'">
<span class="global-cursor" :class="signInEntry === 'signIn' ? 'home-signin-entry-active' : 'home-signin-entry-inactive'">登录</span>
</div>
<div class="row con-c align-c" @click="signInEntry = 'register'">
<span class="global-cursor" :class="signInEntry === 'register' ? 'home-signin-entry-active' : 'home-signin-entry-inactive'">注册</span>
</div>
</div>
<div class="home-signin-identity col con-c">
<div class="home-signin-item row align-c global-cursor" @click="onSignIn('supplier')">
<img src="../assets/status-supplier.png" alt="">
<span>供应商</span>
</div>
<div v-if="signInEntry === 'signIn'" class="home-signin-item row align-c global-cursor" @click="onSignInRedirect()">
<img src="../assets/status-agency.png" alt="">
<span>代理机构</span>
</div>
<div class="home-signin-item row align-c global-cursor" @click="onSignIn('specialist')">
<img src="../assets/status-specialist.png" alt="">
<span>专家</span>
</div>
</div>
</div>
<!-- 登录状态展示 - 专家 -->
<div v-if="isSignIn && info.identity === 1" class="home-signin col">
<div class="home-signin-identity-img row con-c">
<img src="../assets/home-specialist.png" alt="">
</div>
<div class="home-signin-name col">
<span>您好,</span>
<span>{{info.name}}</span>
</div>
<div class="home-signin-notify row con-c align-c">
<el-badge :is-dot="isNewNotice" class="row align-c">
<img class="global-cursor" src="../assets/notice-tip.png">
</el-badge>
<span class="global-cursor" @click="$router.push('/specialist/notify')">我的消息</span>
</div>
<div class="home-signin-state row con-c align-c">
<span v-if="info.register !== 1">注册信息暂未通过审核</span>
<span v-if="info.register === 1" class="global-cursor" @click="$router.push('/specialist')">我的评标</span>
</div>
</div>
<!-- 登录状态展示 - 商家 -->
<div v-if="isSignIn && info.identity === 2" class="home-signin col">
<div class="home-signin-identity-img row con-c">
<img src="../assets/home-supplier.png" alt="">
</div>
<div class="home-signin-name row con-c">
<span>{{info.name}}</span>
</div>
<div class="home-signin-notify row con-c align-c">
<el-badge :is-dot="isNewNotice" class="row align-c">
<img class="global-cursor" src="../assets/notice-tip.png">
</el-badge>
<span class="global-cursor" @click="$router.push('/supplier/notify')">我的消息</span>
</div>
<div v-if="info.register !== 1" class="home-signin-state row con-c align-c">
<span >注册信息暂未通过审核</span>
</div>
<div v-if="info.register === 1" class="home-signin-state row con-b align-c">
<span class="global-cursor" @click="$router.push('/supplier/bidding')">我的投标</span>
<span class="global-cursor">|</span>
<span class="global-cursor" @click="$router.push('/supplier/auction')">我的竞价</span>
</div>
</div>
</div>
</div>
<!-- 公告信息 -->
<div class="notice row con-c">
<div class="global-maxwidth">
<div class="notice-title row con-b align-e">
<span class="title">公告信息</span>
<span class="more" @click="onMoreNotice()">+ MORE</span>
</div>
<div class="row">
<div>
<div class="notice-type row con-c align-c" :class="noticeTabActive === index ? 'notice-type-active' : ''" v-for="(item, index) in noticeTab" :key="index">
<span class="global-cursor" @click="queryNotice(item.value, item.index)">{{item.label}}</span>
</div>
</div>
<div v-if="listNotice.length" class="notice-list">
<div v-for="(item, index) in listNotice" :key="index">
<div class="notice-item-title global-hover row align-c" @click="onDetail(item)">
<span class="global-cursor global-overflow-ellipsis">{{item.buyWay}}</span>
<span class="global-cursor global-overflow-ellipsis">{{item.noticeTitle}}</span>
<span class="global-cursor">{{item.timeRelease}}</span>
</div>
</div>
</div>
<div v-if="!listNotice.length" class="notice-list row con-c align-c">
<span>暂无数据</span>
</div>
</div>
</div>
</div>
<!-- 竞标结果 -->
<div class="bidding row con-c">
<div class="global-maxwidth row">
<div class="bidding-result">
<div class="row align-c">
<span class="title global-cursor" :class="auctionActive === 0 ? '' : 'title-disable'" @click="onQueryAuction(0)">网上竞价</span>
<span class="title global-cursor" :class="auctionActive === 1 ? '' : 'title-disable'" @click="onQueryAuction(1)">竞价结果</span>
<span class="more" @click="onMoreAuction()">+ MORE</span>
</div>
<div class="list">
<div v-for="(item, index) in listAuction" :key="index" class="list-item col con-b" :class="item.timeClose ? '' : 'list-item-result'" @click="onDetail(item)">
<div class="row con-b align-c">
<span class="global-overflow-ellipsis global-cursor global-hover">{{item.noticeTitle}}</span>
<span>{{item.timeRelease}}</span>
</div>
<div v-if="item.timeClose" class="row">
<span><i class="el-icon-time"></i>{{item.timeClose}}</span>
</div>
</div>
</div>
</div>
<div class="bidding-news">
<div class="row con-b align-e">
<span class="title">最新资讯</span>
<span class="more" @click="onMoreNews()">+ MORE</span>
</div>
<div class="bidding-news-detail" @click="onNewsDetail()">
<div v-if="infoNew.id">
<div class="col">
<span class="bidding-news-detail-month">{{infoNew.month}}</span>
<span class="bidding-news-detail-year">{{infoNew.year}}</span>
</div>
<div>
<p class="bidding-news-detail-title">{{infoNew.title}}</p>
</div>
<div class="bidding-news-detail-html" v-html="infoNew.content"></div>
</div>
<div v-if="!infoNew.id" class="row con-c align-c">
<span>暂无数据</span>
</div>
<img src="../assets/bg-01.png" alt="">
</div>
</div>
</div>
</div>
<!-- 最新成交 -->
<div class="deal row con-c">
<div class="global-maxwidth">
<div class="deal-title row con-b align-e">
<span class="title">最新成交</span>
<!-- <span class="more">+MORE</span> -->
</div>
<div v-if="listDealBuffer.length" class="deal-list row">
<img v-if="dealIndex === 0 && dealActive === 0" class="arrow-l" src="../assets/arrow/arrow-l.png" alt="" @click="onDealPrevious()">
<img v-if="dealIndex !== 0 || dealActive === 1" class="arrow-l" src="../assets/arrow/arrow-l-active.png" alt="" @click="onDealPrevious()">
<img v-if="dealIndex < listDealBuffer.length" class="arrow-r" src="../assets/arrow/arrow-r-active.png" alt="" @click="onDealNext()">
<img v-if="dealIndex === listDealBuffer.length - 2 && dealActive === 1" class="arrow-r" src="../assets/arrow/arrow-r.png" alt="" @click="onDealNext()">
<div class="deal-item col con-b" :class="dealActive === index % 2 ? 'deal-item-active' : ''" v-for="(item, index) in listDeal" :key="index">
<div class="row con-b align-c">
<span class="global-overflow-ellipsis">{{item.companyName}}</span>
<span class="global-color-grey">{{item.timeRelease}}</span>
</div>
<div class="row con-b align-c">
<span class="global-color-grey global-overflow-ellipsis">{{item.projectName}}</span>
<span class="global-color-grey">{{item.projectType}}</span>
</div>
</div>
</div>
<div v-if="!listDealBuffer.length" class="deal-list row con-c align-c">
<span>暂无数据</span>
</div>
</div>
</div>
<componentFooter></componentFooter>
</div>
</template>
<script>
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iTime from '@/common/js/time.js'
import iDictionary from '@/common/js/dictionary.js'
import iHeader from '@/components/currency-header.vue'
import iNavigation from '@/components/currency-navigation.vue'
import iFooter from '@/components/currency-footer.vue'
export default {
components: {
componentHeader: iHeader,
componentNavigation: iNavigation,
componentFooter: iFooter
},
data: function () {
return {
signInEntry: 'signIn',
isNewNotice: false,
timeDate: '',
listBanner: [],
listBid: [], // 今日开标
listNotice: [], // 公告信息
listAuction: [], // 竞标采购
listDeal: [], // 最新成交
listDealBuffer: [], // 最新成交缓存
infoNew: {}, // 最新资讯
rawBid: [],
rawNotice: [],
rawAuction: [],
rawNew: [],
rawDeal: [],
noticeActive: 0, // 当前公告
noticeTabActive: 0, // 当前公告类型
noticeTab: [
{ 'label': '招标采购公告', 'value': 2, 'index': 0 },
{ 'label': '资格预审公告', 'value': 3, 'index': 1 },
{ 'label': '澄清变更公告', 'value': 4, 'index': 2 },
{ 'label': '中标候选公示', 'value': 5, 'index': 3 },
{ 'label': '结果公告', 'value': 6, 'index': 4 },
{ 'label': '其他公告', 'value': 9, 'index': 5 },
],
auctionActive: 0,
dealIndex: 0, // 最新交易缓存数组索引
dealActive: 0, // 最新交易选中
dealMax: 0, // 最新交易数据条目
}
},
computed: {
info: function () {
return this.$store.state.info
},
isSignIn: function () {
return this.$store.state.isSignIn
},
},
watch: {
info: {
handler: function (funcNewValue, funcOldValue) {
if (funcNewValue) this.queryNotify()
},
deep: true,
immediate: true,
},
isSignIn: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
},
},
created: function () {
this.timeDate = iMiment(iTime()).format('MM月DD日')
this.queryBanner()
this.queryNotice(2, 0)
this.onQueryAuction(0)
this.queryData()
},
methods: {
queryNotify: function () {
if (this.info.identity) {
iRequest.request(iHost.base + 'bid/zNotification/countUnread', { 'userType': this.info.identity }, 'json', 'post')
.then((funcResponse) => {
this.isNewNotice = funcResponse.count ? true : false
})
}
},
queryBanner: function () {
iRequest.request(iHost.base + 'bid/zBanner/getListByType', { 'type': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcList = []
let funcRawData = funcResponse.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'url': iHost.base + funcRawData[i].img,
'link': this.$options.filters.urlFormat(funcRawData[i].link),
'title': funcRawData[i].title,
}
if (funcItem.link) {
funcItem.isLink = true
} else {
funcItem.isLink = false
}
funcList.push(funcItem)
}
this.listBanner = funcList
})
.catch((funcError) => {})
},
queryData: function () {
let funcParam = {
'pageNo': 1,
'pageSize': 10,
}
let funcBid = iRequest.request(iHost.base + 'bid/zIndex/todayOpenTender', {}, 'json', 'get')
.then((funcResponse) => {
this.rawBid = funcResponse
})
let funcNew = iRequest.request(iHost.base + 'bid/zIndex/latestNews', {}, 'json', 'get')
.then((funcResponse) => {
this.rawNew = funcResponse
})
let funcDeal = iRequest.request(iHost.base + 'bid/zIndex/latestDeal', funcParam, 'json', 'post')
.then((funcResponse) => {
this.rawDeal = funcResponse
})
Promise.all([ funcBid, funcNew, funcDeal ])
.then(() => {
this.setHome()
})
.catch((funcError) => {
console.log(funcError)
})
},
setHome: function () {
this.setBid()
this.setNew()
this.setDeal()
},
setBid: function () {
let funcList = []
let funcRawData = this.rawBid
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'noticeTitle': funcRawData[i].title,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
}
funcList.push(funcItem)
}
this.listBid = funcList
},
setNew: function () {
this.infoNew = {
'id': this.rawNew.id,
'type': Number(this.rawNew.informationType),
'title': this.rawNew.title,
'content': this.rawNew.content,
'year': iMiment(this.rawNew.releaseTime).format('YYYY'),
'month': iMiment(this.rawNew.releaseTime).format('MM.DD'),
}
},
setDeal: function () {
let funcList = []
let funcRawData = this.rawDeal.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
'companyName': funcRawData[i].companyName,
'projectType': funcRawData[i].projectType,
'projectName': funcRawData[i].projectName,
}
funcList.push(funcItem)
}
this.dealActive = 0
if (funcList[this.dealActive]) {
this.listDeal[0] = funcList[this.dealActive]
}
if (funcList[this.dealActive + 1]) {
this.listDeal[1] = funcList[this.dealActive + 1]
}
this.listDealBuffer = funcList
},
queryNotice: function (funcType, funcIndex) {
this.noticeTabActive = funcIndex
let funcParam = {
'noticeType': iDictionary.noticeType.raw[iDictionary.noticeType.mapping.indexOf(funcType)],
'keyword': '',
'releaseTimeType': '',
'procurementType': '',
'orderBy': 0,
'pageSize': 6,
'pageNo': 1
}
iRequest.request(iHost.base + 'bid/zTenderNotice/getApiAllList', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcList = []
let funcRawData = funcResponse.list
for (let i = 0, len = funcResponse.list.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': funcType,
'noticeTitle': funcRawData[i].title,
'buyWay': funcRawData[i].procurementTypeDesc,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
}
funcList.push(funcItem)
}
this.listNotice = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onQueryAuction: function (funcType) {
this.auctionActive = funcType
this.auctionActive = funcType
let funcParam = {
'noticeType': iDictionary.noticeType.raw[iDictionary.noticeType.mapping.indexOf(funcType)],
'keyword': '',
'releaseTimeType': '',
'procurementType': '',
'orderBy': 0,
'pageSize': 8,
'pageNo': 1
}
iRequest.request(iHost.base + 'bid/zTenderNotice/getApiAllList', funcParam, 'json', 'post')
.then((funcResponse) => {
this.rawAuction = funcResponse
let funcList = []
let funcRawData = funcResponse.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': funcType,
'noticeTitle': funcRawData[i].title,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
'timeClose': funcRawData[i].biddingEndTime ? iMiment(funcRawData[i].biddingEndTime).format('YYYY-MM-DD hh:mm') : false,
}
funcList.push(funcItem)
}
this.listAuction = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onSignIn: function (funcType) {
if (this.signInEntry === 'signIn') {
this.$router.push('/signIn/input?status=' + funcType)
} else {
this.$router.push('register/' + funcType)
}
},
onSignInRedirect: function () {
window.open(iHost.agentSignIn, '_blank')
},
/**
* 轮播跳转
* @function
* @param {object} funcItem
* @returns
*/
onBanner: function (funcItem) {
window.open(funcItem.link, '_blank')
},
/**
* 公告更多
* @function
* @returns
*/
onMoreNotice: function () {
let funcNoticeIndex = this.noticeTab[this.noticeTabActive].value
console.log(funcNoticeIndex)
let funcNoticeUrl = this.$router.resolve({ path: '/bid', query: { type: funcNoticeIndex } })
window.open(funcNoticeUrl .href, '_blank')
},
/**
* 公告点击跳转详情
* @function
* @param {object} funcItem
* @returns
*/
onDetail: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/bid/notice', query: { type: funcItem.noticeType, id: funcItem.noticeId }})
window.open(funcNoticeUrl .href, '_blank')
},
/**
* 竞标更多
* @function
* @returns
*/
onMoreAuction: function () {
let funcNoticeUrl = this.$router.resolve({ path: '/bid', query: { type: this.auctionActive } })
window.open(funcNoticeUrl .href, '_blank')
},
/**
* 最新资讯更多
* @function
* @returns
*/
onMoreNews: function () {
switch (this.infoNew.type) {
case 2:
let funcPolicyUrl = this.$router.resolve({ path: '/policy' })
window.open(funcPolicyUrl .href, '_blank')
break
case 1:
let funcTrendsUrl = this.$router.resolve({ path: '/trends' })
window.open(funcTrendsUrl .href, '_blank')
break
}
},
/**
* 最新资讯详情
* @function
* @returns
*/
onNewsDetail: function () {
switch (this.infoNew.type) {
case 2:
let funcPolicyUrl = this.$router.resolve({ path: '/policy/details', query: { id: this.infoNew.id } })
window.open(funcPolicyUrl .href, '_blank')
break
case 1:
let funcTrendsUrl = this.$router.resolve({ path: '/trends/details', query: { id: this.infoNew.id } })
window.open(funcTrendsUrl .href, '_blank')
break
}
},
onDealPrevious: function () {
if (this.dealActive > 0) {
this.dealActive = this.dealActive - 1
return
}
if (this.dealActive === 0 && this.dealIndex > 0) {
this.dealIndex = this.dealIndex - 1
this.listDeal[0] = this.listDealBuffer[this.dealIndex]
this.listDeal[1] = this.listDealBuffer[this.dealIndex + 1]
}
},
onDealNext: function () {
if (this.dealActive === 0) {
this.dealActive = this.dealActive + 1
return
}
if (this.dealActive === 1 && this.dealIndex < this.listDealBuffer.length - 2) {
this.dealIndex = this.dealIndex + 1
this.listDeal[0] = this.listDealBuffer[this.dealIndex]
this.listDeal[1] = this.listDealBuffer[this.dealIndex + 1]
}
},
}
}
</script>
<style lang="less">
.home {
width: 100%;
background-image: url(@backgroundImageUrl);
background-repeat: no-repeat;
.more {
flex-grow: 1;
padding-bottom: 4px;
text-align: right;
color: @colorGrey60;
cursor: pointer;
}
.title {
margin-right: 20px;
font-size: @fontSize10;
font-weight: 800;
}
.title-disable {
color: @colorGrey60;
font-size: @fontSize08;
}
.home-banner {
position: relative;
width: 100%;
overflow: hidden;
.home-carousel {
align-items: center;
flex-direction: column;
max-width: 100%;
.el-carousel__item {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
background: #ffffff;
}
img {
height: 400px;
}
}
}
.new-bid {
width: 100%;
padding: 50px 0;
background: #FFFFFF;
.title {
> span:nth-child(1) {
margin-right: 16px;
font-size: @fontSize10;
}
> span:nth-child(2) {
margin-bottom: 2px;
font-size: @fontSize01;
}
}
.title-extra {
padding-bottom: 4px;
}
.list {
width: 944px;
span:nth-child(1) {
max-width: 830px;
margin-top: 32px;
font-size: @fontSize02;
}
span:nth-child(2) {
font-size: @fontSize02;
color: @colorGrey60;
}
}
.nothing {
width: 994px;
height: 200px;
img {
height: 100px;
margin-bottom: 20px;
}
}
.home-signin {
width: 206px;
height: 300px;
padding: 24px 0;
background-image: url('../assets/bg-02.png');
background-repeat: no-repeat;
background-size: 206px 300px;
box-shadow: 0px 0px 30px 0px rgba(41, 41, 41, 0.1);
border-radius: 16px;
// 未登录状态样式
.home-signin-entry {
height: 34px;
margin-bottom: 26px;
div {
width: 50%;
}
.home-signin-entry-active {
padding-bottom: 8px;
border-bottom: 4px #D02F1E solid;
text-align: center;
font-size: @fontSize04;
font-weight: 800;
}
.home-signin-entry-inactive {
padding-bottom: 8px;
border-bottom: 2px#FFFFFF solid;
font-size: @fontSize02;
}
}
.home-signin-identity {
height: 190px;
}
.home-signin-item {
width: 100%;
height: 64px;
padding: 0 36px;
span {
font-size: @fontSize03;
}
img {
width: 40px;
margin-right: 14px;
}
}
.home-signin-item:hover {
background: #ffffff;
box-shadow: 0px 0px 30px 0px rgba(42, 42, 42, 0.15);
}
// 登录相关样式
.home-signin-identity-img {
width: 100%;
img {
width: 44px;
height: 44px;
}
}
.home-signin-name {
width: 100%;
min-height: 40px;
margin-top: 26px;
> span {
text-align: center;
}
}
.home-signin-notify {
width: 166px;
height: 54px;
margin: 26px 20px;
border-top: 1px #cccccc dashed;
border-bottom: 1px #cccccc dashed;
.el-badge {
height: 20px;
}
span {
height: 24px;
margin-left: 10px;
}
}
.home-signin-state {
width: 100%;
padding: 0 20px;
> span {
font-size: @fontSize01;
}
}
}
}
.notice {
width: 100%;
height: 674px;
padding: 50px 0;
background-image: url('../assets/bg-03.png');
background-repeat: no-repeat;
.notice-title {
margin-bottom: 30px;
}
.notice-type {
width: 156px;
height: 66px;
margin-bottom: 2px;
border-radius: 15px 0px 0px 15px;
background: #EEEEEE;
}
.notice-type-active {
border: 1px @colorBlue solid;
color: @colorWhite;
background: #3e8ddc;
}
.notice-list {
width: 1044px;
padding: 24px 20px;
background: #FFFFFF;
border-radius: 0px 15px 15px 0px;
.notice-item-title {
height: 70px;
border-bottom: 1px #E5E5E5 dashed;
span:nth-child(1) {
width: 130px;
}
span:nth-child(2) {
flex-grow: 1;
max-width: 740px;
margin-right: 40px;
}
span:nth-child(3) {
flex-grow: 1;
width: 96px;
color: @colorGrey60;
text-align: right;
}
}
.notice-item-title-active {
border: none;
}
.notice-item-time-active {
height: 60px;
padding-left: 130px;
color: @colorGrey40;
font-size: @fontSize01;
border-bottom: 1px #E5E5E5 dashed;
i {
margin-right: 6px;
}
}
.notice-item-time {
display: none;
}
}
}
.bidding {
width: 100%;
height: 694px;
padding: 50px 0;
background: #FFFFFF;
.bidding-result {
width: 654px;
}
.bidding-news {
width: 544px;
margin-left: 40px;
.bidding-news-detail {
position: relative;
margin-top: 40px;
padding-left: 44px;
p {
color: #000000;
}
.bidding-news-detail-title {
font-weight: 800;
}
> div {
position: absolute;
top: 44px;
left: 0;
width: 485px;
height: 275px;
padding: 34px;
background: #FFFFFF;
box-shadow: 0px 0px 30px 0px rgba(41,41,41,0.1);
opacity: 0.85;
border-radius: 15px;
.bidding-news-detail-month {
font-size: @fontSize10;
font-weight: 800;
}
.bidding-news-detail-year {
width: 34px;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 4px @colorRed solid;
}
.bidding-news-detail-html {
width: 100%;
height: 40px;
margin-top: 20px;
font-size: @fontSize01 !important;
overflow: hidden;
}
}
img {
width: 100%;
}
}
// 对应后台富文本编辑边框样式
table {
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
th {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
text-align: center;
}
td {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
padding: 3px 5px;
}
}
}
.list {
margin-top: 8px;
.list-item {
height: 70px;
padding: 10px 0;
border-bottom: 1px #E5E5E5 dashed;
> div:nth-child(1) {
> span:nth-child(1) {
max-width: 500px;
}
> span:nth-child(2) {
font-size: @fontSize01;
text-align: right;
color: @colorGrey60;
}
}
> div:nth-child(2) {
font-size: @fontSize01;
color: @colorGrey60;
i {
margin-right: 6px;
}
}
}
.list-item-result {
padding-top: 24px;
}
}
}
.deal {
width: 100%;
padding: 50px 0;
background-image: url('../assets/bg-04.png');
background-repeat: no-repeat;
.deal-title {
padding-left: 30px;
}
.deal-list {
position: relative;
min-height: 100px;
margin: 0 30px;
.arrow-l {
position: absolute;
top: 66px;
left: -30px;
width: 28px;
height: 28px;
}
.arrow-r {
position: absolute;
top: 66px;
right: -30px;
width: 28px;
height: 28px;
}
.deal-item {
width: 602px;
height: 100px;
margin-top: 30px;
padding: 22px 20px;
border-radius: 15px;
> div {
> span:nth-child(1) {
max-width: 450;
}
}
> div:nth-child(2) {
font-size: @fontSize01;
}
}
.deal-item-active {
background: #FFFFFF;
box-shadow: 0px 0px 30px 0px rgba(41,41,41,0.1);
}
}
}
}
<template>
<div class="home col align-c">
<componentHeader></componentHeader>
<componentNavigation></componentNavigation>
<div class="home-banner">
<el-carousel v-if="listBanner.length > 0" class="home-carousel" trigger="click" height="400px" :autoplay="true">
<el-carousel-item v-for="(item, index) in listBanner" :key="index">
<img :src="listBanner[index].url" alt="" :class="item.isLink ? 'global-cursor' : ''" @click="onBanner(item)">
</el-carousel-item>
</el-carousel>
<div v-if="listBanner.length === 0" class="home-carousel row con-c align-c">
<img src="../assets/home-banner.png" alt="">
</div>
</div>
<!-- 今日开标 -->
<div class="new-bid row con-c">
<div class="global-maxwidth row con-b">
<div class="calendar">
<span class="calendar-title">开标日历</span>
<calendar :markDate="['2020/10/13','2020/10/14']"></calendar>
</div>
<div>
<div class="row align-e">
<span class="title">今日开标</span>
<span class="title-extra global-color-red">{{timeDate + '开标项目'}}</span>
</div>
<div v-if="listBid.length" class="list col">
<div class="global-hover row con-b align-e" v-for="(item, index) in listBid" :key="index" @click="onDetail(item)">
<span class="global-cursor global-overflow-ellipsis ">{{item.noticeTitle}}</span>
<span>{{item.timeRelease}}</span>
</div>
</div>
<div v-if="!listBid.length" class="nothing col con-c align-c">
<img src="../assets/nothing.png" alt="">
<span>今日暂无开标项目</span>
</div>
</div>
<!-- 未登录状态展示 -->
<div v-if="!isSignIn" class="home-signin col">
<div class="home-signin-entry row">
<div class="row con-c align-c" @click="signInEntry = 'signIn'">
<span class="global-cursor" :class="signInEntry === 'signIn' ? 'home-signin-entry-active' : 'home-signin-entry-inactive'">登录</span>
</div>
<div class="row con-c align-c" @click="signInEntry = 'register'">
<span class="global-cursor" :class="signInEntry === 'register' ? 'home-signin-entry-active' : 'home-signin-entry-inactive'">注册</span>
</div>
</div>
<div class="home-signin-identity col con-c">
<div class="home-signin-item row align-c global-cursor" @click="onSignIn('supplier')">
<img src="../assets/status-supplier.png" alt="">
<span>供应商</span>
</div>
<div v-if="signInEntry === 'signIn'" class="home-signin-item row align-c global-cursor" @click="onSignInRedirect()">
<img src="../assets/status-agency.png" alt="">
<span>代理机构</span>
</div>
<div class="home-signin-item row align-c global-cursor" @click="onSignIn('specialist')">
<img src="../assets/status-specialist.png" alt="">
<span>专家</span>
</div>
</div>
</div>
<!-- 登录状态展示 - 专家 -->
<div v-if="isSignIn && info.identity === 1" class="home-signin col">
<div class="home-signin-identity-img row con-c">
<img src="../assets/home-specialist.png" alt="">
</div>
<div class="home-signin-name col">
<span>您好,</span>
<span>{{info.name}}</span>
</div>
<div class="home-signin-notify row con-c align-c">
<el-badge :is-dot="isNewNotice" class="row align-c">
<img class="global-cursor" src="../assets/notice-tip.png">
</el-badge>
<span class="global-cursor" @click="$router.push('/specialist/notify')">我的消息</span>
</div>
<div class="home-signin-state row con-c align-c">
<span v-if="info.register !== 1">注册信息暂未通过审核</span>
<span v-if="info.register === 1" class="global-cursor" @click="$router.push('/specialist')">我的评标</span>
</div>
</div>
<!-- 登录状态展示 - 商家 -->
<div v-if="isSignIn && info.identity === 2" class="home-signin col">
<div class="home-signin-identity-img row con-c">
<img src="../assets/home-supplier.png" alt="">
</div>
<div class="home-signin-name row con-c">
<span>{{info.name}}</span>
</div>
<div class="home-signin-notify row con-c align-c">
<el-badge :is-dot="isNewNotice" class="row align-c">
<img class="global-cursor" src="../assets/notice-tip.png">
</el-badge>
<span class="global-cursor" @click="$router.push('/supplier/notify')">我的消息</span>
</div>
<div v-if="info.register !== 1" class="home-signin-state row con-c align-c">
<span >注册信息暂未通过审核</span>
</div>
<div v-if="info.register === 1" class="home-signin-state row con-b align-c">
<span class="global-cursor" @click="$router.push('/supplier/bidding')">我的投标</span>
<span class="global-cursor">|</span>
<span class="global-cursor" @click="$router.push('/supplier/auction')">我的竞价</span>
</div>
</div>
</div>
</div>
<!-- 公告信息 -->
<div class="notice row con-c">
<div class="global-maxwidth">
<div class="notice-title row con-b align-e">
<span class="title">公告信息</span>
<span class="more" @click="onMoreNotice()">+ MORE</span>
</div>
<div class="row">
<div>
<div class="notice-type row con-c align-c" :class="noticeTabActive === index ? 'notice-type-active' : ''" v-for="(item, index) in noticeTab" :key="index">
<span class="global-cursor" @click="queryNotice(item.value, item.index)">{{item.label}}</span>
</div>
</div>
<div v-if="listNotice.length" class="notice-list">
<div v-for="(item, index) in listNotice" :key="index">
<div class="notice-item-title global-hover row align-c" @click="onDetail(item)">
<span class="global-cursor global-overflow-ellipsis">{{item.buyWay}}</span>
<span class="global-cursor global-overflow-ellipsis">{{item.noticeTitle}}</span>
<span class="global-cursor">{{item.timeRelease}}</span>
</div>
</div>
</div>
<div v-if="!listNotice.length" class="notice-list row con-c align-c">
<span>暂无数据</span>
</div>
</div>
</div>
</div>
<!-- 竞标结果 -->
<div class="bidding row con-c">
<div class="global-maxwidth row">
<div class="bidding-result">
<div class="row align-c">
<span class="title global-cursor" :class="auctionActive === 0 ? '' : 'title-disable'" @click="onQueryAuction(0)">网上竞价</span>
<span class="title global-cursor" :class="auctionActive === 1 ? '' : 'title-disable'" @click="onQueryAuction(1)">竞价结果</span>
<span class="more" @click="onMoreAuction()">+ MORE</span>
</div>
<div class="list">
<div v-for="(item, index) in listAuction" :key="index" class="list-item col con-b" :class="item.timeClose ? '' : 'list-item-result'" @click="onDetail(item)">
<div class="row con-b align-c">
<span class="global-overflow-ellipsis global-cursor global-hover">{{item.noticeTitle}}</span>
<span>{{item.timeRelease}}</span>
</div>
<div v-if="item.timeClose" class="row">
<span><i class="el-icon-time"></i>{{item.timeClose}}</span>
</div>
</div>
</div>
</div>
<div class="bidding-news">
<div class="row con-b align-e">
<span class="title">最新资讯</span>
<span class="more" @click="onMoreNews()">+ MORE</span>
</div>
<div class="bidding-news-detail" @click="onNewsDetail()">
<div v-if="infoNew.id">
<div class="col">
<span class="bidding-news-detail-month">{{infoNew.month}}</span>
<span class="bidding-news-detail-year">{{infoNew.year}}</span>
</div>
<div>
<p class="bidding-news-detail-title">{{infoNew.title}}</p>
</div>
<div class="bidding-news-detail-html" v-html="infoNew.content"></div>
</div>
<div v-if="!infoNew.id" class="row con-c align-c">
<span>暂无数据</span>
</div>
<img src="../assets/bg-01.png" alt="">
</div>
</div>
</div>
</div>
<!-- 最新成交 -->
<div class="deal row con-c">
<div class="global-maxwidth">
<div class="deal-title row con-b align-e">
<span class="title">最新成交</span>
<!-- <span class="more">+MORE</span> -->
</div>
<div v-if="listDealBuffer.length" class="deal-list row">
<img v-if="dealIndex === 0 && dealActive === 0" class="arrow-l" src="../assets/arrow/arrow-l.png" alt="" @click="onDealPrevious()">
<img v-if="dealIndex !== 0 || dealActive === 1" class="arrow-l" src="../assets/arrow/arrow-l-active.png" alt="" @click="onDealPrevious()">
<img v-if="dealIndex < listDealBuffer.length" class="arrow-r" src="../assets/arrow/arrow-r-active.png" alt="" @click="onDealNext()">
<img v-if="dealIndex === listDealBuffer.length - 2 && dealActive === 1" class="arrow-r" src="../assets/arrow/arrow-r.png" alt="" @click="onDealNext()">
<div class="deal-item col con-b" :class="dealActive === index % 2 ? 'deal-item-active' : ''" v-for="(item, index) in listDeal" :key="index">
<div class="row con-b align-c">
<span class="global-overflow-ellipsis">{{item.companyName}}</span>
<span class="global-color-grey">{{item.timeRelease}}</span>
</div>
<div class="row con-b align-c">
<span class="global-color-grey global-overflow-ellipsis">{{item.projectName}}</span>
<span class="global-color-grey">{{item.projectType}}</span>
</div>
</div>
</div>
<div v-if="!listDealBuffer.length" class="deal-list row con-c align-c">
<span>暂无数据</span>
</div>
</div>
</div>
<componentFooter></componentFooter>
</div>
</template>
<script>
import iMiment from 'miment'
import iCalendar from 'vue-calendar-component';
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iTime from '@/common/js/time.js'
import iDictionary from '@/common/js/dictionary.js'
import iHeader from '@/components/currency-header.vue'
import iNavigation from '@/components/currency-navigation.vue'
import iFooter from '@/components/currency-footer.vue'
export default {
components: {
calendar: iCalendar,
componentHeader: iHeader,
componentNavigation: iNavigation,
componentFooter: iFooter
},
data: function () {
return {
signInEntry: 'signIn',
isNewNotice: false,
timeDate: '',
listBanner: [],
listBid: [], // 今日开标
listNotice: [], // 公告信息
listAuction: [], // 竞标采购
listDeal: [], // 最新成交
listDealBuffer: [], // 最新成交缓存
infoNew: {}, // 最新资讯
rawBid: [],
rawNotice: [],
rawAuction: [],
rawNew: [],
rawDeal: [],
noticeActive: 0, // 当前公告
noticeTabActive: 0, // 当前公告类型
noticeTab: [
{ 'label': '招标采购公告', 'value': 2, 'index': 0 },
{ 'label': '资格预审公告', 'value': 3, 'index': 1 },
{ 'label': '澄清变更公告', 'value': 4, 'index': 2 },
{ 'label': '中标候选公示', 'value': 5, 'index': 3 },
{ 'label': '结果公告', 'value': 6, 'index': 4 },
{ 'label': '其他公告', 'value': 9, 'index': 5 },
],
auctionActive: 0,
dealIndex: 0, // 最新交易缓存数组索引
dealActive: 0, // 最新交易选中
dealMax: 0, // 最新交易数据条目
}
},
computed: {
info: function () {
return this.$store.state.info
},
isSignIn: function () {
return this.$store.state.isSignIn
},
},
watch: {
info: {
handler: function (funcNewValue, funcOldValue) {
if (funcNewValue) this.queryNotify()
},
deep: true,
immediate: true,
},
isSignIn: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
},
},
created: function () {
this.timeDate = iMiment(iTime()).format('MM月DD日')
this.queryBanner()
this.queryNotice(2, 0)
this.onQueryAuction(0)
this.queryData()
},
methods: {
queryNotify: function () {
if (this.info.identity) {
iRequest.request(iHost.base + 'bid/zNotification/countUnread', { 'userType': this.info.identity }, 'json', 'post')
.then((funcResponse) => {
this.isNewNotice = funcResponse.count ? true : false
})
}
},
queryBanner: function () {
iRequest.request(iHost.base + 'bid/zBanner/getListByType', { 'type': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcList = []
let funcRawData = funcResponse.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'url': iHost.base + funcRawData[i].img,
'link': this.$options.filters.urlFormat(funcRawData[i].link),
'title': funcRawData[i].title,
}
if (funcItem.link) {
funcItem.isLink = true
} else {
funcItem.isLink = false
}
funcList.push(funcItem)
}
this.listBanner = funcList
})
.catch((funcError) => {})
},
queryData: function () {
let funcParam = {
'pageNo': 1,
'pageSize': 10,
}
let funcBid = iRequest.request(iHost.base + 'bid/zIndex/todayOpenTender', {}, 'json', 'get')
.then((funcResponse) => {
this.rawBid = funcResponse
})
let funcNew = iRequest.request(iHost.base + 'bid/zIndex/latestNews', {}, 'json', 'get')
.then((funcResponse) => {
this.rawNew = funcResponse
})
let funcDeal = iRequest.request(iHost.base + 'bid/zIndex/latestDeal', funcParam, 'json', 'post')
.then((funcResponse) => {
this.rawDeal = funcResponse
})
Promise.all([ funcBid, funcNew, funcDeal ])
.then(() => {
this.setHome()
})
.catch((funcError) => {
console.log(funcError)
})
},
setHome: function () {
this.setBid()
this.setNew()
this.setDeal()
},
setBid: function () {
let funcList = []
let funcRawData = this.rawBid
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'noticeTitle': funcRawData[i].title,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
}
funcList.push(funcItem)
}
this.listBid = funcList
},
setNew: function () {
this.infoNew = {
'id': this.rawNew.id,
'type': Number(this.rawNew.informationType),
'title': this.rawNew.title,
'content': this.rawNew.content,
'year': iMiment(this.rawNew.releaseTime).format('YYYY'),
'month': iMiment(this.rawNew.releaseTime).format('MM.DD'),
}
},
setDeal: function () {
let funcList = []
let funcRawData = this.rawDeal.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
'companyName': funcRawData[i].companyName,
'projectType': funcRawData[i].projectType,
'projectName': funcRawData[i].projectName,
}
funcList.push(funcItem)
}
this.dealActive = 0
if (funcList[this.dealActive]) {
this.listDeal[0] = funcList[this.dealActive]
}
if (funcList[this.dealActive + 1]) {
this.listDeal[1] = funcList[this.dealActive + 1]
}
this.listDealBuffer = funcList
},
queryNotice: function (funcType, funcIndex) {
this.noticeTabActive = funcIndex
let funcParam = {
'noticeType': iDictionary.noticeType.raw[iDictionary.noticeType.mapping.indexOf(funcType)],
'keyword': '',
'releaseTimeType': '',
'procurementType': '',
'orderBy': 0,
'pageSize': 6,
'pageNo': 1
}
iRequest.request(iHost.base + 'bid/zTenderNotice/getApiAllList', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcList = []
let funcRawData = funcResponse.list
for (let i = 0, len = funcResponse.list.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': funcType,
'noticeTitle': funcRawData[i].title,
'buyWay': funcRawData[i].procurementTypeDesc,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
}
funcList.push(funcItem)
}
this.listNotice = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onQueryAuction: function (funcType) {
this.auctionActive = funcType
this.auctionActive = funcType
let funcParam = {
'noticeType': iDictionary.noticeType.raw[iDictionary.noticeType.mapping.indexOf(funcType)],
'keyword': '',
'releaseTimeType': '',
'procurementType': '',
'orderBy': 0,
'pageSize': 8,
'pageNo': 1
}
iRequest.request(iHost.base + 'bid/zTenderNotice/getApiAllList', funcParam, 'json', 'post')
.then((funcResponse) => {
this.rawAuction = funcResponse
let funcList = []
let funcRawData = funcResponse.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': funcType,
'noticeTitle': funcRawData[i].title,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
'timeClose': funcRawData[i].biddingEndTime ? iMiment(funcRawData[i].biddingEndTime).format('YYYY-MM-DD hh:mm') : false,
}
funcList.push(funcItem)
}
this.listAuction = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onSignIn: function (funcType) {
if (this.signInEntry === 'signIn') {
this.$router.push('/signIn/input?status=' + funcType)
} else {
this.$router.push('register/' + funcType)
}
},
onSignInRedirect: function () {
window.open(iHost.agentSignIn, '_blank')
},
/**
* 轮播跳转
* @function
* @param {object} funcItem
* @returns
*/
onBanner: function (funcItem) {
window.open(funcItem.link, '_blank')
},
/**
* 公告更多
* @function
* @returns
*/
onMoreNotice: function () {
let funcNoticeIndex = this.noticeTab[this.noticeTabActive].value
console.log(funcNoticeIndex)
let funcNoticeUrl = this.$router.resolve({ path: '/bid', query: { type: funcNoticeIndex } })
window.open(funcNoticeUrl .href, '_blank')
},
/**
* 公告点击跳转详情
* @function
* @param {object} funcItem
* @returns
*/
onDetail: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/bid/notice', query: { type: funcItem.noticeType, id: funcItem.noticeId }})
window.open(funcNoticeUrl .href, '_blank')
},
/**
* 竞标更多
* @function
* @returns
*/
onMoreAuction: function () {
let funcNoticeUrl = this.$router.resolve({ path: '/bid', query: { type: this.auctionActive } })
window.open(funcNoticeUrl .href, '_blank')
},
/**
* 最新资讯更多
* @function
* @returns
*/
onMoreNews: function () {
switch (this.infoNew.type) {
case 2:
let funcPolicyUrl = this.$router.resolve({ path: '/policy' })
window.open(funcPolicyUrl .href, '_blank')
break
case 1:
let funcTrendsUrl = this.$router.resolve({ path: '/trends' })
window.open(funcTrendsUrl .href, '_blank')
break
}
},
/**
* 最新资讯详情
* @function
* @returns
*/
onNewsDetail: function () {
switch (this.infoNew.type) {
case 2:
let funcPolicyUrl = this.$router.resolve({ path: '/policy/details', query: { id: this.infoNew.id } })
window.open(funcPolicyUrl .href, '_blank')
break
case 1:
let funcTrendsUrl = this.$router.resolve({ path: '/trends/details', query: { id: this.infoNew.id } })
window.open(funcTrendsUrl .href, '_blank')
break
}
},
onDealPrevious: function () {
if (this.dealActive > 0) {
this.dealActive = this.dealActive - 1
return
}
if (this.dealActive === 0 && this.dealIndex > 0) {
this.dealIndex = this.dealIndex - 1
this.listDeal[0] = this.listDealBuffer[this.dealIndex]
this.listDeal[1] = this.listDealBuffer[this.dealIndex + 1]
}
},
onDealNext: function () {
if (this.dealActive === 0) {
this.dealActive = this.dealActive + 1
return
}
if (this.dealActive === 1 && this.dealIndex < this.listDealBuffer.length - 2) {
this.dealIndex = this.dealIndex + 1
this.listDeal[0] = this.listDealBuffer[this.dealIndex]
this.listDeal[1] = this.listDealBuffer[this.dealIndex + 1]
}
},
}
}
</script>
<style lang="less">
.home {
width: 100%;
background-image: url(@backgroundImageUrl);
background-repeat: no-repeat;
.more {
flex-grow: 1;
padding-bottom: 4px;
text-align: right;
color: @colorGrey60;
cursor: pointer;
}
.title {
margin-right: 20px;
font-size: @fontSize10;
font-weight: 800;
}
.title-disable {
color: @colorGrey60;
font-size: @fontSize08;
}
.home-banner {
position: relative;
width: 100%;
overflow: hidden;
.home-carousel {
align-items: center;
flex-direction: column;
max-width: 100%;
.el-carousel__item {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
background: #ffffff;
}
img {
height: 400px;
}
}
}
.new-bid {
position: relative;
width: 100%;
padding: 50px 0;
background: #FFFFFF;
.calendar {
position: relative;
width: 410px;
height: 386px;
margin-right: 40px;
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);
border-radius: 25px;
background: #F8F8F8;
overflow: hidden;
.calendar-title {
position: absolute;
top: 10px;
left: 100px;
font-size: 20px;
font-weight: bold;
color: #2575FA;
}
.wh_content_all {
width: 410px;
margin: 0;
padding: 0 0 20px 0;
background: #f8f8f8;
.wh_top_changge {
.wh_content_li {
position: relative;
left: 50px;
font-size: 20px;
font-weight: bold;
color: #000000;
}
.wh_jiantou1,
.wh_jiantou2 {
border-color: #858585;
}
}
// 日历天数
.wh_content {
width: 372px;
margin: 0 20px;
padding: 0;
.wh_content_item {
width: 50px;
height: 50px;
margin: 0 3px 3px 0;
padding: 0;
.wh_top_tag {
width: 50px;
height: 50px;
color: #666666;
}
.wh_item_date,
.wh_chose_day {
width: 50px;
height: 50px;
border-radius: 0;
background: #FFFFFF;
font-size: 20px;
font-weight: bold;
color: #000000;
}
.wh_other_dayhide {
color: #CCCCCC;
}
.wh_isMark {
position: relative;
}
.wh_isMark::after {
position: absolute;
bottom: 4px;
content: '';
width: 10px;
height: 10px;
border-radius: 50%;
background: #D02F1E;
}
.wh_isToday {
width: 50px;
height: 50px;
border-radius: 0;
background: #2575fa;
color: #FFFFFF;
}
}
.wh_content_item:nth-child(6),
.wh_content_item:nth-child(7) {
.wh_top_tag {
color: #D02F1E;
}
}
}
}
}
.title {
> span:nth-child(1) {
margin-right: 16px;
font-size: @fontSize10;
}
> span:nth-child(2) {
margin-bottom: 2px;
font-size: @fontSize01;
}
}
.title-extra {
padding-bottom: 4px;
}
.list {
width: 750px;
span:nth-child(1) {
max-width: 830px;
margin-top: 32px;
font-size: @fontSize02;
}
span:nth-child(2) {
font-size: @fontSize02;
color: @colorGrey60;
}
}
.nothing {
width: 750px;
height: 200px;
img {
height: 100px;
margin-bottom: 20px;
}
}
.home-signin {
position: absolute;
top: 60px;
right: 0;
width: 206px;
height: 300px;
padding: 24px 0;
background-image: url('../assets/bg-02.png');
background-repeat: no-repeat;
background-size: 206px 300px;
box-shadow: 0px 0px 30px 0px rgba(41, 41, 41, 0.1);
border-radius: 16px;
// 未登录状态样式
.home-signin-entry {
height: 34px;
margin-bottom: 26px;
div {
width: 50%;
}
.home-signin-entry-active {
padding-bottom: 8px;
border-bottom: 4px #D02F1E solid;
text-align: center;
font-size: @fontSize04;
font-weight: 800;
}
.home-signin-entry-inactive {
padding-bottom: 8px;
border-bottom: 2px#FFFFFF solid;
font-size: @fontSize02;
}
}
.home-signin-identity {
height: 190px;
}
.home-signin-item {
width: 100%;
height: 64px;
padding: 0 36px;
span {
font-size: @fontSize03;
}
img {
width: 40px;
margin-right: 14px;
}
}
.home-signin-item:hover {
background: #ffffff;
box-shadow: 0px 0px 30px 0px rgba(42, 42, 42, 0.15);
}
// 登录相关样式
.home-signin-identity-img {
width: 100%;
img {
width: 44px;
height: 44px;
}
}
.home-signin-name {
width: 100%;
min-height: 40px;
margin-top: 26px;
> span {
text-align: center;
}
}
.home-signin-notify {
width: 166px;
height: 54px;
margin: 26px 20px;
border-top: 1px #cccccc dashed;
border-bottom: 1px #cccccc dashed;
.el-badge {
height: 20px;
}
span {
height: 24px;
margin-left: 10px;
}
}
.home-signin-state {
width: 100%;
padding: 0 20px;
> span {
font-size: @fontSize01;
}
}
}
}
.notice {
width: 100%;
height: 674px;
padding: 50px 0;
background-image: url('../assets/bg-03.png');
background-repeat: no-repeat;
.notice-title {
margin-bottom: 30px;
}
.notice-type {
width: 156px;
height: 66px;
margin-bottom: 2px;
border-radius: 15px 0px 0px 15px;
background: #EEEEEE;
}
.notice-type-active {
border: 1px @colorBlue solid;
color: @colorWhite;
background: #3e8ddc;
}
.notice-list {
width: 1044px;
padding: 24px 20px;
background: #FFFFFF;
border-radius: 0px 15px 15px 0px;
.notice-item-title {
height: 70px;
border-bottom: 1px #E5E5E5 dashed;
span:nth-child(1) {
width: 130px;
}
span:nth-child(2) {
flex-grow: 1;
max-width: 740px;
margin-right: 40px;
}
span:nth-child(3) {
flex-grow: 1;
width: 96px;
color: @colorGrey60;
text-align: right;
}
}
.notice-item-title-active {
border: none;
}
.notice-item-time-active {
height: 60px;
padding-left: 130px;
color: @colorGrey40;
font-size: @fontSize01;
border-bottom: 1px #E5E5E5 dashed;
i {
margin-right: 6px;
}
}
.notice-item-time {
display: none;
}
}
}
.bidding {
width: 100%;
height: 694px;
padding: 50px 0;
background: #FFFFFF;
.bidding-result {
width: 654px;
}
.bidding-news {
width: 544px;
margin-left: 40px;
.bidding-news-detail {
position: relative;
margin-top: 40px;
padding-left: 44px;
p {
color: #000000;
}
.bidding-news-detail-title {
font-weight: 800;
}
> div {
position: absolute;
top: 44px;
left: 0;
width: 485px;
height: 275px;
padding: 34px;
background: #FFFFFF;
box-shadow: 0px 0px 30px 0px rgba(41,41,41,0.1);
opacity: 0.85;
border-radius: 15px;
.bidding-news-detail-month {
font-size: @fontSize10;
font-weight: 800;
}
.bidding-news-detail-year {
width: 34px;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 4px @colorRed solid;
}
.bidding-news-detail-html {
width: 100%;
height: 40px;
margin-top: 20px;
font-size: @fontSize01 !important;
overflow: hidden;
}
}
img {
width: 100%;
}
}
// 对应后台富文本编辑边框样式
table {
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
th {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
text-align: center;
}
td {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
padding: 3px 5px;
}
}
}
.list {
margin-top: 8px;
.list-item {
height: 70px;
padding: 10px 0;
border-bottom: 1px #E5E5E5 dashed;
> div:nth-child(1) {
> span:nth-child(1) {
max-width: 500px;
}
> span:nth-child(2) {
font-size: @fontSize01;
text-align: right;
color: @colorGrey60;
}
}
> div:nth-child(2) {
font-size: @fontSize01;
color: @colorGrey60;
i {
margin-right: 6px;
}
}
}
.list-item-result {
padding-top: 24px;
}
}
}
.deal {
width: 100%;
padding: 50px 0;
background-image: url('../assets/bg-04.png');
background-repeat: no-repeat;
.deal-title {
padding-left: 30px;
}
.deal-list {
position: relative;
min-height: 100px;
margin: 0 30px;
.arrow-l {
position: absolute;
top: 66px;
left: -30px;
width: 28px;
height: 28px;
}
.arrow-r {
position: absolute;
top: 66px;
right: -30px;
width: 28px;
height: 28px;
}
.deal-item {
width: 602px;
height: 100px;
margin-top: 30px;
padding: 22px 20px;
border-radius: 15px;
> div {
> span:nth-child(1) {
max-width: 450;
}
}
> div:nth-child(2) {
font-size: @fontSize01;
}
}
.deal-item-active {
background: #FFFFFF;
box-shadow: 0px 0px 30px 0px rgba(41,41,41,0.1);
}
}
}
}
</style>
\ No newline at end of file
src/view/personal/supplier-auction.vue
<template>
<!-- 投标管理 - 我竞价的项目 -->
<div class="personal-bid-auction col">
<div class="map row align-c">
<currencyMap :customPath="[{ text: '投标管理', redirect: null }, { text: '我的竞价项目', redirect: null }]"></currencyMap>
</div>
<div class="limit row">
<div class="limit-option">
<el-input v-model="limitProject" placeholder="请输入要检索的项目名称/项目编号"></el-input>
</div>
<div class="limit-option">
<el-select v-model="limitBuyWay" placeholder="项目状态">
<el-option label="竞标中" value="2"></el-option>
<el-option label="已截止" value="3"></el-option>
<el-option label="已结束" value="4"></el-option>
</el-select>
</div>
<div class="limit-operation">
<button class="global-cursor" @click="queryList()">查询</button>
<button class="global-cursor" @click="resetQueryList()">重置</button>
</div>
</div>
<!-- 列表 -->
<div class="list">
<div v-for="(item, index) in noticeList" :key="index">
<div class="item col">
<div class="project-info row con-b align-c" @click="onDetail(item)">
<div class="row align-c">
<span class="global-cursor project-title">{{item.projectName}}</span>
</div>
<div class="row align-c">
<span class="global-color-green">{{item.isWin ? '成交' : ''}}</span>
<span v-if="item.projectState === 1" class="project-state">竞标中</span>
<span v-if="item.projectState === 2" class="project-state">竞标中</span>
<span v-if="item.projectState === 3" class="project-state">已截止</span>
<span v-if="item.projectState === 4" class="project-state">已结束</span>
</div>
</div>
<div class="project-record row con-b align-c">
<div>
<span class="project-close">{{item.timeClose + '　截止报价'}}</span>
<!-- <span class="record-number">共报价&nbsp;<span class="global-color-blue">{{item.quoteNumber}}</span>&nbsp;次</span> -->
<!-- <span class="record-time">{{item.quotationTime}}</span> -->
<!-- <span class="record-quote">报价</span> -->
<!-- <span class="global-cursor record-list" @click="onQueryQuoteRecord(index, item)">记录</span> -->
</div>
<div class="row align-c">
<span v-if="item.projectState === 2" class="global-cursor global-color-blue" @click="onDetail(item, true)">我要报价</span>
</div>
</div>
<div v-if="quoteRecordActive === index" class="quote-record-list">
<div v-for="(item, index) in quoteRecordList" :key="index" class="row">
<span>{{'报价时间：' + item.time}}</span>
<span>{{'报价价格：' + item.price + ' 元'}}</span>
</div>
</div>
</div>
</div>
</div>
<!-- 列表分页 -->
<div class="pagination row">
<el-pagination :total="pagination.total" layout="total, sizes, prev, pager, next, jumper" @size-change="(size) => {onPagination(size, 'size', pagination)}" @current-change="(size) => {onPagination(size, 'current', pagination)}"></el-pagination>
<button>确定</button>
</div>
</div>
</template>
<script>
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iCurrencyMap from '@/components/currency-map.vue'
import iFramePagination from '@/common/frame/pagination/pagination.js'
export default {
components: {
currencyMap: iCurrencyMap,
},
data: function () {
return {
limitProject: '',
limitBuyWay: '',
limitProjectState: '',
noticeList: [],
quoteRecordActive: -1,
quoteRecordList: [],
pagination: {
size: 10,
total: 0,
current: 1,
}
}
},
created: function () {
this.queryList()
},
watch: {
},
methods: {
resetQueryList: function () {
this.limitProject = ''
this.limitBuyWay = ''
this.pagination.current = 1
this.queryList()
},
/**
* 列表查询
* @function
* @returns
*/
queryList: function () {
let funcParam = {
'keyword': this.limitProject,
'state': this.limitBuyWay, // 2 - 竞价中, 3 - 已截止, 4 - 已结束
'pageSize': this.pagination.size,
'pageNo': this.pagination.current
}
iRequest.request(iHost.base + 'bid/zBiddingProject/getHaveBidProjectList', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcList = []
for (let i = 0, len = funcResponse.list.length; i < len; i++) {
let funcItem = {
'noticeId': funcResponse.list[i].id,
'noticeTitle': funcResponse.list[i].title,
'projectId': funcResponse.list[i].id,
'projectName': funcResponse.list[i].projectName,
'projectState': Number(funcResponse.list[i].state),
'projectNumber': funcResponse.list[i].projectNo,
'quoteNumber': funcResponse.list[i].quotationNumber,
'quotationTime': iMiment(funcResponse.list[i].quotationTime).format('YYYY-MM-DD hh:mm:ss'),
'timeClose': iMiment(funcResponse.list[i].biddingEndTime).format('YYYY-MM-DD hh:mm:ss'),
'isWin': funcResponse.list[i].selected,
}
funcList.push(funcItem)
}
this.noticeList = funcList
this.pagination.total = funcResponse.count
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onQueryQuoteRecord: function (funcIndex, funcItem) {
this.quoteRecordList = []
this.quoteRecordActive = funcIndex
let funcParam = {
'pageNo': 1,
'pageSize': 5,
'biddingPackageId': funcItem.id,
}
iRequest.request(iHost.base + 'bid/zBiddingPackageOffer/packageHaveBidLogs', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse.page.list
let funcList = []
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'time': funcRawData[i].createDate,
'price': funcRawData[i].price,
}
funcList.push(funcItem)
}
this.quoteRecordList = funcList
if (this.quoteRecordList.length === 0) {
this.quoteRecordList.push({ 'time': '暂无报价', 'price': 0 })
}
})
.catch((funcError) => {})
},
onDetail: function (funcItem, funcIsQuote) {
if (funcIsQuote) {
this.$router.push('/supplier/detail?type=0' + '&id=' + funcItem.noticeId + '&quote=true')
return
}
this.$router.push('/supplier/detail?type=0' + '&id=' + funcItem.noticeId)
},
/**
* 页码组件
* @function
* @param {number} funcValue
* @param {string} funcType - 数据类型
* @param {object} funcUpdateObject - 记录对象
* @returns
*/
onPagination: function (funcValue, funcType, funcUpdateObject) {
iFramePagination(funcValue, funcType, funcUpdateObject)
this.queryList()
},
}
}
</script>
<style lang="less">
.personal-bid-auction {
padding-bottom: 180px;
.map {
height: 66px;
border-bottom: 1px #EFEFEF solid;
}
.limit {
width: 100%;
margin-top: 22px;
.limit-option {
.el-input,
.el-select {
width: 300px;
margin-right: 20px;
}
button {
width: 120px;
height: 40px;
margin-right: 20px;
border: 1px solid @colorBlue;
border-radius: 5px;
color: @colorBlue;
background: #FFFFFF;
}
}
.limit-operation {
button {
width: 70px;
height: 40px;
margin-right: 20px;
border-radius: 5px;
border: none;
}
button:nth-child(1) {
color: #FFFFFF;
background: @colorBlue;
}
button:nth-child(2) {
color: @colorGrey20;
background: @colorGrey90;
}
}
}
.list {
> div {
margin-top: 20px;
border: 1px #EFEFEF solid;
.item {
.project-info {
min-height: 60px;
padding: 0 20px;
background: #FAFAFA;
.project-title {
padding-right: 40px;
}
.project-close {
width: 250px;
color: #999999;
}
.project-state {
width: 100px;
text-align: right;
color: #999999;
}
}
.project-record {
position: relative;
height: 60px;
padding: 0 20px;
.record-number {
margin-right: 10px;
}
.record-time {
margin-right: 10px;
}
.record-quote {
margin-right: 10px;
}
.record-list {
color: @colorBlue;
}
}
.quote-record-list {
min-height: 30px;
padding: 20px 20px;
font-size: @fontSize01;
background: #FFFFFF;
span {
margin-right: 110px;
}
}
}
}
}
.pagination {
margin-top: 60px;
> button {
width: 70px;
height: 46px;
color: #FFFFFF;
border: none;
font-size: @fontSize02;
background: #00468C;
}
}
}
</style>
<template>
<!-- 投标管理 - 我竞价的项目 -->
<div class="personal-bid-auction col">
<div class="map row align-c">
<currencyMap :customPath="[{ text: '投标管理', redirect: null }, { text: '我的竞价项目', redirect: null }]"></currencyMap>
</div>
<div class="limit row">
<div class="limit-option">
<el-input v-model="limitProject" placeholder="请输入要检索的项目名称/项目编号"></el-input>
</div>
<div class="limit-option">
<el-select v-model="limitBuyWay" placeholder="项目状态">
<el-option label="竞标中" value="2"></el-option>
<el-option label="已截止" value="3"></el-option>
<el-option label="已结束" value="4"></el-option>
</el-select>
</div>
<div class="limit-operation">
<button class="global-cursor" @click="queryList()">查询</button>
<button class="global-cursor" @click="resetQueryList()">重置</button>
</div>
</div>
<!-- 列表 -->
<div class="list">
<div v-for="(item, index) in noticeList" :key="index">
<div class="item col">
<div class="project-info row con-b align-c" @click="onDetail(item)">
<div class="row align-c">
<span class="global-cursor project-title">{{item.projectName}}</span>
</div>
<div class="row align-c">
<span class="global-color-green">{{item.isWin ? '成交' : ''}}</span>
<span v-if="item.projectState === 1" class="project-state">待竞价</span>
<span v-if="item.projectState === 2" class="project-state">竞标中</span>
<span v-if="item.projectState === 3" class="project-state">已截止</span>
<span v-if="item.projectState === 4" class="project-state">已结束</span>
<span v-if="item.projectState === 5" class="project-state">已暂停</span>
<span v-if="item.projectState === 6" class="project-state">已终止</span>
</div>
</div>
<div class="project-record row con-b align-c">
<div>
<span class="project-close">{{item.timeClose + '　截止报价'}}</span>
<!-- <span class="record-number">共报价&nbsp;<span class="global-color-blue">{{item.quoteNumber}}</span>&nbsp;次</span> -->
<!-- <span class="record-time">{{item.quotationTime}}</span> -->
<!-- <span class="record-quote">报价</span> -->
<!-- <span class="global-cursor record-list" @click="onQueryQuoteRecord(index, item)">记录</span> -->
</div>
<div class="row align-c">
<span v-if="item.projectState === 2" class="global-cursor global-color-blue" @click="onDetail(item, true)">我要报价</span>
</div>
</div>
<div v-if="quoteRecordActive === index" class="quote-record-list">
<div v-for="(item, index) in quoteRecordList" :key="index" class="row">
<span>{{'报价时间：' + item.time}}</span>
<span>{{'报价价格：' + item.price + ' 元'}}</span>
</div>
</div>
</div>
</div>
</div>
<!-- 列表分页 -->
<div class="pagination row">
<el-pagination :total="pagination.total" layout="total, sizes, prev, pager, next, jumper" @size-change="(size) => {onPagination(size, 'size', pagination)}" @current-change="(size) => {onPagination(size, 'current', pagination)}"></el-pagination>
<button>确定</button>
</div>
</div>
</template>
<script>
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iCurrencyMap from '@/components/currency-map.vue'
import iFramePagination from '@/common/frame/pagination/pagination.js'
export default {
components: {
currencyMap: iCurrencyMap,
},
data: function () {
return {
limitProject: '',
limitBuyWay: '',
limitProjectState: '',
noticeList: [],
quoteRecordActive: -1,
quoteRecordList: [],
pagination: {
size: 10,
total: 0,
current: 1,
}
}
},
created: function () {
this.queryList()
},
watch: {
},
methods: {
resetQueryList: function () {
this.limitProject = ''
this.limitBuyWay = ''
this.pagination.current = 1
this.queryList()
},
/**
* 列表查询
* @function
* @returns
*/
queryList: function () {
let funcParam = {
'keyword': this.limitProject,
'state': this.limitBuyWay, // 2 - 竞价中, 3 - 已截止, 4 - 已结束
'pageSize': this.pagination.size,
'pageNo': this.pagination.current
}
iRequest.request(iHost.base + 'bid/zBiddingProject/getHaveBidProjectList', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcList = []
for (let i = 0, len = funcResponse.list.length; i < len; i++) {
let funcItem = {
'noticeId': funcResponse.list[i].id,
'noticeTitle': funcResponse.list[i].title,
'projectId': funcResponse.list[i].id,
'projectName': funcResponse.list[i].projectName,
'projectState': Number(funcResponse.list[i].state),
'projectNumber': funcResponse.list[i].projectNo,
'quoteNumber': funcResponse.list[i].quotationNumber,
'quotationTime': iMiment(funcResponse.list[i].quotationTime).format('YYYY-MM-DD hh:mm:ss'),
'timeClose': iMiment(funcResponse.list[i].biddingEndTime).format('YYYY-MM-DD hh:mm:ss'),
'isWin': funcResponse.list[i].selected,
}
funcList.push(funcItem)
}
this.noticeList = funcList
this.pagination.total = funcResponse.count
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onQueryQuoteRecord: function (funcIndex, funcItem) {
this.quoteRecordList = []
this.quoteRecordActive = funcIndex
let funcParam = {
'pageNo': 1,
'pageSize': 5,
'biddingPackageId': funcItem.id,
}
iRequest.request(iHost.base + 'bid/zBiddingPackageOffer/packageHaveBidLogs', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse.page.list
let funcList = []
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'time': funcRawData[i].createDate,
'price': funcRawData[i].price,
}
funcList.push(funcItem)
}
this.quoteRecordList = funcList
if (this.quoteRecordList.length === 0) {
this.quoteRecordList.push({ 'time': '暂无报价', 'price': 0 })
}
})
.catch((funcError) => {})
},
onDetail: function (funcItem, funcIsQuote) {
if (funcIsQuote) {
this.$router.push('/supplier/detail?type=0' + '&id=' + funcItem.noticeId + '&quote=true')
return
}
this.$router.push('/supplier/detail?type=0' + '&id=' + funcItem.noticeId)
},
/**
* 页码组件
* @function
* @param {number} funcValue
* @param {string} funcType - 数据类型
* @param {object} funcUpdateObject - 记录对象
* @returns
*/
onPagination: function (funcValue, funcType, funcUpdateObject) {
iFramePagination(funcValue, funcType, funcUpdateObject)
this.queryList()
},
}
}
</script>
<style lang="less">
.personal-bid-auction {
padding-bottom: 180px;
.map {
height: 66px;
border-bottom: 1px #EFEFEF solid;
}
.limit {
width: 100%;
margin-top: 22px;
.limit-option {
.el-input,
.el-select {
width: 300px;
margin-right: 20px;
}
button {
width: 120px;
height: 40px;
margin-right: 20px;
border: 1px solid @colorBlue;
border-radius: 5px;
color: @colorBlue;
background: #FFFFFF;
}
}
.limit-operation {
button {
width: 70px;
height: 40px;
margin-right: 20px;
border-radius: 5px;
border: none;
}
button:nth-child(1) {
color: #FFFFFF;
background: @colorBlue;
}
button:nth-child(2) {
color: @colorGrey20;
background: @colorGrey90;
}
}
}
.list {
> div {
margin-top: 20px;
border: 1px #EFEFEF solid;
.item {
.project-info {
min-height: 60px;
padding: 0 20px;
background: #FAFAFA;
.project-title {
padding-right: 40px;
}
.project-close {
width: 250px;
color: #999999;
}
.project-state {
width: 100px;
text-align: right;
color: #999999;
}
}
.project-record {
position: relative;
height: 60px;
padding: 0 20px;
.record-number {
margin-right: 10px;
}
.record-time {
margin-right: 10px;
}
.record-quote {
margin-right: 10px;
}
.record-list {
color: @colorBlue;
}
}
.quote-record-list {
min-height: 30px;
padding: 20px 20px;
font-size: @fontSize01;
background: #FFFFFF;
span {
margin-right: 110px;
}
}
}
}
}
.pagination {
margin-top: 60px;
> button {
width: 70px;
height: 46px;
color: #FFFFFF;
border: none;
font-size: @fontSize02;
background: #00468C;
}
}
}
</style>
src/view/personal/supplier-home.vue
<template>
<!-- 用户中心首页 -->
<div class="supplier-home col">
<div class="biding row con-b align-c">
<div class="company">
<span class="global-color-blue">{{info.name}}</span>
</div>
<div class="row">
<div class="biding-item col align-c">
<span class="global-color-blue">{{quantityBid}}</span>
<span>招标采购中</span>
</div>
<div class="biding-item col align-c">
<span class="global-color-green">{{quantityQualification}}</span>
<span>资格预审中</span>
</div>
<div class="biding-item col align-c">
<span class="global-color-yellowe">{{quantityAuction}}</span>
<span>竞价中</span>
</div>
</div>
</div>
<div class="other-data row con-b">
<div>
<!-- 我的投标项目 -->
<div>
<div class="title title-decorate row con-b align-c">
<span>我的投标项目</span>
<span class="global-cursor" @click="onMore('bid')">更多</span>
</div>
<div class="list">
<div v-for="(item, index) in listBid" :key="index" class="bid-item">
<div class="bid-item-top col con-b">
<div class="row con-b">
<span class="global-cursor" @click="onDetail(item)">{{item.projectName}}</span>
<span class="project-state global-color-grey" v-if="item.projectState === 0">待公告</span>
<span class="project-state global-color-red" v-if="item.projectState === 1">公告中</span>
<span class="project-state global-color-grey" v-if="item.projectState === 2">已开标</span>
<span class="project-state global-color-grey" v-if="item.projectState === 3">已结束</span>
</div>
<div class="row con-b">
<span class="global-color-grey">{{item.projectNumber}}</span>
<span v-if="item.operationState === 0">&nbsp;</span>
<span v-if="item.operationState === 1" class="global-color-green">中标</span>
<span v-if="item.operationState === 2">&nbsp;</span>
</div>
</div>
<div class="bid-item-bottom row con-b align-c">
<span class="global-color-grey">{{item.timeClose + '　截止投标'}}</span>
<span v-if="item.projectState !== 3" class="global-enable-font global-cursor" @click="onBidDocument(item)">下载标书</span>
<span v-if="item.projectState === 3"></span>
</div>
</div>
<div v-if="listBid.length === 0">
<span>暂无数据</span>
</div>
</div>
</div>
<!-- 我参与竞价的项目 -->
<div>
<div class="title title-decorate row con-b align-c">
<span>我参与竞价的项目</span>
<span class="global-cursor" @click="onMore('quote')">更多</span>
</div>
<div class="list">
<div v-for="(item, index) in listAuction" :key="index" class="bid-item">
<div class="bid-item-top col con-b">
<div class="row con-b">
<span class="global-cursor" @click="onDetail(item)">{{item.projectName}}</span>
<span v-if="item.projectState === 2" class="global-color-yellow">竞价中</span>
<span v-if="item.projectState === 3" class="global-color-grey">已截止</span>
<span v-if="item.projectState === 4" class="global-color-grey">已结束</span>
</div>
<div class="row con-b align-c">
<span class="global-color-grey">{{item.projectNumber}}</span>
<span class="global-color-green">{{item.isWin ? '成交' : ''}}</span>
</div>
</div>
<div class="bid-item-bottom row con-b align-c">
<span>共报价&nbsp;<span class="global-color-blue">{{item.quoteNumber}}</span>&nbsp;次</span>
<span v-if="item.projectState === 2" class="global-color-blue global-cursor" @click="onQuote(item)">继续报价</span>
<span v-if="item.projectState === 3">&nbsp;</span>
<span v-if="item.projectState === 4">&nbsp;</span>
</div>
</div>
<div v-if="listAuction.length === 0">
<span>暂无数据</span>
</div>
</div>
</div>
</div>
<div>
<!-- 最新通知 -->
<div>
<div class="title title-decorate row align-c">
<span>最新通知</span>
<span class="global-cursor" @click="onMore('notify')">更多</span>
</div>
<div class="list">
<div v-for="(item, index) in listNotify" :key="index" class="bid-notice row align-c">
<span class="global-cursor global-overflow-ellipsis" @click="onDeatilNotify(item)">{{item.title}}</span>
<span>{{item.time}}</span>
</div>
<div v-if="listNotify.length === 0">
<span>暂无数据</span>
</div>
</div>
</div>
<!-- 今日开标 -->
<div class="open-bid">
<div class="title title-decorate row align-c">
<span>今日开标</span>
</div>
<div class="list">
<div v-for="(item, index) in listBidOpen" :key="index" class="bid-notice row align-c">
<span class="global-cursor global-overflow-ellipsis" @click="onPublicDetail(item)">{{item.noticeTitle}}</span>
<span>{{item.timeRelease}}</span>
</div>
<div v-if="listBidOpen.length === 0">
<span>今日暂无开标项目</span>
</div>
</div>
</div>
</div>
</div>
<el-dialog title="通知" :visible.sync="winDialog" :lock-scroll="false" width="800px" :close-on-click-modal="false">
<span>{{notifyContent}}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="winDialog = false">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iDictionary from '@/common/js/dictionary.js'
export default {
components: {
},
data: function () {
return {
rawBidOpen: [], // 今日开标
rawNotice: [], // 通知列表
rawBid: [], // 我的投标
rawPrice: [], // 我的竞价
listBidOpen: [], // 今日开标
listNotify: [], // 通知列表
listBid: [], // 我的投标
listAuction: [], // 我的竞价
quantityBid: 0,
quantityAuction: 0,
quantityQualification: 0,
notifyContent: [],
winDialog: false,
}
},
created: function () {
this.getRawData()
},
computed: {
info: function () {
return this.$store.state.info
},
},
watch: {
info: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
}
},
methods: {
getRawData: function () {
let funcParam = {
'pageNo': 1,
'pageSize': 3
}
let funcNowBid = iRequest.request(iHost.base + 'bid/zIndex/todayOpenTender', { 'isCompany': 1 }, 'json', 'get')
.then((funcResponse) => {
this.rawBidOpen = funcResponse
})
let funcBid = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiCompanyTender', { 'pageNo': 1, 'pageSize': 3 }, 'json', 'post')
.then((funcResponse) => {
this.rawBid = funcResponse.list
})
let funcPrice = iRequest.request(iHost.base + 'bid/zBiddingProject/getHaveBidProjectList',funcParam , 'json', 'post')
.then((funcResponse) => {
this.rawPrice = funcResponse.list
})
let funcTotal = iRequest.request(iHost.base + 'bid/zUserCompany/getLoginUserInfo', {}, 'json', 'get')
.then((funcResponse) => {
this.quantityBid = funcResponse.tenderNum
this.quantityAuction = funcResponse.biddingNum
this.quantityQualification = funcResponse.qualificationNum
})
let funcNotify = iRequest.request(iHost.base + 'bid/zNotification/getApiList', {'pageNo': 1, 'pageSize': 5, 'userType': 2 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse.list
let funcList = []
for (let i = 0, l = funcRawData.length; i < l; i++) {
let funcItem = {
'id': funcRawData[i].id,
'time': funcRawData[i].createDate,
'title': funcRawData[i].content,
'isRead': funcRawData[i].readStatus === '1' ? true : false,
}
funcList.push(funcItem)
}
this.listNotify = funcList
})
Promise.all([ funcBid, funcPrice, funcPrice, funcTotal ])
.then((funcResponse) => {
this.setHomeData()
})
.catch((funcError) => {
console.log(funcError)
})
},
setHomeData: function () {
this.setBid()
this.setPrice()
this.setBidOpen()
},
setBid: function () {
let funcRawData = this.rawBid
let funcList = []
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].tenderNoticeId,
'noticeType': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'noticeTitle': funcRawData[i].title,
'projectId': funcRawData[i].tenderProjectId,
'projectName': funcRawData[i].projectName,
'projectState': Number(funcRawData[i].projectState),
'projectNumber': funcRawData[i].projectNo,
'enrollTime': funcRawData[i].enrollTime,
'operationState': funcRawData[i].tenderState ? Number(funcRawData[i].tenderState) : 3,
'timeClose': iMiment(funcRawData[i].applyEndTime).format('YYYY年MM月DD日 hh:mm'),
}
funcList.push(funcItem)
}
this.listBid = funcList
},
setPrice: function () {
let funcRawData = this.rawPrice
let funcList = []
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeTitle': funcRawData[i].title,
'noticeType:': 0,
'projectId': funcRawData[i].tenderProjectId,
'projectName': funcRawData[i].projectName,
'projectState': Number(funcRawData[i].state),
'projectNumber': funcRawData[i].projectNo,
'quotaTime': funcRawData[i].quotationTime,
'quoteNumber': funcRawData[i].quotationNumber,
'timeRelease': iMiment(funcRawData[i].biddingBeginTime).format('YYYY年MM月DD日'),
'timeClose': iMiment(funcRawData[i].biddingEndTime).format('YYYY年MM月DD日'),
'isWin': funcRawData[i].selected,
}
funcList.push(funcItem)
}
this.listAuction = funcList
},
setBidOpen: function () {
let funcList = []
let funcRawData = this.rawBidOpen
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'noticeTitle': funcRawData[i].title,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
}
funcList.push(funcItem)
}
this.listBidOpen = funcList
},
onBidDocument: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/supplier/detail', query: { type: funcItem.noticeType, id: funcItem.noticeId, quote: true }})
window.open(funcNoticeUrl .href, '_blank')
},
onMore: function (funcType) {
switch (funcType) {
case 'bid':
this.$router.push('/supplier/bidding')
break
case 'quote':
this.$router.push('/supplier/auction')
break
case 'notify':
this.$router.push('/supplier/notify')
break
}
},
onDetail: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/supplier/detail', query: { type: funcItem.noticeType, id: funcItem.noticeId }})
window.open(funcNoticeUrl .href, '_blank')
},
onDeatilNotify: function (funcItem) {
iRequest.request(iHost.base + 'bid/zNotification/getApiDetail', { 'notificationId': funcItem.id }, 'json', 'post')
.then((funcResponse) => {
this.winDialog = true
this.notifyContent = funcResponse.content
this.$store.commit('notify', Math.round(new Date() / 1000))
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onPublicDetail: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/bid/notice', query: { type: funcItem.noticeType, id: funcItem.noticeId }})
window.open(funcNoticeUrl .href, '_blank')
},
onQuote: function (funcItem) {
this.$router.push('/supplier/detail?type=0&id=' + funcItem.noticeId + '&quote=true')
},
},
}
</script>
<style lang="less">
.supplier-home {
.biding {
width: 100%;
min-width: 800px;
height: 82px;
border-bottom: 1px #EFEFEF solid;
.company {
font-size: @fontSize04;
}
.biding-item {
margin: 0 30px;
> span:nth-child(1) {
font-size: @fontSize09;
}
> span:nth-child(2) {
color: #656565;
font-size: @fontSize01;
}
}
}
.other-data {
> div {
width: calc(50% - 15px);
> div {
margin-bottom: 40px;
}
}
.project-state {
min-width: 50px;
margin-left: 20px;
}
.title {
height: 50px;
margin-bottom: 22px;
border-bottom: 1px #F2F2F2 solid;
span:nth-child(1) {
flex-grow: 1;
font-size: @fontSize04;
font-weight: 800;
}
span:nth-child(2) {
color: #999999;
font-size: @fontSize01;
}
}
.title-decorate:before{
content: '';
display: inline-block;
width: 4px;
height: 20px;
margin-right: 10px;
overflow: hidden;
background-image: linear-gradient(#CF2F1E 20%, #00468C 20%, #00468C 100%);
}
.list {
.bid-item {
height: 140px;
margin-bottom: 22px;
border: 1px #EFEFEF solid;
.bid-item-top {
height: 94px;
padding: 20px;
font-size: @fontSize02;
background: #FAFAFA;
}
.bid-item-bottom {
height: 44px;
padding: 0 20px;
font-size: @fontSize02;
border-top: 1px #EFEFEF solid;
}
}
.bid-notice {
height: 50px;
border-bottom: 1px #EAEAEA dashed;
span:nth-child(1) {
flex-grow: 1;
width: 60%;
max-width: 600px;
margin-left: 12px;
font-size: @fontSize02;
}
span:nth-child(2) {
flex-grow: 1;
text-align: right;
color: #A7A7A7;
}
}
.bid-notice:before{
content: '';
display: inline-block;
width: 2px;
height: 2px;
border-radius: 50%;
background: #000000;
}
}
}
}
</style>
<template>
<!-- 用户中心首页 -->
<div class="supplier-home col">
<div class="biding row con-b align-c">
<div class="company">
<span class="global-color-blue">{{info.name}}</span>
</div>
<div class="row">
<div class="biding-item col align-c">
<span class="global-color-blue">{{quantityBid}}</span>
<span>招标采购中</span>
</div>
<div class="biding-item col align-c">
<span class="global-color-green">{{quantityQualification}}</span>
<span>资格预审中</span>
</div>
<div class="biding-item col align-c">
<span class="global-color-yellowe">{{quantityAuction}}</span>
<span>竞价中</span>
</div>
</div>
</div>
<div class="other-data row con-b">
<div>
<!-- 我的投标项目 -->
<div>
<div class="title title-decorate row con-b align-c">
<span>我的投标项目</span>
<span class="global-cursor" @click="onMore('bid')">更多</span>
</div>
<div class="list">
<div v-for="(item, index) in listBid" :key="index" class="bid-item">
<div class="bid-item-top col con-b">
<div class="row con-b">
<span class="global-cursor" @click="onDetail(item)">{{item.projectName}}</span>
<span class="project-state global-color-grey" v-if="item.projectState === 0">待公告</span>
<span class="project-state global-color-red" v-if="item.projectState === 1">公告中</span>
<span class="project-state global-color-grey" v-if="item.projectState === 2">已开标</span>
<span class="project-state global-color-grey" v-if="item.projectState === 3">已结束</span>
</div>
<div class="row con-b">
<span class="global-color-grey">{{item.projectNumber}}</span>
<span v-if="item.operationState === 0">&nbsp;</span>
<span v-if="item.operationState === 1" class="global-color-green">中标</span>
<span v-if="item.operationState === 2">&nbsp;</span>
</div>
</div>
<div class="bid-item-bottom row con-b align-c">
<span class="global-color-grey">{{item.timeClose + '　截止投标'}}</span>
<span v-if="item.projectState !== 3" class="global-enable-font global-cursor" @click="onBidDocument(item)">下载标书</span>
<span v-if="item.projectState === 3"></span>
</div>
</div>
<div v-if="listBid.length === 0">
<span>暂无数据</span>
</div>
</div>
</div>
<!-- 我参与竞价的项目 -->
<div>
<div class="title title-decorate row con-b align-c">
<span>我参与竞价的项目</span>
<span class="global-cursor" @click="onMore('quote')">更多</span>
</div>
<div class="list">
<div v-for="(item, index) in listAuction" :key="index" class="bid-item">
<div class="bid-item-top col con-b">
<div class="row con-b">
<span class="global-cursor" @click="onDetail(item)">{{item.projectName}}</span>
<span v-if="item.projectState === 1" class="global-color-yellow">待竞价</span>
<span v-if="item.projectState === 2" class="global-color-yellow">竞价中</span>
<span v-if="item.projectState === 3" class="global-color-grey">已截止</span>
<span v-if="item.projectState === 4" class="global-color-grey">已结束</span>
<span v-if="item.projectState === 5" class="global-color-grey">已暂停</span>
<span v-if="item.projectState === 6" class="global-color-grey">已终止</span>
</div>
<div class="row con-b align-c">
<span class="global-color-grey">{{item.projectNumber}}</span>
<span class="global-color-green">{{item.isWin ? '成交' : ''}}</span>
</div>
</div>
<div class="bid-item-bottom row con-b align-c">
<span>共报价&nbsp;<span class="global-color-blue">{{item.quoteNumber}}</span>&nbsp;次</span>
<span v-if="item.projectState === 2" class="global-color-blue global-cursor" @click="onQuote(item)">继续报价</span>
<span v-if="item.projectState === 3">&nbsp;</span>
<span v-if="item.projectState === 4">&nbsp;</span>
</div>
</div>
<div v-if="listAuction.length === 0">
<span>暂无数据</span>
</div>
</div>
</div>
</div>
<div>
<!-- 最新通知 -->
<div>
<div class="title title-decorate row align-c">
<span>最新通知</span>
<span class="global-cursor" @click="onMore('notify')">更多</span>
</div>
<div class="list">
<div v-for="(item, index) in listNotify" :key="index" class="bid-notice row align-c">
<span class="global-cursor global-overflow-ellipsis" @click="onDeatilNotify(item)">{{item.title}}</span>
<span>{{item.time}}</span>
</div>
<div v-if="listNotify.length === 0">
<span>暂无数据</span>
</div>
</div>
</div>
<!-- 今日开标 -->
<div class="open-bid">
<div class="title title-decorate row align-c">
<span>今日开标</span>
</div>
<div class="list">
<div v-for="(item, index) in listBidOpen" :key="index" class="bid-notice row align-c">
<span class="global-cursor global-overflow-ellipsis" @click="onPublicDetail(item)">{{item.noticeTitle}}</span>
<span>{{item.timeRelease}}</span>
</div>
<div v-if="listBidOpen.length === 0">
<span>今日暂无开标项目</span>
</div>
</div>
</div>
</div>
</div>
<el-dialog title="通知" :visible.sync="winDialog" :lock-scroll="false" width="800px" :close-on-click-modal="false">
<span>{{notifyContent}}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="winDialog = false">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iDictionary from '@/common/js/dictionary.js'
export default {
components: {
},
data: function () {
return {
rawBidOpen: [], // 今日开标
rawNotice: [], // 通知列表
rawBid: [], // 我的投标
rawPrice: [], // 我的竞价
listBidOpen: [], // 今日开标
listNotify: [], // 通知列表
listBid: [], // 我的投标
listAuction: [], // 我的竞价
quantityBid: 0,
quantityAuction: 0,
quantityQualification: 0,
notifyContent: [],
winDialog: false,
}
},
created: function () {
this.getRawData()
},
computed: {
info: function () {
return this.$store.state.info
},
},
watch: {
info: {
handler: function (funcNewValue, funcOldValue) {
},
deep: true,
immediate: true,
}
},
methods: {
getRawData: function () {
let funcParam = {
'pageNo': 1,
'pageSize': 3
}
let funcNowBid = iRequest.request(iHost.base + 'bid/zIndex/todayOpenTender', { 'isCompany': 1 }, 'json', 'get')
.then((funcResponse) => {
this.rawBidOpen = funcResponse
})
let funcBid = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiCompanyTender', { 'pageNo': 1, 'pageSize': 3 }, 'json', 'post')
.then((funcResponse) => {
this.rawBid = funcResponse.list
})
let funcPrice = iRequest.request(iHost.base + 'bid/zBiddingProject/getHaveBidProjectList',funcParam , 'json', 'post')
.then((funcResponse) => {
this.rawPrice = funcResponse.list
})
let funcTotal = iRequest.request(iHost.base + 'bid/zUserCompany/getLoginUserInfo', {}, 'json', 'get')
.then((funcResponse) => {
this.quantityBid = funcResponse.tenderNum
this.quantityAuction = funcResponse.biddingNum
this.quantityQualification = funcResponse.qualificationNum
})
let funcNotify = iRequest.request(iHost.base + 'bid/zNotification/getApiList', {'pageNo': 1, 'pageSize': 5, 'userType': 2 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse.list
let funcList = []
for (let i = 0, l = funcRawData.length; i < l; i++) {
let funcItem = {
'id': funcRawData[i].id,
'time': funcRawData[i].createDate,
'title': funcRawData[i].content,
'isRead': funcRawData[i].readStatus === '1' ? true : false,
}
funcList.push(funcItem)
}
this.listNotify = funcList
})
Promise.all([ funcBid, funcPrice, funcPrice, funcTotal ])
.then((funcResponse) => {
this.setHomeData()
})
.catch((funcError) => {
console.log(funcError)
})
},
setHomeData: function () {
this.setBid()
this.setPrice()
this.setBidOpen()
},
setBid: function () {
let funcRawData = this.rawBid
let funcList = []
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].tenderNoticeId,
'noticeType': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'noticeTitle': funcRawData[i].title,
'projectId': funcRawData[i].tenderProjectId,
'projectName': funcRawData[i].projectName,
'projectState': Number(funcRawData[i].projectState),
'projectNumber': funcRawData[i].projectNo,
'enrollTime': funcRawData[i].enrollTime,
'operationState': funcRawData[i].tenderState ? Number(funcRawData[i].tenderState) : 3,
'timeClose': iMiment(funcRawData[i].applyEndTime).format('YYYY年MM月DD日 hh:mm'),
}
funcList.push(funcItem)
}
this.listBid = funcList
},
setPrice: function () {
let funcRawData = this.rawPrice
let funcList = []
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeTitle': funcRawData[i].title,
'noticeType:': 0,
'projectId': funcRawData[i].tenderProjectId,
'projectName': funcRawData[i].projectName,
'projectState': Number(funcRawData[i].state),
'projectNumber': funcRawData[i].projectNo,
'quotaTime': funcRawData[i].quotationTime,
'quoteNumber': funcRawData[i].quotationNumber,
'timeRelease': iMiment(funcRawData[i].biddingBeginTime).format('YYYY年MM月DD日'),
'timeClose': iMiment(funcRawData[i].biddingEndTime).format('YYYY年MM月DD日'),
'isWin': funcRawData[i].selected,
}
funcList.push(funcItem)
}
this.listAuction = funcList
},
setBidOpen: function () {
let funcList = []
let funcRawData = this.rawBidOpen
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'noticeId': funcRawData[i].id,
'noticeType': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'noticeTitle': funcRawData[i].title,
'timeRelease': iMiment(funcRawData[i].releaseTime).format('YYYY-MM-DD'),
}
funcList.push(funcItem)
}
this.listBidOpen = funcList
},
onBidDocument: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/supplier/detail', query: { type: funcItem.noticeType, id: funcItem.noticeId, quote: true }})
window.open(funcNoticeUrl .href, '_blank')
},
onMore: function (funcType) {
switch (funcType) {
case 'bid':
this.$router.push('/supplier/bidding')
break
case 'quote':
this.$router.push('/supplier/auction')
break
case 'notify':
this.$router.push('/supplier/notify')
break
}
},
onDetail: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/supplier/detail', query: { type: funcItem.noticeType, id: funcItem.noticeId }})
window.open(funcNoticeUrl .href, '_blank')
},
onDeatilNotify: function (funcItem) {
iRequest.request(iHost.base + 'bid/zNotification/getApiDetail', { 'notificationId': funcItem.id }, 'json', 'post')
.then((funcResponse) => {
this.winDialog = true
this.notifyContent = funcResponse.content
this.$store.commit('notify', Math.round(new Date() / 1000))
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
onPublicDetail: function (funcItem) {
let funcNoticeUrl = this.$router.resolve({ path: '/bid/notice', query: { type: funcItem.noticeType, id: funcItem.noticeId }})
window.open(funcNoticeUrl .href, '_blank')
},
onQuote: function (funcItem) {
this.$router.push('/supplier/detail?type=0&id=' + funcItem.noticeId + '&quote=true')
},
},
}
</script>
<style lang="less">
.supplier-home {
.biding {
width: 100%;
min-width: 800px;
height: 82px;
border-bottom: 1px #EFEFEF solid;
.company {
font-size: @fontSize04;
}
.biding-item {
margin: 0 30px;
> span:nth-child(1) {
font-size: @fontSize09;
}
> span:nth-child(2) {
color: #656565;
font-size: @fontSize01;
}
}
}
.other-data {
> div {
width: calc(50% - 15px);
> div {
margin-bottom: 40px;
}
}
.project-state {
min-width: 50px;
margin-left: 20px;
}
.title {
height: 50px;
margin-bottom: 22px;
border-bottom: 1px #F2F2F2 solid;
span:nth-child(1) {
flex-grow: 1;
font-size: @fontSize04;
font-weight: 800;
}
span:nth-child(2) {
color: #999999;
font-size: @fontSize01;
}
}
.title-decorate:before{
content: '';
display: inline-block;
width: 4px;
height: 20px;
margin-right: 10px;
overflow: hidden;
background-image: linear-gradient(#CF2F1E 20%, #00468C 20%, #00468C 100%);
}
.list {
.bid-item {
height: 140px;
margin-bottom: 22px;
border: 1px #EFEFEF solid;
.bid-item-top {
height: 94px;
padding: 20px;
font-size: @fontSize02;
background: #FAFAFA;
}
.bid-item-bottom {
height: 44px;
padding: 0 20px;
font-size: @fontSize02;
border-top: 1px #EFEFEF solid;
}
}
.bid-notice {
height: 50px;
border-bottom: 1px #EAEAEA dashed;
span:nth-child(1) {
flex-grow: 1;
width: 60%;
max-width: 600px;
margin-left: 12px;
font-size: @fontSize02;
}
span:nth-child(2) {
flex-grow: 1;
text-align: right;
color: #A7A7A7;
}
}
.bid-notice:before{
content: '';
display: inline-block;
width: 2px;
height: 2px;
border-radius: 50%;
background: #000000;
}
}
}
}
</style>
src/view/personal/supplier-notice.js
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iDictionary from '@/common/js/dictionary.js'
let output = function (thisVue, id, type) {
let funcRequestDetail
let funcRequestOther
let funcRequestWinInfo
let funcMap = []
let funcProject = {} // 项目数据
let funcProgress = {} // 进度数据
let funcPackage = [] // 合同数据
let funcAgency = {} // 供应信息
let funcFile = [] // 附件
let funcOther = [] // 相关公告
// 竞价报价公告
if (type === 0) {
console.log('set quoteNotice')
funcMap = [{ text: '工作台首页', redirect: '/supplier' }, { text: '我竞价的项目', redirect: '/supplier/auction' }, { text: '竞价项目详情', redirect: null }]
funcRequestDetail = iRequest.request(iHost.base + 'bid/zBiddingProject/getApiDetail',{ 'id': id } , 'json', 'post')
.then((funcResponse) => {
// 项目信息
funcProject = {
'noticeId': id,
'noticeType': type,
'noticeTitle': funcResponse.title, // 公告标题
'projectId': funcResponse.id, // 项目标识
'projectName': funcResponse.projectName, // 项目名称
'projectIdentity': funcResponse.projectNo, // 项目编号
'buyWay': '', // 采购方式
'buyCompany': funcResponse.company, // 采购公司
'buyCompanyType': funcResponse.companyType, // 采购公司类型
'buyLiaison': funcResponse.companyContactor, // 采购联系人
'buyPhone': funcResponse.companyContact, // 采购电话
'address': '', // 开标地点
'filePrice': '', // 文件价格
'timeRelease': iMiment(funcResponse.releaseTime).format('YYYY年MM月DD日 hh:mm'), // 发布时间
'timeBegin': iMiment(funcResponse.biddingBeginTime).format('YYYY年MM月DD日 hh:mm'), // 开始时间
'timeEnd': iMiment(funcResponse.biddingEndTime).format('YYYY年MM月DD日 hh:mm'), // 结束时间
'timeClose': '', // 截止时间
'timeTimestampRelease': iMiment(funcResponse.releaseTime).stamp(),
'timeTimestampBegin': iMiment(funcResponse.biddingBeginTime).stamp(),
'timeTimestampEnd': iMiment(funcResponse.biddingEndTime).stamp(),
'timeTimestampClose': 1577808000000,
'contentTitle': '内容说明',
'contentHtml': funcResponse.biddingExplain,
'isOnline': true,
}
thisVue.$store.commit('componentProject', funcProject)
// 竞价表格
let funcRawData = funcResponse.packageAll
funcRawData.sort(function(a, b) {
let funcMainWeight = 1000
// 计算 a 的索引权重
let funcIndex = a.index.toString().split('-')
let funcA = Number(funcIndex[0]) * funcMainWeight
if (funcIndex[1]) {
a.isChild = true
funcA = funcA + Number(funcIndex[1])
} else {
a.isChild = false
}
// 计算 b 的索引权重
funcIndex = b.index.toString().split('-')
let funcB = Number(funcIndex[0]) * funcMainWeight
if (funcIndex[1]) {
b.isChild = true
funcB = funcB + Number(funcIndex[1])
} else {
b.isChild = false
}
return funcA - funcB
})
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'index': funcRawData[i].index.toString(), // 序号
'id': funcRawData[i].biddingPackageId, // 标识
'object': funcRawData[i].name ? funcRawData[i].name : '', // 标的
'budget': funcRawData[i].fixedPrice, // 预算金额
'quantity': funcRawData[i].num, // 标的数量
'requirement': funcRawData[i].requirement, // 竞价参数要求
'isChild': funcRawData[i].isChild,
'isWin': funcRawData[i].selected,
}
if (!funcItem.isChild) {
if (funcRawData[i + 1] && funcRawData[i + 1].isChild) {
funcItem.haveChild = true
} else {
funcItem.haveChild = false
}
} else {
funcItem.haveChild = false
}
funcPackage.push(funcItem)
}
thisVue.$store.commit('componentContract', funcPackage)
// 进度组件
funcProgress = {
text: ['发布时间', '竞价时间', '公布结果'],
timestamp: [
funcProject.timeTimestampRelease,
funcProject.timeTimestampBegin,
funcProject.timeTimestampEnd,
funcProject.timeTimestampClose,
],
isBuy: false,
isSignIn: false,
}
thisVue.$store.commit('componentProgress', funcProgress)
// 附件组件
funcRawData = funcResponse.file
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'name': funcRawData[i].name,
'url': funcRawData[i].url
}
funcFile.push(funcItem)
}
thisVue.$store.commit('componentFile', funcFile)
})
.catch((funcError) => {})
funcRequestOther = iRequest.request(iHost.base + 'bid/zBiddingNotice/getApiBiddingRelevantNotices', { 'noticeId': id, 'noticeType': 7, 'isProject': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'type': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'title': funcRawData[i].title,
}
funcOther.push(funcItem)
}
thisVue.$store.commit('componentNotice', funcOther)
})
Promise.all([ funcRequestDetail, funcRequestOther ])
.then(() => {
thisVue.noticeData(funcMap, funcProgress, funcProject, funcPackage, funcAgency, funcFile, funcOther)
})
.catch((funcError) => {
console.log(funcError)
})
}
// 招标采购公告
if (type === 2) {
console.log('set bidNotice')
funcMap = [{ text: '工作台首页', redirect: '/supplier' }, { text: '我投标的项目', redirect: '/supplier/bidding' }, { text: '投标项目详情', redirect: null }]
funcRequestDetail = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiDetail', { 'id': id } , 'json', 'post')
.then((funcResponse) => {
funcProject = {
'noticeId': id,
'noticeType': type,
'noticeTitle': funcResponse.title, // 公告标题
'projectId': funcResponse.tenderProjectId, // 项目标识
'projectName': funcResponse.projectName, // 项目名称
'projectIdentity': funcResponse.projectNo, // 项目编号
'buyWay': funcResponse.procurementType, // 采购方式
'buyCompany': funcResponse.company, // 采购公司
'buyCompanyType': '', // 采购公司类型
'buyLiaison': funcResponse.companyContactor, // 采购联系人
'buyPhone': funcResponse.phone, // 采购电话
'address': funcResponse.area.replace(/\//g, '') + funcResponse.address, // 开标地点
'timeRelease': iMiment(funcResponse.releaseTime).format('YYYY年MM月DD日 hh:mm'), // 发布时间
'timeBegin': iMiment(funcResponse.receiveBeginTime).format('YYYY年MM月DD日 hh:mm'), // 开始时间
'timeEnd': iMiment(funcResponse.receiveEndTime).format('YYYY年MM月DD日 hh:mm'), // 结束时间
'timeClose': iMiment(funcResponse.applyEndTime).format('YYYY年MM月DD日 hh:mm'), // 截止时间
'timeTimestampRelease': iMiment(funcResponse.releaseTime).stamp(),
'timeTimestampBegin': iMiment(funcResponse.receiveBeginTime).stamp(),
'timeTimestampEnd': iMiment(funcResponse.receiveEndTime).stamp(),
'timeTimestampClose': iMiment(funcResponse.applyEndTime).stamp(),
'contentTitle': '公告内容',
'contentHtml': funcResponse.content,
'isOnline': funcResponse.saleOnline === '0' ? false : true,
'isPackage': funcResponse.containPackage === '0' ? false : true,
}
thisVue.$store.commit('componentProject', funcProject)
let funcRawData
if (funcProject.isPackage) {
// 多个合同
funcRawData = funcResponse.package
let funcLastTimeClose = 0
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'index': i + 1,
'id': funcRawData[i].tenderPackageId,
'number': funcRawData[i].no,
'object': funcRawData[i].name,
'quantity': funcRawData[i].num,
'budget': funcRawData[i].amount,
'timeClose': funcRawData[i].openTenderTime,
'fileName': funcRawData[i].files.name,
'fileUrl': funcRawData[i].files.url
}
funcPackage.push(funcItem)
if (funcLastTimeClose < iMiment(funcRawData[i].openTenderTime).stamp()) {
funcLastTimeClose = iMiment(funcRawData[i].openTenderTime).stamp()
}
}
funcProject.timeClose = iMiment(funcLastTimeClose).format('YYYY年MM月DD日 hh:mm')
funcProject.timeTimestampClose = funcLastTimeClose
thisVue.$store.commit('componentProject', funcProject)
} else {
// 单一合同
funcRawData = funcResponse
funcPackage = [{
'index': '',
'id': '',
'number': '',
'object': '',
'quantity': '',
'budget': funcRawData.price,
'timeClose': '',
'fileName': funcRawData.tenderFile.name,
'fileUrl': funcRawData.tenderFile.url
}]
}
thisVue.$store.commit('componentContract', funcPackage)
funcProgress = {
text: ['发布时间', '报名时间', '投标截止、开标时间'],
timestamp: [
funcProject.timeTimestampRelease,
funcProject.timeTimestampBegin,
funcProject.timeTimestampEnd,
funcProject.timeTimestampClose,
],
isBuy: false,
isSignIn: false,
}
thisVue.$store.commit('componentProgress', funcProgress)
funcRawData = funcResponse.agencyInfo
funcAgency = {
'id': funcRawData.agencyInfoId,
'name': funcRawData.companyName,
'address': funcRawData.area.replace(/\//g, '') + funcRawData.address,
'phone': funcRawData.phone,
'liaison': funcRawData.contactor,
'email': funcRawData.email
}
thisVue.$store.commit('componentAgency', funcAgency)
funcRawData = funcResponse.file
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'name': funcRawData[i].name,
'url': funcRawData[i].url,
}
funcFile.push(funcItem)
}
thisVue.$store.commit('componentFile', funcFile)
})
.catch((funcError) => {})
funcRequestOther = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiRelevantNotices', { 'tenderNoticeId': id, 'type': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'type': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'title': funcRawData[i].title,
}
funcOther.push(funcItem)
}
thisVue.$store.commit('componentNotice', funcOther)
})
Promise.all([ funcRequestDetail, funcRequestOther, funcRequestWinInfo ])
.then(() => {
thisVue.noticeData(funcMap, funcProgress, funcProject, funcPackage, funcAgency, funcFile, funcOther)
})
.catch((funcError) => {
console.log(funcError)
})
}
// 资格预审公告
if (type === 3) {
console.log('set qualificationNotice')
funcMap = [{ text: '招标公告', redirect: '/bid' }, { text: '资格预审公告', redirect: null }]
funcRequestDetail = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiDetail', { 'id': id } , 'json', 'post')
.then((funcResponse) => {
funcProject = {
'noticeId': id,
'noticeType': type,
'noticeTitle': funcResponse.title, // 公告标题
'projectId': funcResponse.tenderProjectId, // 项目标识
'projectName': funcResponse.projectName, // 项目名称
'projectIdentity': funcResponse.projectNo, // 项目编号
'buyWay': funcResponse.procurementType, // 采购方式
'buyCompany': funcResponse.company, // 采购公司
'buyCompanyType': '', // 采购公司类型
'buyLiaison': funcResponse.companyContactor, // 采购联系人
'buyPhone': funcResponse.phone, // 采购电话
'address': funcResponse.area.replace(/\//g, '') + funcResponse.address, // 开标地点
'timeRelease': iMiment(funcResponse.releaseTime).format('YYYY年MM月DD日 hh:mm'), // 发布时间
'timeBegin': iMiment(funcResponse.receiveBeginTime).format('YYYY年MM月DD日 hh:mm'), // 开始时间
'timeEnd': iMiment(funcResponse.receiveEndTime).format('YYYY年MM月DD日 hh:mm'), // 结束时间
'timeClose': iMiment(funcResponse.applyEndTime).format('YYYY年MM月DD日 hh:mm'), // 截止时间
'timeTimestampRelease': iMiment(funcResponse.releaseTime).stamp(),
'timeTimestampBegin': iMiment(funcResponse.receiveBeginTime).stamp(),
'timeTimestampEnd': iMiment(funcResponse.receiveEndTime).stamp(),
'timeTimestampClose': iMiment(funcResponse.applyEndTime).stamp(),
'contentTitle': '公告内容',
'contentHtml': funcResponse.content,
'isOnline': funcResponse.saleOnline === '0' ? false : true,
'isPackage': funcResponse.containPackage === '0' ? false : true,
}
thisVue.$store.commit('componentProject', funcProject)
let funcRawData
if (funcProject.isPackage) {
// 多个合同
funcRawData = funcResponse.package
let funcLastTimeClose = 0
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'index': i + 1,
'id': funcRawData[i].tenderPackageId,
'price': funcRawData[i].price,
'number': funcRawData[i].no,
'object': funcRawData[i].name,
'quantity': funcRawData[i].num,
'budget': funcRawData[i].amount,
'timeClose': funcRawData[i].openTenderTime,
'fileName': funcRawData[i].files.name,
'fileUrl': funcRawData[i].files.url
}
funcPackage.push(funcItem)
if (funcLastTimeClose < iMiment(funcRawData[i].openTenderTime).stamp()) {
funcLastTimeClose = iMiment(funcRawData[i].openTenderTime).stamp()
}
}
funcProject.timeClose = iMiment(funcLastTimeClose).format('YYYY年MM月DD日 hh:mm')
funcProject.timeTimestampClose = funcLastTimeClose
thisVue.$store.commit('componentProject', funcProject)
} else {
// 单一合同
funcRawData = funcResponse
funcPackage = [{
'index': '',
'id': '',
'number': '',
'object': '',
'quantity': '',
'budget': funcRawData.price,
'timeClose': '',
}]
}
thisVue.$store.commit('componentContract', funcPackage)
funcProgress = {
text: ['发布时间', '领取资格预审文件时间', '投标截止、开标时间'],
timestamp: [
funcProject.timeTimestampRelease,
funcProject.timeTimestampBegin,
funcProject.timeTimestampEnd,
funcProject.timeTimestampClose,
],
isBuy: false,
isSignIn: false,
}
thisVue.$store.commit('componentProgress', funcProgress)
funcRawData = funcResponse.agencyInfo
funcAgency = {
'id': funcRawData.agencyInfoId,
'name': funcRawData.companyName,
'address': funcRawData.area.replace(/\//g, '') + funcRawData.address,
'phone': funcRawData.phone,
'liaison': funcRawData.contactor,
'email': funcRawData.email
}
thisVue.$store.commit('componentAgency', funcAgency)
funcRawData = funcResponse.file
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'name': funcRawData[i].name,
'url': funcRawData[i].url,
}
funcFile.push(funcItem)
}
thisVue.$store.commit('componentFile', funcFile)
})
.catch((funcError) => {})
funcRequestOther = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiRelevantNotices', { 'tenderNoticeId': id, 'type': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'type': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'title': funcRawData[i].title,
}
funcOther.push(funcItem)
}
thisVue.$store.commit('componentNotice', funcOther)
})
Promise.all([ funcRequestDetail, funcRequestOther, funcRequestWinInfo ])
.then(() => {
thisVue.noticeData(funcMap, funcProgress, funcProject, funcPackage, funcAgency, funcFile, funcOther)
})
.catch((funcError) => {
console.log(funcError)
})
}
}
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iDictionary from '@/common/js/dictionary.js'
let output = function (thisVue, id, type) {
let funcRequestDetail
let funcRequestOther
let funcRequestWinInfo
let funcMap = []
let funcProject = {} // 项目数据
let funcProgress = {} // 进度数据
let funcPackage = [] // 合同数据
let funcAgency = {} // 供应信息
let funcFile = [] // 附件
let funcOther = [] // 相关公告
// 竞价报价公告
if (type === 0) {
funcMap = [{ text: '工作台首页', redirect: '/supplier' }, { text: '我竞价的项目', redirect: '/supplier/auction' }, { text: '竞价项目详情', redirect: null }]
funcRequestDetail = iRequest.request(iHost.base + 'bid/zBiddingProject/getApiDetail',{ 'id': id } , 'json', 'post')
.then((funcResponse) => {
// 项目信息
funcProject = {
'noticeId': id,
'noticeType': type,
'noticeTitle': funcResponse.title, // 公告标题
'projectId': funcResponse.id, // 项目标识
'projectName': funcResponse.projectName, // 项目名称
'projectIdentity': funcResponse.projectNo, // 项目编号
'buyWay': '', // 采购方式
'buyCompany': funcResponse.company, // 采购公司
'buyCompanyType': funcResponse.companyType, // 采购公司类型
'buyLiaison': funcResponse.companyContactor, // 采购联系人
'buyPhone': funcResponse.companyContact, // 采购电话
'address': '', // 开标地点
'filePrice': '', // 文件价格
'state': Number(funcResponse.state),
'timeRelease': iMiment(funcResponse.releaseTime).format('YYYY年MM月DD日 hh:mm'), // 发布时间
'timeBegin': iMiment(funcResponse.biddingBeginTime).format('YYYY年MM月DD日 hh:mm'), // 开始时间
'timeEnd': iMiment(funcResponse.biddingEndTime).format('YYYY年MM月DD日 hh:mm'), // 结束时间
'timeClose': '', // 截止时间
'timeTimestampRelease': iMiment(funcResponse.releaseTime).stamp(),
'timeTimestampBegin': iMiment(funcResponse.biddingBeginTime).stamp(),
'timeTimestampEnd': iMiment(funcResponse.biddingEndTime).stamp(),
'timeTimestampClose': 1577808000000,
'contentTitle': '内容说明',
'contentHtml': funcResponse.biddingExplain,
'isOnline': true,
}
thisVue.$store.commit('componentProject', funcProject)
// 竞价表格
let funcRawData = funcResponse.packageAll
funcRawData.sort(function(a, b) {
let funcMainWeight = 1000
// 计算 a 的索引权重
let funcIndex = a.index.toString().split('-')
let funcA = Number(funcIndex[0]) * funcMainWeight
if (funcIndex[1]) {
a.isChild = true
funcA = funcA + Number(funcIndex[1])
} else {
a.isChild = false
}
// 计算 b 的索引权重
funcIndex = b.index.toString().split('-')
let funcB = Number(funcIndex[0]) * funcMainWeight
if (funcIndex[1]) {
b.isChild = true
funcB = funcB + Number(funcIndex[1])
} else {
b.isChild = false
}
return funcA - funcB
})
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'index': funcRawData[i].index.toString(), // 序号
'id': funcRawData[i].biddingPackageId, // 标识
'object': funcRawData[i].name ? funcRawData[i].name : '', // 标的
'budget': funcRawData[i].fixedPrice, // 预算金额
'quantity': funcRawData[i].num, // 标的数量
'requirement': funcRawData[i].requirement, // 竞价参数要求
'isChild': funcRawData[i].isChild,
'isWin': funcRawData[i].selected,
}
if (!funcItem.isChild) {
if (funcRawData[i + 1] && funcRawData[i + 1].isChild) {
funcItem.haveChild = true
} else {
funcItem.haveChild = false
}
} else {
funcItem.haveChild = false
}
funcPackage.push(funcItem)
}
console.log(funcPackage)
thisVue.$store.commit('componentContract', funcPackage)
// 进度组件
funcProgress = {
text: ['发布时间', '竞价时间', '公布结果'],
timestamp: [
funcProject.timeTimestampRelease,
funcProject.timeTimestampBegin,
funcProject.timeTimestampEnd,
funcProject.timeTimestampClose,
],
isBuy: false,
isSignIn: false,
state: funcProject.state
}
thisVue.$store.commit('componentProgress', funcProgress)
// 附件组件
funcRawData = funcResponse.file
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'name': funcRawData[i].name,
'url': funcRawData[i].url
}
funcFile.push(funcItem)
}
thisVue.$store.commit('componentFile', funcFile)
})
.catch((funcError) => {})
funcRequestOther = iRequest.request(iHost.base + 'bid/zBiddingNotice/getApiBiddingRelevantNotices', { 'noticeId': id, 'noticeType': 7, 'isProject': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse.list
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'type': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'title': funcRawData[i].title,
}
funcOther.push(funcItem)
}
thisVue.$store.commit('componentNotice', funcOther)
})
Promise.all([ funcRequestDetail, funcRequestOther ])
.then(() => {
thisVue.noticeData(funcMap, funcProgress, funcProject, funcPackage, funcAgency, funcFile, funcOther)
})
.catch((funcError) => {
console.log(funcError)
})
}
// 招标采购公告
if (type === 2) {
funcMap = [{ text: '工作台首页', redirect: '/supplier' }, { text: '我投标的项目', redirect: '/supplier/bidding' }, { text: '投标项目详情', redirect: null }]
funcRequestDetail = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiDetail', { 'id': id } , 'json', 'post')
.then((funcResponse) => {
funcProject = {
'noticeId': id,
'noticeType': type,
'noticeTitle': funcResponse.title, // 公告标题
'projectId': funcResponse.tenderProjectId, // 项目标识
'projectName': funcResponse.projectName, // 项目名称
'projectIdentity': funcResponse.projectNo, // 项目编号
'buyWay': funcResponse.procurementType, // 采购方式
'buyCompany': funcResponse.company, // 采购公司
'buyCompanyType': '', // 采购公司类型
'buyLiaison': funcResponse.companyContactor, // 采购联系人
'buyPhone': funcResponse.phone, // 采购电话
'address': funcResponse.area.replace(/\//g, '') + funcResponse.address, // 开标地点
'timeRelease': iMiment(funcResponse.releaseTime).format('YYYY年MM月DD日 hh:mm'), // 发布时间
'timeBegin': iMiment(funcResponse.receiveBeginTime).format('YYYY年MM月DD日 hh:mm'), // 开始时间
'timeEnd': iMiment(funcResponse.receiveEndTime).format('YYYY年MM月DD日 hh:mm'), // 结束时间
'timeClose': iMiment(funcResponse.applyEndTime).format('YYYY年MM月DD日 hh:mm'), // 截止时间
'timeTimestampRelease': iMiment(funcResponse.releaseTime).stamp(),
'timeTimestampBegin': iMiment(funcResponse.receiveBeginTime).stamp(),
'timeTimestampEnd': iMiment(funcResponse.receiveEndTime).stamp(),
'timeTimestampClose': iMiment(funcResponse.applyEndTime).stamp(),
'contentTitle': '公告内容',
'contentHtml': funcResponse.content,
'isOnline': funcResponse.saleOnline === '0' ? false : true,
'isPackage': funcResponse.containPackage === '0' ? false : true,
}
thisVue.$store.commit('componentProject', funcProject)
let funcRawData
if (funcProject.isPackage) {
// 多个合同
funcRawData = funcResponse.package
let funcLastTimeClose = 0
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'index': i + 1,
'id': funcRawData[i].tenderPackageId,
'number': funcRawData[i].no,
'object': funcRawData[i].name,
'quantity': funcRawData[i].num,
'budget': funcRawData[i].amount,
'timeClose': funcRawData[i].openTenderTime,
'fileName': funcRawData[i].files.name,
'fileUrl': funcRawData[i].files.url
}
funcPackage.push(funcItem)
if (funcLastTimeClose < iMiment(funcRawData[i].openTenderTime).stamp()) {
funcLastTimeClose = iMiment(funcRawData[i].openTenderTime).stamp()
}
}
funcProject.timeClose = iMiment(funcLastTimeClose).format('YYYY年MM月DD日 hh:mm')
funcProject.timeTimestampClose = funcLastTimeClose
thisVue.$store.commit('componentProject', funcProject)
} else {
// 单一合同
funcRawData = funcResponse
funcPackage = [{
'index': '',
'id': '',
'number': '',
'object': '',
'quantity': '',
'budget': funcRawData.price,
'timeClose': '',
'fileName': funcRawData.tenderFile.name,
'fileUrl': funcRawData.tenderFile.url
}]
}
thisVue.$store.commit('componentContract', funcPackage)
funcProgress = {
text: ['发布时间', '报名时间', '投标截止、开标时间'],
timestamp: [
funcProject.timeTimestampRelease,
funcProject.timeTimestampBegin,
funcProject.timeTimestampEnd,
funcProject.timeTimestampClose,
],
isBuy: false,
isSignIn: false,
}
thisVue.$store.commit('componentProgress', funcProgress)
funcRawData = funcResponse.agencyInfo
funcAgency = {
'id': funcRawData.agencyInfoId,
'name': funcRawData.companyName,
'address': funcRawData.area.replace(/\//g, '') + funcRawData.address,
'phone': funcRawData.phone,
'liaison': funcRawData.contactor,
'email': funcRawData.email
}
thisVue.$store.commit('componentAgency', funcAgency)
funcRawData = funcResponse.file
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'name': funcRawData[i].name,
'url': funcRawData[i].url,
}
funcFile.push(funcItem)
}
thisVue.$store.commit('componentFile', funcFile)
})
.catch((funcError) => {})
funcRequestOther = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiRelevantNotices', { 'tenderNoticeId': id, 'type': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'type': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'title': funcRawData[i].title,
}
funcOther.push(funcItem)
}
thisVue.$store.commit('componentNotice', funcOther)
})
Promise.all([ funcRequestDetail, funcRequestOther, funcRequestWinInfo ])
.then(() => {
thisVue.noticeData(funcMap, funcProgress, funcProject, funcPackage, funcAgency, funcFile, funcOther)
})
.catch((funcError) => {
console.log(funcError)
})
}
// 资格预审公告
if (type === 3) {
funcMap = [{ text: '招标公告', redirect: '/bid' }, { text: '资格预审公告', redirect: null }]
funcRequestDetail = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiDetail', { 'id': id } , 'json', 'post')
.then((funcResponse) => {
funcProject = {
'noticeId': id,
'noticeType': type,
'noticeTitle': funcResponse.title, // 公告标题
'projectId': funcResponse.tenderProjectId, // 项目标识
'projectName': funcResponse.projectName, // 项目名称
'projectIdentity': funcResponse.projectNo, // 项目编号
'buyWay': funcResponse.procurementType, // 采购方式
'buyCompany': funcResponse.company, // 采购公司
'buyCompanyType': '', // 采购公司类型
'buyLiaison': funcResponse.companyContactor, // 采购联系人
'buyPhone': funcResponse.phone, // 采购电话
'address': funcResponse.area.replace(/\//g, '') + funcResponse.address, // 开标地点
'timeRelease': iMiment(funcResponse.releaseTime).format('YYYY年MM月DD日 hh:mm'), // 发布时间
'timeBegin': iMiment(funcResponse.receiveBeginTime).format('YYYY年MM月DD日 hh:mm'), // 开始时间
'timeEnd': iMiment(funcResponse.receiveEndTime).format('YYYY年MM月DD日 hh:mm'), // 结束时间
'timeClose': iMiment(funcResponse.applyEndTime).format('YYYY年MM月DD日 hh:mm'), // 截止时间
'timeTimestampRelease': iMiment(funcResponse.releaseTime).stamp(),
'timeTimestampBegin': iMiment(funcResponse.receiveBeginTime).stamp(),
'timeTimestampEnd': iMiment(funcResponse.receiveEndTime).stamp(),
'timeTimestampClose': iMiment(funcResponse.applyEndTime).stamp(),
'contentTitle': '公告内容',
'contentHtml': funcResponse.content,
'isOnline': funcResponse.saleOnline === '0' ? false : true,
'isPackage': funcResponse.containPackage === '0' ? false : true,
}
thisVue.$store.commit('componentProject', funcProject)
let funcRawData
if (funcProject.isPackage) {
// 多个合同
funcRawData = funcResponse.package
let funcLastTimeClose = 0
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'index': i + 1,
'id': funcRawData[i].tenderPackageId,
'price': funcRawData[i].price,
'number': funcRawData[i].no,
'object': funcRawData[i].name,
'quantity': funcRawData[i].num,
'budget': funcRawData[i].amount,
'timeClose': funcRawData[i].openTenderTime,
'fileName': funcRawData[i].files.name,
'fileUrl': funcRawData[i].files.url
}
funcPackage.push(funcItem)
if (funcLastTimeClose < iMiment(funcRawData[i].openTenderTime).stamp()) {
funcLastTimeClose = iMiment(funcRawData[i].openTenderTime).stamp()
}
}
funcProject.timeClose = iMiment(funcLastTimeClose).format('YYYY年MM月DD日 hh:mm')
funcProject.timeTimestampClose = funcLastTimeClose
thisVue.$store.commit('componentProject', funcProject)
} else {
// 单一合同
funcRawData = funcResponse
funcPackage = [{
'index': '',
'id': '',
'number': '',
'object': '',
'quantity': '',
'budget': funcRawData.price,
'timeClose': '',
}]
}
thisVue.$store.commit('componentContract', funcPackage)
funcProgress = {
text: ['发布时间', '领取资格预审文件时间', '投标截止、开标时间'],
timestamp: [
funcProject.timeTimestampRelease,
funcProject.timeTimestampBegin,
funcProject.timeTimestampEnd,
funcProject.timeTimestampClose,
],
isBuy: false,
isSignIn: false,
}
thisVue.$store.commit('componentProgress', funcProgress)
funcRawData = funcResponse.agencyInfo
funcAgency = {
'id': funcRawData.agencyInfoId,
'name': funcRawData.companyName,
'address': funcRawData.area.replace(/\//g, '') + funcRawData.address,
'phone': funcRawData.phone,
'liaison': funcRawData.contactor,
'email': funcRawData.email
}
thisVue.$store.commit('componentAgency', funcAgency)
funcRawData = funcResponse.file
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'name': funcRawData[i].name,
'url': funcRawData[i].url,
}
funcFile.push(funcItem)
}
thisVue.$store.commit('componentFile', funcFile)
})
.catch((funcError) => {})
funcRequestOther = iRequest.request(iHost.base + 'bid/zTenderNotice/getApiRelevantNotices', { 'tenderNoticeId': id, 'type': 1 }, 'json', 'post')
.then((funcResponse) => {
let funcRawData = funcResponse
for (let i = 0, len = funcRawData.length; i < len; i++) {
let funcItem = {
'id': funcRawData[i].id,
'type': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcRawData[i].noticeType))],
'title': funcRawData[i].title,
}
funcOther.push(funcItem)
}
thisVue.$store.commit('componentNotice', funcOther)
})
Promise.all([ funcRequestDetail, funcRequestOther, funcRequestWinInfo ])
.then(() => {
thisVue.noticeData(funcMap, funcProgress, funcProject, funcPackage, funcAgency, funcFile, funcOther)
})
.catch((funcError) => {
console.log(funcError)
})
}
}
export default output
\ No newline at end of file
src/view/personal/supplier-notice.vue
This diff could not be displayed because it is too large.
src/view/public/bid-list.vue
<template>
<div class="public-bid-list col align-c">
<div class="main global-maxwidth">
<!-- 全局搜索 -->
<div class="query-key row">
<el-input v-model="limitKeyword" placeholder="请输入您要搜索的内容" @keyup.enter.native="queryList()"></el-input>
<el-button @click="queryList()">
<span>搜　　索</span>
</el-button>
</div>
<!-- 搜索条件 -->
<div class="query-limits row align-c">
<div>
<div class="item" v-for="(item, index) in queryLimit" :key="index">
<span class="title">{{item.title}}</span>
<span class="key-word" :class="itemChildren.active ? 'global-enable-font' : ''" v-for="(itemChildren, itemIndex) in item.keyWord" :key="itemIndex" @click="onLimitItem(index, itemIndex, itemChildren)">
{{itemChildren.label}}
</span>
</div>
</div>
</div>
<!-- 结果列表 -->
<div class="query-list col">
<!-- 额外信息 -->
<div class="list-info row con-b align-c">
<div class="sort row align-c">
<span>发布时间</span>
<img v-show="limitTimeOrder === 0" src="../../assets/arrow-up.png" alt="" @click="onLimitOrder('new')">
<img v-show="limitTimeOrder === 1" src="../../assets/arrow-up-active.png" alt="" @click="onLimitOrder('new')">
<img v-show="limitTimeOrder === 1" src="../../assets/arrow-down.png" alt="" @click="onLimitOrder('old')">
<img v-show="limitTimeOrder === 0" src="../../assets/arrow-down-active.png" alt="" @click="onLimitOrder('old')">
</div>
<div>
<span>共 <span class="quantity">{{pagination.total}}</span> 条相关信息</span>
</div>
</div>
<!-- 公告列表 -->
<div class="list">
<div v-show="infoList.length > 0" class="row con-c align-c" v-for="(item, index) in infoList" :key="index" @click="onBidDetails(item)">
<span class="global-overflow-ellipsis global-cursor">{{item.title}}</span>
<span class="global-overflow-ellipsis global-cursor">{{item.type}}</span>
<span class="global-cursor">{{item.time}}</span>
</div>
<div v-show="infoList.length === 0" class="list-nothing row con-c align-c">
<span>未能找到满足您条件的信息！</span>
</div>
</div>
<!-- 列表分页 -->
<div class="pagination row con-c">
<el-pagination :total="pagination.total" layout="total, sizes, prev, pager, next, jumper" @size-change="(size) => {onPagination(size, 'size', pagination)}" @current-change="(size) => {onPagination(size, 'current', pagination)}"></el-pagination>
<button>确定</button>
</div>
</div>
</div>
</div>
</template>
<script>
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iDictionary from '@/common/js/dictionary.js'
import iFramePagination from '@/common/frame/pagination/pagination.js'
export default {
data: function () {
return {
queryLimit: [],
limitKeyword: '', // 搜索字段
limitInformation: '', // 信息分类
limitLately: '', // 最近时段
limitProcurement: '', // 采购方式
limitTimeOrder: 0, // 时间排序
infoList: [],
pagination: {
size: 10,
total: 0,
current: 1,
}
}
},
watch:{
$route() {
if (this.$route.query.search) this.limitKeyword = this.$route.query.search
this.queryList()
this.setActiveLimitItem()
}
},
created: function () {
this.setQueryTab()
if (this.$route.query.search) this.limitKeyword = this.$route.query.search
},
methods: {
/**
* 设置查询条件标签
* @function
* @returns
*/
setQueryTab: function () {
let funcNoticeList = {}
let funcBuyList = {}
let funcLately = {
title: '发布时间：',
keyWord: [
{ label: '不限', value: '', active: false },
{ label: '近一周', value: 1, active: false },
{ label: '近一个月', value: 2, active: false },
{ label: '近三个月', value: 3, active: false },
]
}
let funcTypeTab = iRequest.request(iHost.base + 'bid/common/getDictByType', { 'type': 'all_notice_type' }, 'json', 'post')
.then((funcResponse) => {
let funcList = [
{ 'label': '全部', 'value': '','active': false }
]
for (let i = 0, len = funcResponse.length; i < len; i++) {
let funcItem = {
'label': funcResponse[i].label,
'value': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcResponse[i].value))],
'active': false
}
funcList[iDictionary.noticeType.raw.indexOf(Number(funcResponse[i].value))] = (funcItem)
}
funcNoticeList.title = '信息分类：'
funcNoticeList.keyWord = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
let funcBuyTab = iRequest.request(iHost.base + 'bid/common/getDictByType', { 'type': 'procurement_type' }, 'json', 'post')
.then((funcResponse) => {
let funcList = [{
'label': '不限',
'value': '',
'active': false
}]
for (let i = 0, len = funcResponse.length; i < len; i++) {
let funcItem = {
'label': funcResponse[i].label,
'value': Number(funcResponse[i].value),
'active': false
}
funcList.push(funcItem)
}
funcBuyList.title = '采购方式：'
funcBuyList.keyWord = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
Promise.all([ funcTypeTab, funcBuyTab ])
.then((funcResponse) => {
this.queryLimit = [funcNoticeList, funcBuyList, funcLately]
// 默认查询条件
for (let i = 0, len = this.queryLimit.length; i < len; i++) {
this.queryLimit[i].keyWord[0].active = true
}
// 如果路径存在公告类型则定位到对应的搜索条件
if (this.$route.query.type) {
for (let i = 0, len = this.queryLimit[0].keyWord.length; i < len; i++) {
if (Number(this.$route.query.type) === Number(this.queryLimit[0].keyWord[i].value)) {
this.queryLimit[0].keyWord[0].active = false
this.queryLimit[0].keyWord[i].active = true
this.limitInformation = Number(this.$route.query.type)
}
}
}
this.queryList()
})
.catch((funcError) => {})
},
/**
* 列表查询
* @function
* @returns
*/
queryList: function () {
let funcParam = {
'noticeType': iDictionary.noticeType.raw[iDictionary.noticeType.mapping.indexOf(Number(this.$route.query.type))],
'releaseTimeType': this.limitLately,
'procurementType': this.limitProcurement,
'keyword': this.limitKeyword,
'orderBy': this.limitTimeOrder,
'pageSize': this.pagination.size,
'pageNo': this.pagination.current
}
iRequest.request(iHost.base + 'bid/zTenderNotice/getApiAllList', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcList = []
for (let i = 0, len = funcResponse.list.length; i < len; i++) {
let funcItem = {
'id': funcResponse.list[i].id,
'time': iMiment(funcResponse.list[i].releaseTime).format('YYYY-MM-DD'),
'title': funcResponse.list[i].title,
'typeId': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcResponse.list[i].noticeType))],
}
if (funcItem.type === '-') {
funcItem.type = '　'
}
funcList.push(funcItem)
}
this.infoList = funcList
this.pagination.total = funcResponse.count
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
/**
* 设置高亮标签
* @function
* @returns
*/
setActiveLimitItem: function () {
let funcNoticeType = this.queryLimit[0].keyWord
for (let i = 0, len = funcNoticeType.length; i < len; i++) {
funcNoticeType[i].active = false
if (this.$route.query.type) {
if (funcNoticeType[i].value === Number(this.$route.query.type)) {
funcNoticeType[i].active = true
}
} else {
funcNoticeType[0].active = true
}
}
},
/**
* 条件选择 - 标签选择
* @function
* @param {number} funcRankIndex
* @param {number} funcItemIndex
* @param {object} funcItem
* @returns
*/
onLimitItem: function (funcRankIndex, funcItemIndex, funcItem) {
switch (funcRankIndex) {
case 0:
this.limitInformation = funcItem.value
if (funcItem.value === '') {
this.$router.push('/bid')
} else {
this.$router.push('/bid?type=' + funcItem.value)
}
break
case 1:
this.limitProcurement = funcItem.value
this.queryList()
break
case 2:
this.limitLately = funcItem.value
this.queryList()
break
}
// 设置高亮
let funcData = this.queryLimit[funcRankIndex].keyWord
for (let i = 0, len = funcData.length; i < len; i++) {
funcData[i].active = false
if (i === funcItemIndex) funcData[i].active = true
}
},
/**
* 条件选择 - 排序
* @function
* @param {string} funcType
* @returns
*/
onLimitOrder: function (funcType) {
switch (funcType) {
case 'old':
this.limitTimeOrder = 0
this.queryList()
break
case 'new':
this.limitTimeOrder = 1
this.queryList()
break
}
},
/**
* 页码组件
* @function
* @param {number} funcValue
* @param {string} funcType - 数据类型
* @param {object} funcUpdateObject - 记录对象
* @returns
*/
onPagination: function (funcValue, funcType, funcUpdateObject) {
iFramePagination(funcValue, funcType, funcUpdateObject)
this.queryList()
},
onBidDetails: function (funcItem) {
this.$router.push('/bid/notice?type=' + funcItem.typeId + '&id=' + funcItem.id)
},
}
}
</script>
<style lang="less">
.public-bid-list {
width: 100%;
background-image: url(@backgroundImageUrl);
background-repeat: no-repeat;
.query-key {
width: 100%;
height: 100px;
margin-top: 36px;
padding: 20px;
background: #00468C;
.el-input {
width: 980px;
}
input {
width: 980px;
height: 60px;
padding-right: 0;
border-radius: 0;
border-style: solid none solid solid;
font-size: @fontSize01;
}
button {
width: 180px;
height: 60px;
padding: 0;
border: 1px #CF2F1D solid;
border-radius: 0;
background: #CF2F1D;
span {
font-size: @fontSize04;
color: @colorWhite;
}
}
}
.query-limits {
width: 100%;
height: 150px;
margin-top: 36px;
padding-left: 32px;
background: @colorWhite;
box-shadow:0px 0px 20px 0px rgba(41,41,41,0.05);
.item {
margin: 16px 0;
}
.title {
font-weight: 800;
font-size: @fontSize02;
}
.key-word {
margin-right: 24px;
font-size: @fontSize01;
color: @colorGrey60;
cursor: pointer;
}
}
.query-list {
width: 100%;
min-height: 270px;
margin: 36px 0;
padding-bottom: 44px;
background: @colorWhite;
box-shadow: 0px 0px 20px 0px rgba(41, 41, 41, 0.05);
.list-info {
width: 100%;
height: 56px;
padding: 0 32px;
background: #F2F2F2;
span {
color: @colorGrey40;
}
.sort {
span {
margin-right: 8px;
font-size: @fontSize01;
}
img {
width: 8px;
height: 12px;
margin: 0 8px;
cursor: pointer;
}
}
.quantity {
color: #CF2F1D;
}
}
.list {
flex-grow: 1;
> div {
height: 50px;
margin: 0 32px;
border-bottom: 1px @colorGrey90 dashed;
span {
font-size: @fontSize02;
color: @colorGrey10;
}
span:nth-child(1) {
max-width: 870px;
padding-right: 80px;
flex-grow: 1;
}
span:nth-child(2) {
width: 170px;
padding-right: 20px;
}
span:nth-child(3) {
width: 96px;
color: @colorGrey60;
}
}
.list-nothing {
text-align: center;
}
}
.pagination {
margin-top: 40px;
> button {
width: 70px;
height: 46px;
color: #FFFFFF;
border: none;
font-size: @fontSize02;
background: #00468C;
}
}
}
}
<template>
<div class="public-bid-list col align-c">
<div class="main global-maxwidth">
<!-- 全局搜索 -->
<div class="query-key row">
<el-input v-model="limitKeyword" placeholder="请输入您要搜索的内容" @keyup.enter.native="queryList()"></el-input>
<el-button @click="queryList()">
<span>搜　　索</span>
</el-button>
</div>
<!-- 搜索条件 -->
<div class="query-limits row align-c">
<div>
<div class="item" v-for="(item, index) in queryLimit" :key="index">
<span class="title">{{item.title}}</span>
<span class="key-word" :class="itemChildren.active ? 'global-enable-font' : ''" v-for="(itemChildren, itemIndex) in item.keyWord" :key="itemIndex" @click="onLimitItem(index, itemIndex, itemChildren)">
{{itemChildren.label}}
</span>
</div>
</div>
</div>
<!-- 结果列表 -->
<div class="query-list col">
<!-- 额外信息 -->
<div class="list-info row con-b align-c">
<div class="sort row align-c">
<span>发布时间</span>
<img v-show="limitTimeOrder === 0" src="../../assets/arrow-up.png" alt="" @click="onLimitOrder('new')">
<img v-show="limitTimeOrder === 1" src="../../assets/arrow-up-active.png" alt="" @click="onLimitOrder('new')">
<img v-show="limitTimeOrder === 1" src="../../assets/arrow-down.png" alt="" @click="onLimitOrder('old')">
<img v-show="limitTimeOrder === 0" src="../../assets/arrow-down-active.png" alt="" @click="onLimitOrder('old')">
</div>
<div>
<span>共 <span class="quantity">{{pagination.total}}</span> 条相关信息</span>
</div>
</div>
<!-- 公告列表 -->
<div class="list">
<div v-show="infoList.length > 0" class="row con-c align-c" v-for="(item, index) in infoList" :key="index" @click="onBidDetails(item)">
<span class="global-overflow-ellipsis global-cursor">{{item.title}}</span>
<span class="global-overflow-ellipsis global-cursor">{{item.type}}</span>
<span class="global-cursor">{{item.time}}</span>
</div>
<div v-show="infoList.length === 0" class="list-nothing row con-c align-c">
<span>未能找到满足您条件的信息！</span>
</div>
</div>
<!-- 列表分页 -->
<div class="pagination row con-c">
<el-pagination :total="pagination.total" layout="total, sizes, prev, pager, next, jumper" @size-change="(size) => {onPagination(size, 'size', pagination)}" @current-change="(size) => {onPagination(size, 'current', pagination)}"></el-pagination>
<button>确定</button>
</div>
</div>
</div>
</div>
</template>
<script>
import iMiment from 'miment'
import iHost from '@/common/js/host.js'
import iRequest from '@/common/js/request/request.js'
import iDictionary from '@/common/js/dictionary.js'
import iFramePagination from '@/common/frame/pagination/pagination.js'
export default {
data: function () {
return {
queryLimit: [],
limitKeyword: '', // 搜索字段
limitInformation: '', // 信息分类
limitLately: '', // 最近时段
limitProcurement: '', // 采购方式
limitTimeOrder: 0, // 时间排序
infoList: [],
pagination: {
size: 10,
total: 0,
current: 1,
}
}
},
watch:{
$route() {
if (this.$route.query.search) this.limitKeyword = this.$route.query.search
this.queryList()
this.setActiveLimitItem()
}
},
created: function () {
this.setQueryTab()
if (this.$route.query.search) this.limitKeyword = this.$route.query.search
},
methods: {
/**
* 设置查询条件标签
* @function
* @returns
*/
setQueryTab: function () {
let funcNoticeList = {}
let funcBuyList = {}
let funcLately = {
title: '发布时间：',
keyWord: [
{ label: '不限', value: '', active: false },
{ label: '近一周', value: 1, active: false },
{ label: '近一个月', value: 2, active: false },
{ label: '近三个月', value: 3, active: false },
]
}
let funcTypeTab = iRequest.request(iHost.base + 'bid/common/getDictByType', { 'type': 'all_notice_type' }, 'json', 'post')
.then((funcResponse) => {
let funcList = [
{ 'label': '全部', 'value': '','active': false }
]
for (let i = 0, len = funcResponse.length; i < len; i++) {
let funcItem = {
'label': funcResponse[i].label,
'value': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcResponse[i].value))],
'active': false
}
funcList[iDictionary.noticeType.raw.indexOf(Number(funcResponse[i].value))] = (funcItem)
}
funcNoticeList.title = '信息分类：'
funcNoticeList.keyWord = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
let funcBuyTab = iRequest.request(iHost.base + 'bid/common/getDictByType', { 'type': 'procurement_type' }, 'json', 'post')
.then((funcResponse) => {
let funcList = [{
'label': '不限',
'value': '',
'active': false
}]
for (let i = 0, len = funcResponse.length; i < len; i++) {
let funcItem = {
'label': funcResponse[i].label,
'value': Number(funcResponse[i].value),
'active': false
}
funcList.push(funcItem)
}
funcBuyList.title = '采购方式：'
funcBuyList.keyWord = funcList
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
Promise.all([ funcTypeTab, funcBuyTab ])
.then((funcResponse) => {
this.queryLimit = [funcNoticeList, funcBuyList, funcLately]
// 默认查询条件
for (let i = 0, len = this.queryLimit.length; i < len; i++) {
this.queryLimit[i].keyWord[0].active = true
}
// 如果路径存在公告类型则定位到对应的搜索条件
if (this.$route.query.type) {
for (let i = 0, len = this.queryLimit[0].keyWord.length; i < len; i++) {
if (Number(this.$route.query.type) === Number(this.queryLimit[0].keyWord[i].value)) {
this.queryLimit[0].keyWord[0].active = false
this.queryLimit[0].keyWord[i].active = true
this.limitInformation = Number(this.$route.query.type)
}
}
}
this.queryList()
})
.catch((funcError) => {})
},
/**
* 列表查询
* @function
* @returns
*/
queryList: function () {
let funcParam = {
'noticeType': iDictionary.noticeType.raw[iDictionary.noticeType.mapping.indexOf(Number(this.$route.query.type))],
'releaseTimeType': this.limitLately,
'procurementType': this.limitProcurement,
'keyword': this.limitKeyword,
'orderBy': this.limitTimeOrder,
'pageSize': this.pagination.size,
'pageNo': this.pagination.current
}
iRequest.request(iHost.base + 'bid/zTenderNotice/getApiAllList', funcParam, 'json', 'post')
.then((funcResponse) => {
let funcList = []
for (let i = 0, len = funcResponse.list.length; i < len; i++) {
let funcItem = {
'id': funcResponse.list[i].id,
'time': iMiment(funcResponse.list[i].releaseTime).format('YYYY-MM-DD'),
'title': funcResponse.list[i].title,
'typeId': iDictionary.noticeType.mapping[iDictionary.noticeType.raw.indexOf(Number(funcResponse.list[i].noticeType))],
}
if (funcItem.type === '-') {
funcItem.type = '　'
}
funcList.push(funcItem)
}
this.infoList = funcList
this.pagination.total = funcResponse.count
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
/**
* 设置高亮标签
* @function
* @returns
*/
setActiveLimitItem: function () {
let funcNoticeType = this.queryLimit[0].keyWord
for (let i = 0, len = funcNoticeType.length; i < len; i++) {
funcNoticeType[i].active = false
if (this.$route.query.type) {
if (funcNoticeType[i].value === Number(this.$route.query.type)) {
funcNoticeType[i].active = true
}
} else {
funcNoticeType[0].active = true
}
}
},
/**
* 条件选择 - 标签选择
* @function
* @param {number} funcRankIndex
* @param {number} funcItemIndex
* @param {object} funcItem
* @returns
*/
onLimitItem: function (funcRankIndex, funcItemIndex, funcItem) {
switch (funcRankIndex) {
case 0:
this.limitInformation = funcItem.value
if (funcItem.value === '') {
this.$router.push('/bid')
} else {
this.$router.push('/bid?type=' + funcItem.value)
}
break
case 1:
this.limitProcurement = funcItem.value
this.queryList()
break
case 2:
this.limitLately = funcItem.value
this.queryList()
break
}
// 设置高亮
let funcData = this.queryLimit[funcRankIndex].keyWord
for (let i = 0, len = funcData.length; i < len; i++) {
funcData[i].active = false
if (i === funcItemIndex) funcData[i].active = true
}
},
/**
* 条件选择 - 排序
* @function
* @param {string} funcType
* @returns
*/
onLimitOrder: function (funcType) {
switch (funcType) {
case 'old':
this.limitTimeOrder = 0
this.queryList()
break
case 'new':
this.limitTimeOrder = 1
this.queryList()
break
}
},
/**
* 页码组件
* @function
* @param {number} funcValue
* @param {string} funcType - 数据类型
* @param {object} funcUpdateObject - 记录对象
* @returns
*/
onPagination: function (funcValue, funcType, funcUpdateObject) {
iFramePagination(funcValue, funcType, funcUpdateObject)
this.queryList()
},
onBidDetails: function (funcItem) {
this.$router.push('/bid/notice?type=' + funcItem.typeId + '&id=' + funcItem.id)
},
}
}
</script>
<style lang="less">
.public-bid-list {
width: 100%;
background-image: url(@backgroundImageUrl);
background-repeat: no-repeat;
.query-key {
width: 100%;
height: 100px;
margin-top: 36px;
padding: 20px;
background: #00468C;
.el-input {
width: 980px;
}
input {
width: 980px;
height: 60px;
padding-right: 0;
border-radius: 0;
border-style: solid none solid solid;
font-size: @fontSize01;
}
button {
width: 180px;
height: 60px;
padding: 0;
border: 1px #CF2F1D solid;
border-radius: 0;
background: #CF2F1D;
span {
font-size: @fontSize04;
color: @colorWhite;
}
}
}
.query-limits {
width: 100%;
height: 150px;
margin-top: 36px;
padding-left: 32px;
background: @colorWhite;
box-shadow:0px 0px 20px 0px rgba(41,41,41,0.05);
.item {
margin: 16px 0;
}
.title {
font-weight: 800;
font-size: @fontSize02;
}
.key-word {
margin-right: 24px;
font-size: @fontSize01;
color: @colorGrey60;
cursor: pointer;
}
}
.query-list {
width: 100%;
min-height: 270px;
margin: 36px 0;
padding-bottom: 44px;
background: @colorWhite;
box-shadow: 0px 0px 20px 0px rgba(41, 41, 41, 0.05);
.list-info {
width: 100%;
height: 56px;
padding: 0 32px;
background: #F2F2F2;
span {
color: @colorGrey40;
}
.sort {
span {
margin-right: 8px;
font-size: @fontSize01;
}
img {
width: 8px;
height: 12px;
margin: 0 8px;
cursor: pointer;
}
}
.quantity {
color: #CF2F1D;
}
}
.list {
flex-grow: 1;
> div {
height: 50px;
margin: 0 32px;
border-bottom: 1px @colorGrey90 dashed;
span {
font-size: @fontSize02;
color: @colorGrey10;
}
span:nth-child(1) {
max-width: 870px;
padding-right: 80px;
flex-grow: 1;
}
span:nth-child(2) {
width: 170px;
padding-right: 20px;
}
span:nth-child(3) {
width: 96px;
color: @colorGrey60;
}
}
.list-nothing {
text-align: center;
}
}
.pagination {
margin-top: 40px;
> button {
width: 70px;
height: 46px;
color: #FFFFFF;
border: none;
font-size: @fontSize02;
background: #00468C;
}
}
}
}
</style>
\ No newline at end of file
src/view/public/bid-notice.js
This diff could not be displayed because it is too large.
src/view/public/bid-notice.vue
This diff could not be displayed because it is too large.
src/view/sign-in-forget.vue
<template>
<!-- 通用组件 - 登录身份 -->
<div class="currency-sign-in-forget row con-c">
<div class="main global-maxwidth">
<!-- 页面地图 -->
<div>
<currencyMap></currencyMap>
</div>
<!-- 登录身份选择 -->
<div class="col con-c align-c">
<!-- 节点显示 -->
<div class="progress row con-b">
<div class="node node-active col align-c">
<div class="row con-c align-c">
<span>1</span>
</div>
<div>输入手机号码</div>
</div>
<div class="node col align-c" :class="state >= 2 ? 'node-active' : ''">
<div class="row con-c align-c">
<span>2</span>
</div>
<div>设置新密码</div>
</div>
<div class="node col align-c" :class="state >= 4 ? 'node-active' : ''">
<div class="row con-c align-c">
<span>3</span>
</div>
<div>设置成功</div>
</div>
<div :style="'background-image: linear-gradient(to right, #2575FA 0%, #2575FA ' + state * 25 + '%, #F2F2F2 ' + state * 25 + '%);'"></div>
</div>
<!-- 输入手机 -->
<div v-if="state === 1" key="inputPhone" class="forget-info row">
<el-form ref="formForget" :model="formForget" :rules="rule" label-width="120px">
<el-form-item label="手机号码：" prop="phone">
<el-input v-model="formForget.phone" maxlength="11" placeholder="请输入联系人手机号"></el-input>
</el-form-item>
<el-form-item class="form-item-code" label="验证码：">
<el-input v-model="formForget.code" maxlength="4" placeholder="请输入验证码"></el-input>
<button @click.prevent="onImageCode"><img :src="imageCodeData" alt=""></button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click.prevent="onNext()">下一步</el-button>
</el-form-item>
</el-form>
</div>
<!-- 设置密码 -->
<div v-if="state === 3" key="inputPassword" class="forget-info row">
<el-form ref="formForget" :model="formForget" :rules="rule" label-width="120px">
<el-form-item label="新密码：" prop="password">
<el-input v-model="formForget.password" show-password maxlength="20" placeholder="6-20个字符，区分英文大小写，不包含空格与表情"></el-input>
</el-form-item>
<el-form-item label="确认密码：" prop="passwordRepeat">
<el-input v-model="formForget.passwordRepeat" show-password maxlength="20" placeholder="再次输入登录密码"></el-input>
</el-form-item>
<el-form-item class="form-item-code" label="手机验证码：" prop="phoneCode">
<el-input v-model="formForget.phoneCode" maxlength="6" placeholder="请输入手机验证码"></el-input>
<button :disabled="disabledPhone" :class="disabledPhone ? 'global-disable' : 'global-enable'" @click.prevent="getCode('phone')">{{'获取验证码' + disabledPhoneText}}</button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click.prevent="onPrevious()">上一步</el-button>
<el-button type="primary" @click.prevent="onNext()">下一步</el-button>
</el-form-item>
</el-form>
</div>
<!-- 设置成功 -->
<div v-if="state === 5" class="forget-info row con-c">
<div class="forget-finished col align-c">
<img src="../assets/icon-finished.png" alt="">
<span>密码设置成功！</span>
<span><span class="global-color-red">{{redirectSecond}}</span> 秒后自动跳转到登录页，若未跳转，可<span class="global-color-blue" @click="onBack('now')">点击跳转</span></span>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import iHost from '@/common/js/host.js'
import iRule from '@/common/js/rule/rule.js'
import iRequest from '@/common/js/request/request.js'
import iCurrencyMap from '@/components/currency-map.vue'
export default {
components: {
currencyMap: iCurrencyMap,
},
data: function () {
return {
state: 1, // 1 - 输入手机, 3 - 设置密码, 5 - 设置成功
formForget: {
code: '',
phone: '',
phoneCode: '',
password: '',
passwordRepeat: '',
},
redirectTimer: 3,
redirectSecond: 3,
imageCodeData: '',
// 手机短信按钮控制
disabledPhone: false, // 按钮点击状态
disabledPhoneMax: 60, // 最大秒数
disabledPhoneText: '', // 计时文本
disabledPhoneTime: 0, // 计时数字
disabledPhoneTimer: 0, // 计时器
rule: {
phone: [
{ required: true, message: '请输入联系人手机号', trigger: 'blur' },
{ validator: iRule.phone, message: '请正确输入手机号码', trigger: 'blur'}
],
phoneCode: [
{ required: true, message: '请输入验证码', trigger: 'blur' },
{ validator: iRule.predefineNumeral, message: '请正确输入验证码', trigger: 'blur'}
],
password: [
{ required: true, message: '请设置登录密码', trigger: 'blur' },
{ validator: iRule.unSpace, message: '不能包含空格', trigger: 'blur'},
{ validator: iRule.unEmoji, message: '不能包含 emoji 表情', trigger: 'blur'},
{ validator: iRule.unChinese, message: '不能包含中文', trigger: 'blur'},
{ validator: iRule.password, message: '6-20个字符，数字、英文字母及标点符号至少2种（除空格）', trigger: 'blur'}
],
passwordRepeat: [
{ required: true, message: '请再次输入登录密码', trigger: 'blur' },
{ validator: (funcRule, funcValue, funcCallback) => iRule.passwordRepeat(funcRule, funcValue, funcCallback, this.formForget.password), message: '与登录密码不一致，请重新输入', trigger: 'blur'}
]
}
}
},
created: function () {
// this.reset()
this.setButtonDisable('phone')
this.onImageCode()
},
methods: {
onImageCode: function () {
iRequest.request(iHost.base + 'bid/common/getImgCode', {}, 'json', 'post')
.then((funcResponse) => {
this.imageCodeData = funcResponse.img
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
checkImageCode: function () {
if (!this.formForget.code) {
this.$message.error('请输入图片验证码')
return
}
iRequest.request(iHost.base + 'bid/common/validateImgCode', { 'imgCode': this.formForget.code }, 'json', 'get')
.then((funcResponse) => {
this.checkPhone()
})
.catch((funcError) => {
this.$message.error(funcError.message)
this.onImageCode()
})
},
/**
* 获取验证码
* @function
* @param {string} funcCodeType
* @returns
*/
getCode: function (funcCodeType) {
if (this.formForget.phone === '') {
this.$message.error('联系人手机号')
return
}
let funcParam = {}
switch (this.$route.query.status) {
case 'specialist':
funcParam.type = 'expertResetPassword'
funcParam.mobile = this.formForget.phone
break
case 'supplier':
funcParam.type = 'companyResetPassword'
funcParam.mobile = this.formForget.phone
break
}
iRequest.request(iHost.base + 'bid/common/getMobileVerificationCode', funcParam, 'json', 'post')
.then((funcResponse) => {
this.$message({ message: '验证码已发送', type: 'success' })
window.sessionStorage.setItem('phoneTimer', Math.ceil(new Date()))
this.disableTimer('phone', this.disabledPhoneMax)
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
/**
* 设置验证码禁用时间
* @function
* @param {string} funcCodeType
* @returns
*/
setButtonDisable: function (funcCodeType) {
let funcTimeDistance = Math.ceil((new Date() - Number(window.sessionStorage.getItem('phoneTimer'))) / 1000)
if (funcTimeDistance < this.disabledPhoneMax) {
this.disableTimer('phone', this.disabledPhoneMax - funcTimeDistance)
}
},
/**
* 按钮禁用读秒
* @function
* @param {string} funcCodeType
* @param {number} funcTimerSecond
* @returns
*/
disableTimer: function (funcCodeType, funcTimerSecond) {
this.disabledPhone = true
this.disabledPhoneTime = funcTimerSecond
this.disabledPhoneText = ' （' + this.disabledPhoneTime + '）'
this.disabledPhoneTimer = setInterval(() => {
if (this.disabledPhoneTime > 1) {
this.disabledPhoneTime = this.disabledPhoneTime - 1
this.disabledPhoneText = ' （' + this.disabledPhoneTime + '）'
} else {
this.disabledPhone = false
this.disabledPhoneText = ''
clearTimeout(this.disabledPhoneTimer)
}
}, 1000)
},
onPrevious: function () {
switch (this.state) {
case 3:
this.state = 1
this.$refs.formForget.clearValidate()
break
}
},
onNext: function () {
switch (this.state) {
case 1:
this.$refs.formForget.validate(funcValid => {
if (funcValid) {
this.checkImageCode()
}
})
break
case 3:
this.$refs.formForget.validate(funcValid => {
if (funcValid) {
this.checkPhoneCode()
}
})
break
}
},
/**
* 校验手机
* @function
* @returns
*/
checkPhone: function () {
switch (this.$route.query.status) {
case 'specialist':
iRequest.request(iHost.base + 'bid/zUserExpert/validateData', { mobile: this.formForget.phone }, 'json', 'post')
.then((funcResponse) => {
this.$message.error('手机号码不存在')
})
.catch((funcError) => {
this.state = 3
})
break
case 'supplier':
iRequest.request(iHost.base + 'bid/zUserCompany/validateData', { mobile: this.formForget.phone }, 'json', 'post')
.then((funcResponse) => {
this.$message.error('手机号码不存在')
})
.catch((funcError) => {
this.state = 3
})
break
}
},
/**
* 校验手机验证码正确性
* @function
* @returns
*/
checkPhoneCode: function () {
let funcParam = {}
switch (this.$route.query.status) {
case 'specialist':
funcParam.type = 'expertResetPassword'
funcParam.mobile = this.formForget.phone
funcParam.noteCode = this.formForget.phoneCode
break
case 'supplier':
funcParam.type = 'companyResetPassword'
funcParam.mobile = this.formForget.phone
funcParam.noteCode = this.formForget.phoneCode
break
}
iRequest.request(iHost.base + 'bid/common/verifyMobileVerificationCode', funcParam, 'json', 'post')
.then((funcResponse) => {
this.resetPassword()
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
resetPassword: function () {
let funcParam = {}
switch (this.$route.query.status) {
case 'specialist':
funcParam.mobile = this.formForget.phone
funcParam.newPassword = this.formForget.password
funcParam.verificationCode = this.formForget.phoneCode
iRequest.request(iHost.base + 'bid/zUserExpert/resetPassword', funcParam, 'json', 'post')
.then((funcResponse) => {
this.state = 5
sessionStorage.removeItem('phoneTimer')
this.onBack('timer')
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
break
case 'supplier':
funcParam.mobile = this.formForget.phone
funcParam.newPassword = this.formForget.password
funcParam.verificationCode = this.formForget.phoneCode
iRequest.request(iHost.base + 'bid/zUserCompany/resetPassword', funcParam, 'json', 'post')
.then((funcResponse) => {
this.state = 5
sessionStorage.removeItem('phoneTimer')
this.onBack('timer')
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
break
}
},
onBack: function (funcType) {
switch (funcType) {
case 'timer':
this.redirectSecond = 3
this.redirectTimer = setInterval(() => {
this.redirectSecond = this.redirectSecond - 1
if (this.redirectSecond === 0) {
this.$router.push('/signIn/input?status=' + this.$route.query.status)
clearInterval(this.redirectTimer)
}
}, 1000)
break
case 'now':
clearInterval(this.redirectTimer)
this.$router.push('/signIn/input?status=' + this.$route.query.status)
break
}
}
},
}
</script>
<style lang="less">
.currency-sign-in-forget {
width: 100%;
background-image: url(@backgroundImageUrl);
> div {
width: 1200px;
min-height: 480px;
margin-top: 36px;
margin-bottom: 40px;
padding: 32px 32px 0 32px;
background: @colorWhite;
box-shadow: 0px 0px 20px 0px rgba(41, 41, 41, 0.05);
.progress {
position: relative;
width: 100%;
margin-bottom: 40px;
.node {
flex-grow: 1;
> div:nth-child(1) {
z-index: 5;
width: 40px;
height: 40px;
margin-bottom: 14px;
border-radius: 50%;
background: #F2F2F2;
}
}
.node-active {
> div:nth-child(1) {
color: @colorWhite;
background: @colorBlue;
}
}
> div:nth-child(4) {
z-index: 0;
position: absolute;
top: 18px;
left: 210px;
width: 760px;
height: 4px;
background: #FFFFFF;
}
}
.forget-info {
width: 590px;
.el-form {
width: 100%;
.form-item-code {
> div {
display: flex;
flex-direction: row;
.el-input {
display: inline-block;
width: 310px;
}
button {
display: inline-block;
width: 180px;
height: 40px;
margin-left: 10px;
padding: 0;
border: none;
color: @colorWhite;
background: @colorBlue;
img {
width: 180px;
height: 40px;
}
}
}
}
}
.forget-finished {
margin-top: 46px;
> span:nth-child(2) {
margin-top: 18px;
font-size: @fontSize06;
}
> span:nth-child(3) {
margin-top: 14px;
font-size: @fontSize01;
}
}
}
}
}
</style>
<template>
<!-- 通用组件 - 登录身份 -->
<div class="currency-sign-in-forget row con-c">
<div class="main global-maxwidth">
<!-- 页面地图 -->
<div>
<currencyMap></currencyMap>
</div>
<!-- 登录身份选择 -->
<div class="col con-c align-c">
<!-- 节点显示 -->
<div class="progress row con-b">
<div class="node node-active col align-c">
<div class="row con-c align-c">
<span>1</span>
</div>
<div>输入手机号码</div>
</div>
<div class="node col align-c" :class="state >= 2 ? 'node-active' : ''">
<div class="row con-c align-c">
<span>2</span>
</div>
<div>设置新密码</div>
</div>
<div class="node col align-c" :class="state >= 4 ? 'node-active' : ''">
<div class="row con-c align-c">
<span>3</span>
</div>
<div>设置成功</div>
</div>
<div :style="'background-image: linear-gradient(to right, #2575FA 0%, #2575FA ' + state * 25 + '%, #F2F2F2 ' + state * 25 + '%);'"></div>
</div>
<!-- 输入手机 -->
<div v-if="state === 1" key="inputPhone" class="forget-info row">
<el-form ref="formForget" :model="formForget" :rules="rule" label-width="120px">
<el-form-item label="手机号码：" prop="phone">
<el-input v-model="formForget.phone" maxlength="11" placeholder="请输入联系人手机号"></el-input>
</el-form-item>
<el-form-item class="form-item-code" label="验证码：">
<el-input v-model="formForget.code" maxlength="4" placeholder="请输入验证码"></el-input>
<button @click.prevent="onImageCode"><img :src="imageCodeData" alt=""></button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click.prevent="onNext()">下一步</el-button>
</el-form-item>
</el-form>
</div>
<!-- 设置密码 -->
<div v-if="state === 3" key="inputPassword" class="forget-info row">
<el-form ref="formForget" :model="formForget" :rules="rule" label-width="120px">
<el-form-item label="新密码：" prop="password">
<el-input v-model="formForget.password" show-password maxlength="20" placeholder="6-20个字符，区分英文大小写，不包含空格与表情"></el-input>
</el-form-item>
<el-form-item label="确认密码：" prop="passwordRepeat">
<el-input v-model="formForget.passwordRepeat" show-password maxlength="20" placeholder="再次输入登录密码"></el-input>
</el-form-item>
<el-form-item class="form-item-code" label="手机验证码：" prop="phoneCode">
<el-input v-model="formForget.phoneCode" maxlength="6" placeholder="请输入手机验证码"></el-input>
<button :disabled="disabledPhone" :class="disabledPhone ? 'global-disable' : 'global-enable'" @click.prevent="getCode('phone')">{{'获取验证码' + disabledPhoneText}}</button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click.prevent="onPrevious()">上一步</el-button>
<el-button type="primary" @click.prevent="onNext()">下一步</el-button>
</el-form-item>
</el-form>
</div>
<!-- 设置成功 -->
<div v-if="state === 5" class="forget-info row con-c">
<div class="forget-finished col align-c">
<img src="../assets/icon-finished.png" alt="">
<span>密码设置成功！</span>
<span><span class="global-color-red">{{redirectSecond}}</span> 秒后自动跳转到登录页，若未跳转，可<span class="global-color-blue" @click="onBack('now')">点击跳转</span></span>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import iHost from '@/common/js/host.js'
import iRule from '@/common/js/rule/rule.js'
import iRequest from '@/common/js/request/request.js'
import iCurrencyMap from '@/components/currency-map.vue'
export default {
components: {
currencyMap: iCurrencyMap,
},
data: function () {
return {
state: 1, // 1 - 输入手机, 3 - 设置密码, 5 - 设置成功
formForget: {
code: '',
phone: '',
phoneCode: '',
password: '',
passwordRepeat: '',
},
redirectTimer: 3,
redirectSecond: 3,
imageCodeData: '',
// 手机短信按钮控制
disabledPhone: false, // 按钮点击状态
disabledPhoneMax: 60, // 最大秒数
disabledPhoneText: '', // 计时文本
disabledPhoneTime: 0, // 计时数字
disabledPhoneTimer: 0, // 计时器
rule: {
phone: [
{ required: true, message: '请输入联系人手机号', trigger: 'blur' },
{ validator: iRule.phone, message: '请正确输入手机号码', trigger: 'blur'}
],
phoneCode: [
{ required: true, message: '请输入验证码', trigger: 'blur' },
{ validator: iRule.predefineNumeral, message: '请正确输入验证码', trigger: 'blur'}
],
password: [
{ required: true, message: '请设置登录密码', trigger: 'blur' },
{ validator: iRule.unSpace, message: '不能包含空格', trigger: 'blur'},
{ validator: iRule.unEmoji, message: '不能包含 emoji 表情', trigger: 'blur'},
{ validator: iRule.unChinese, message: '不能包含中文', trigger: 'blur'},
{ validator: iRule.password, message: '6-20个字符，数字、英文字母及标点符号至少2种（除空格）', trigger: 'blur'}
],
passwordRepeat: [
{ required: true, message: '请再次输入登录密码', trigger: 'blur' },
{ validator: (funcRule, funcValue, funcCallback) => iRule.passwordRepeat(funcRule, funcValue, funcCallback, this.formForget.password), message: '与登录密码不一致，请重新输入', trigger: 'blur'}
]
}
}
},
created: function () {
// this.reset()
this.setButtonDisable('phone')
this.onImageCode()
},
methods: {
onImageCode: function () {
iRequest.request(iHost.base + 'bid/common/getImgCode', {}, 'json', 'post')
.then((funcResponse) => {
this.imageCodeData = funcResponse.img
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
checkImageCode: function () {
if (!this.formForget.code) {
this.$message.error('请输入图片验证码')
return
}
iRequest.request(iHost.base + 'bid/common/validateImgCode', { 'imgCode': this.formForget.code }, 'json', 'get')
.then((funcResponse) => {
this.checkPhone()
})
.catch((funcError) => {
this.$message.error(funcError.message)
this.onImageCode()
})
},
/**
* 获取验证码
* @function
* @param {string} funcCodeType
* @returns
*/
getCode: function (funcCodeType) {
if (this.formForget.phone === '') {
this.$message.error('联系人手机号')
return
}
let funcParam = {}
switch (this.$route.query.status) {
case 'specialist':
funcParam.type = 'expertResetPassword'
funcParam.mobile = this.formForget.phone
break
case 'supplier':
funcParam.type = 'companyResetPassword'
funcParam.mobile = this.formForget.phone
break
}
iRequest.request(iHost.base + 'bid/common/getMobileVerificationCode', funcParam, 'json', 'post')
.then((funcResponse) => {
this.$message({ message: '验证码已发送', type: 'success' })
window.sessionStorage.setItem('phoneTimer', Math.ceil(new Date()))
this.disableTimer('phone', this.disabledPhoneMax)
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
/**
* 设置验证码禁用时间
* @function
* @param {string} funcCodeType
* @returns
*/
setButtonDisable: function (funcCodeType) {
let funcTimeDistance = Math.ceil((new Date() - Number(window.sessionStorage.getItem('phoneTimer'))) / 1000)
if (funcTimeDistance < this.disabledPhoneMax) {
this.disableTimer('phone', this.disabledPhoneMax - funcTimeDistance)
}
},
/**
* 按钮禁用读秒
* @function
* @param {string} funcCodeType
* @param {number} funcTimerSecond
* @returns
*/
disableTimer: function (funcCodeType, funcTimerSecond) {
this.disabledPhone = true
this.disabledPhoneTime = funcTimerSecond
this.disabledPhoneText = ' （' + this.disabledPhoneTime + '）'
this.disabledPhoneTimer = setInterval(() => {
if (this.disabledPhoneTime > 1) {
this.disabledPhoneTime = this.disabledPhoneTime - 1
this.disabledPhoneText = ' （' + this.disabledPhoneTime + '）'
} else {
this.disabledPhone = false
this.disabledPhoneText = ''
clearTimeout(this.disabledPhoneTimer)
}
}, 1000)
},
onPrevious: function () {
switch (this.state) {
case 3:
this.state = 1
this.$refs.formForget.clearValidate()
break
}
},
onNext: function () {
switch (this.state) {
case 1:
this.$refs.formForget.validate(funcValid => {
if (funcValid) {
this.checkImageCode()
}
})
break
case 3:
this.$refs.formForget.validate(funcValid => {
if (funcValid) {
this.checkPhoneCode()
}
})
break
}
},
/**
* 校验手机
* @function
* @returns
*/
checkPhone: function () {
switch (this.$route.query.status) {
case 'specialist':
iRequest.request(iHost.base + 'bid/zUserExpert/validateData', { mobile: this.formForget.phone }, 'json', 'post')
.then((funcResponse) => {
this.$message.error('手机号码不存在')
})
.catch((funcError) => {
this.state = 3
})
break
case 'supplier':
iRequest.request(iHost.base + 'bid/zUserCompany/validateData', { mobile: this.formForget.phone }, 'json', 'post')
.then((funcResponse) => {
this.$message.error('手机号码不存在')
})
.catch((funcError) => {
this.state = 3
})
break
}
},
/**
* 校验手机验证码正确性
* @function
* @returns
*/
checkPhoneCode: function () {
let funcParam = {}
switch (this.$route.query.status) {
case 'specialist':
funcParam.type = 'expertResetPassword'
funcParam.mobile = this.formForget.phone
funcParam.noteCode = this.formForget.phoneCode
break
case 'supplier':
funcParam.type = 'companyResetPassword'
funcParam.mobile = this.formForget.phone
funcParam.noteCode = this.formForget.phoneCode
break
}
iRequest.request(iHost.base + 'bid/common/verifyMobileVerificationCode', funcParam, 'json', 'post')
.then((funcResponse) => {
this.resetPassword()
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
},
resetPassword: function () {
let funcParam = {}
switch (this.$route.query.status) {
case 'specialist':
funcParam.mobile = this.formForget.phone
funcParam.newPassword = this.formForget.password
funcParam.verificationCode = this.formForget.phoneCode
iRequest.request(iHost.base + 'bid/zUserExpert/resetPassword', funcParam, 'json', 'post')
.then((funcResponse) => {
this.state = 5
sessionStorage.removeItem('phoneTimer')
this.onBack('timer')
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
break
case 'supplier':
funcParam.mobile = this.formForget.phone
funcParam.newPassword = this.formForget.password
funcParam.verificationCode = this.formForget.phoneCode
iRequest.request(iHost.base + 'bid/zUserCompany/resetPassword', funcParam, 'json', 'post')
.then((funcResponse) => {
this.state = 5
sessionStorage.removeItem('phoneTimer')
this.onBack('timer')
})
.catch((funcError) => {
this.$message.error(funcError.message)
})
break
}
},
onBack: function (funcType) {
switch (funcType) {
case 'timer':
this.redirectSecond = 3
this.redirectTimer = setInterval(() => {
this.redirectSecond = this.redirectSecond - 1
if (this.redirectSecond === 0) {
this.$router.push('/signIn/input?status=' + this.$route.query.status)
clearInterval(this.redirectTimer)
}
}, 1000)
break
case 'now':
clearInterval(this.redirectTimer)
this.$router.push('/signIn/input?status=' + this.$route.query.status)
break
}
}
},
}
</script>
<style lang="less">
.currency-sign-in-forget {
width: 100%;
background-image: url(@backgroundImageUrl);
> div {
width: 1200px;
min-height: 480px;
margin-top: 36px;
margin-bottom: 40px;
padding: 32px 32px 0 32px;
background: @colorWhite;
box-shadow: 0px 0px 20px 0px rgba(41, 41, 41, 0.05);
.progress {
position: relative;
width: 100%;
margin: 20px 0 40px 0;
.node {
flex-grow: 1;
> div:nth-child(1) {
z-index: 5;
width: 40px;
height: 40px;
margin-bottom: 14px;
border-radius: 50%;
background: #F2F2F2;
}
}
.node-active {
> div:nth-child(1) {
color: @colorWhite;
background: @colorBlue;
}
}
> div:nth-child(4) {
z-index: 0;
position: absolute;
top: 18px;
left: 210px;
width: 760px;
height: 4px;
background: #FFFFFF;
}
}
.forget-info {
width: 590px;
.el-form {
width: 100%;
.form-item-code {
> div {
display: flex;
flex-direction: row;
.el-input {
display: inline-block;
width: 310px;
}
button {
display: inline-block;
width: 180px;
height: 40px;
margin-left: 10px;
padding: 0;
border: none;
color: @colorWhite;
background: @colorBlue;
img {
width: 180px;
height: 40px;
}
}
}
}
}
.forget-finished {
margin-top: 46px;
> span:nth-child(2) {
margin-top: 18px;
font-size: @fontSize06;
}
> span:nth-child(3) {
margin-top: 14px;
font-size: @fontSize01;
}
}
}
}
}
</style>
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