|
@@ -1,249 +0,0 @@
|
|
-<template>
|
|
|
|
- <div id="list">
|
|
|
|
- <el-col :span="24" class="main">
|
|
|
|
- <el-col :span="5" class="menu">
|
|
|
|
- <el-image :src="squareImage"></el-image>
|
|
|
|
- <span>Menu</span>
|
|
|
|
- <el-col class="menuList" :span="24" v-for="(item, index) in menuList" :key="index">
|
|
|
|
- <p @click="changeMenu(item.name, index)" :style="`color:${menuIndex == index ? menuColor : ''}`">{{ item.name }}</p>
|
|
|
|
- </el-col>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col :span="19" class="info">
|
|
|
|
- <el-col v-if="menuIndex == '0'" class="leftInfo">
|
|
|
|
- <el-col :span="24" class="leftTop">
|
|
|
|
- <span>|</span> <span>{{ menuName }}</span>
|
|
|
|
- </el-col>
|
|
|
|
- <el-table :data="resultTable" stripe style="width: 96%" border>
|
|
|
|
- <el-table-column prop="time" label="时间"> </el-table-column>
|
|
|
|
- <el-table-column prop="name" label="项目名称" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="sell_unit" label="营销单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="buy_unit" label="采购单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col v-if="menuIndex == '1'" class="leftInfo">
|
|
|
|
- <el-col :span="24" class="leftTop">
|
|
|
|
- <span>|</span> <span>{{ menuName }}</span>
|
|
|
|
- </el-col>
|
|
|
|
- <el-table :data="willTable" stripe style="width: 96%" border>
|
|
|
|
- <el-table-column prop="time" label="时间"> </el-table-column>
|
|
|
|
- <el-table-column prop="name" label="项目名称" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="sell_unit" label="营销单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="buy_unit" label="采购单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col v-if="menuIndex == '2'" class="leftInfo">
|
|
|
|
- <el-col :span="24" class="leftTop">
|
|
|
|
- <span>|</span> <span>{{ menuName }}</span>
|
|
|
|
- </el-col>
|
|
|
|
- <el-table :data="cooperationTable" stripe style="width: 96%" border>
|
|
|
|
- <el-table-column prop="time" label="时间"> </el-table-column>
|
|
|
|
- <el-table-column prop="name" label="项目名称" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="sell_unit" label="营销单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="buy_unit" label="采购单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col v-if="menuIndex == '3'" class="leftInfo">
|
|
|
|
- <el-col :span="24" class="leftTop">
|
|
|
|
- <span>|</span> <span>{{ menuName }}</span>
|
|
|
|
- </el-col>
|
|
|
|
- <el-table :data="demandTable" stripe style="width: 96%" border>
|
|
|
|
- <el-table-column prop="time" label="时间"> </el-table-column>
|
|
|
|
- <el-table-column prop="name" label="项目名称" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="sell_unit" label="营销单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- <el-table-column prop="buy_unit" label="采购单位" :show-overflow-tooltip="true"> </el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col class="page">
|
|
|
|
- <el-pagination
|
|
|
|
- background
|
|
|
|
- @size-change="handleSizeChange"
|
|
|
|
- @current-change="handleCurrentChange"
|
|
|
|
- :current-page.sync="currentPage"
|
|
|
|
- :page-size="10"
|
|
|
|
- layout="total,prev, pager, next, jumper"
|
|
|
|
- :total="total"
|
|
|
|
- >
|
|
|
|
- </el-pagination>
|
|
|
|
- </el-col>
|
|
|
|
- </el-col>
|
|
|
|
- </el-col>
|
|
|
|
- </div>
|
|
|
|
-</template>
|
|
|
|
-
|
|
|
|
-<script>
|
|
|
|
-export default {
|
|
|
|
- name: 'list',
|
|
|
|
- props: {},
|
|
|
|
- components: {},
|
|
|
|
- data: () => ({
|
|
|
|
- squareImage: require('@/assets/live/square_big.png'),
|
|
|
|
- menuList: [{ name: '展示成果' }, { name: '达成意愿' }, { name: '洽谈合作' }, { name: '发布需求' }],
|
|
|
|
- menuIndex: '0',
|
|
|
|
- menuName: '展示成果',
|
|
|
|
- menuColor: 'rgb(254, 149, 14)',
|
|
|
|
- currentPage: 1,
|
|
|
|
- resultTable: [
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称测试项目名称', sell_unit: '营销单位营销单位', buy_unit: '采购单位采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- ],
|
|
|
|
- willTable: [
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- ],
|
|
|
|
- cooperationTable: [
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- ],
|
|
|
|
- demandTable: [
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '测试项目名称', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- { time: '2020-5-10', name: '十条数据', sell_unit: '营销单位', buy_unit: '采购单位' },
|
|
|
|
- ],
|
|
|
|
- total: 10,
|
|
|
|
- }),
|
|
|
|
- created() {
|
|
|
|
- this.searchList();
|
|
|
|
- },
|
|
|
|
- computed: {},
|
|
|
|
- methods: {
|
|
|
|
- async searchList({ skip = 0, limit = 10, ...info } = {}) {
|
|
|
|
- if (this.$route.query.column_name == '展示成果') {
|
|
|
|
- this.changeMenu(this.$route.query.column_name, 0);
|
|
|
|
- } else if (this.$route.query.column_name == '达成意愿') {
|
|
|
|
- this.changeMenu(this.$route.query.column_name, 1);
|
|
|
|
- } else if (this.$route.query.column_name == '洽谈合作') {
|
|
|
|
- this.changeMenu(this.$route.query.column_name, 2);
|
|
|
|
- } else if (this.$route.query.column_name == '发布需求') {
|
|
|
|
- this.changeMenu(this.$route.query.column_name, 3);
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- changeMenu(name, index) {
|
|
|
|
- this.menuIndex = index;
|
|
|
|
- this.menuColor = 'rgb(254, 149, 14)';
|
|
|
|
- this.menuName = name;
|
|
|
|
- },
|
|
|
|
- handleSizeChange(val) {
|
|
|
|
- console.log(`每页 ${val} 条`);
|
|
|
|
- },
|
|
|
|
- handleCurrentChange(val) {
|
|
|
|
- console.log(`当前页: ${val}`);
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
-};
|
|
|
|
-</script>
|
|
|
|
-
|
|
|
|
-<style lang="less" scoped>
|
|
|
|
-.main {
|
|
|
|
- width: 80%;
|
|
|
|
- margin: 0 auto;
|
|
|
|
- float: none;
|
|
|
|
-}
|
|
|
|
-.menu {
|
|
|
|
- float: left;
|
|
|
|
- height: 450px;
|
|
|
|
- width: 20%;
|
|
|
|
- background: no-repeat bottom right;
|
|
|
|
- background-image: url(../../assets/live/menu_back.jpg);
|
|
|
|
- margin: 30px 0;
|
|
|
|
- padding: 10px 0 0 10px;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- box-shadow: 0 0 10px #bbbaba;
|
|
|
|
-}
|
|
|
|
-.menu .el-image {
|
|
|
|
- width: 30px;
|
|
|
|
- display: inline-table;
|
|
|
|
- margin: 10px 5px;
|
|
|
|
-}
|
|
|
|
-.menu span {
|
|
|
|
- font-size: 24px;
|
|
|
|
- color: #92959a;
|
|
|
|
- font-weight: 600;
|
|
|
|
- margin-left: 3px;
|
|
|
|
- position: relative;
|
|
|
|
- top: 10px;
|
|
|
|
-}
|
|
|
|
-.menuList p {
|
|
|
|
- line-height: 60px;
|
|
|
|
- font-size: 18px;
|
|
|
|
- cursor: pointer;
|
|
|
|
- border-bottom: 1px solid #2d64b3;
|
|
|
|
- color: #044b79;
|
|
|
|
- font-weight: 600;
|
|
|
|
-}
|
|
|
|
-.info {
|
|
|
|
- width: 77%;
|
|
|
|
- float: right;
|
|
|
|
- margin: 30px 0 30px 2px;
|
|
|
|
- height: 585px;
|
|
|
|
- box-shadow: 0 0 10px #2d64b3;
|
|
|
|
- overflow: hidden;
|
|
|
|
- right: 0px;
|
|
|
|
- background: #ffffff;
|
|
|
|
-}
|
|
|
|
-.leftInfo {
|
|
|
|
- height: 500px;
|
|
|
|
- overflow: hidden;
|
|
|
|
-}
|
|
|
|
-.leftTop {
|
|
|
|
- font-size: 18px;
|
|
|
|
- width: 96%;
|
|
|
|
- height: 41px;
|
|
|
|
- line-height: 35px;
|
|
|
|
- border-bottom: 1px solid #e5e5e5;
|
|
|
|
- position: relative;
|
|
|
|
- bottom: 1px;
|
|
|
|
- margin: 10px;
|
|
|
|
- font-weight: 600;
|
|
|
|
- color: #22529a;
|
|
|
|
-}
|
|
|
|
-.page {
|
|
|
|
- text-align: center;
|
|
|
|
- margin: 10px 0;
|
|
|
|
-}
|
|
|
|
-/deep/.el-table td {
|
|
|
|
- text-align: center;
|
|
|
|
- padding: 0;
|
|
|
|
- height: 38px;
|
|
|
|
-}
|
|
|
|
-/deep/.el-table th {
|
|
|
|
- text-align: center;
|
|
|
|
- padding: 0;
|
|
|
|
- height: 40px;
|
|
|
|
-}
|
|
|
|
-/deep/ .el-table {
|
|
|
|
- // min-height: 500px;
|
|
|
|
- margin: 0 10px 10px 10px;
|
|
|
|
- top: 10px;
|
|
|
|
-}
|
|
|
|
-</style>
|
|
|