更新

src/views/dockCenter/dynamicInfo/index.vue

@@ -6,7 +6,17 @@
           <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
         </el-col>
         <el-col :span="24" class="main">
-          动态监测
+          <el-tabs v-model="activeName" type="card">
+            <el-tab-pane label="正在洽谈" name="first">
+              <zzqt :zzqtList="zzqtList"></zzqt>
+            </el-tab-pane>
+            <el-tab-pane label="达成意向" name="second">
+              <dcyx :dcyxList="dcyxList"></dcyx>
+            </el-tab-pane>
+            <el-tab-pane label="交易完成" name="third">
+              <jywc :jywcList="jywcList"></jywc>
+            </el-tab-pane>
+          </el-tabs>
         </el-col>
       </el-col>
     </el-row>
@@ -14,12 +24,15 @@
 </template>
 
 <script>
+import zzqt from './parts/zzqt.vue';
+import dcyx from './parts/dcyx.vue';
+import jywc from './parts/jywc.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 import NavBar from '@/layout/common/topInfo.vue';
 export default {
   name: 'index',
   props: {},
-  components: { NavBar },
+  components: { NavBar, zzqt, dcyx, jywc },
   data: function() {
     return {
       // 头部标题
@@ -28,6 +41,28 @@ export default {
       isleftarrow: '',
       // 返回
       navShow: true,
+      activeName: 'first',
+      zzqtList: [
+        {
+          product_name: '产品名称',
+          username: '营销人',
+          market_username: '后买人',
+        },
+      ],
+      dcyxList: [
+        {
+          product_name: '产品名称',
+          username: '营销人',
+          market_username: '后买人',
+        },
+      ],
+      jywcList: [
+        {
+          product_name: '产品名称',
+          username: '营销人',
+          market_username: '后买人',
+        },
+      ],
     };
   },
   created() {},
@@ -45,7 +80,6 @@ export default {
   width: 100%;
   min-height: 667px;
   position: relative;
-  background-color: #f9fafc;
 }
 .top {
   height: 46px;

src/views/dockCenter/dynamicInfo/parts/dcyx.vue

@@ -0,0 +1,66 @@
+<template>
+  <div id="zzqt">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="list" v-for="(item, index) in dcyxList" :key="index">
+          <el-col :span="24" class="name">
+            {{ item.product_name }}
+          </el-col>
+          <el-col :span="24" class="text">
+            营销人：<span>{{ item.username }}</span>
+          </el-col>
+          <el-col :span="24" class="text">
+            购买人：<span>{{ item.market_username }}</span>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'zzqt',
+  props: {
+    dcyxList: null,
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>

src/views/dockCenter/dynamicInfo/parts/jywc.vue

@@ -0,0 +1,66 @@
+<template>
+  <div id="zzqt">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="list" v-for="(item, index) in jywcList" :key="index">
+          <el-col :span="24" class="name">
+            {{ item.product_name }}
+          </el-col>
+          <el-col :span="24" class="text">
+            营销人：<span>{{ item.username }}</span>
+          </el-col>
+          <el-col :span="24" class="text">
+            购买人：<span>{{ item.market_username }}</span>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'zzqt',
+  props: {
+    jywcList: null,
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>

src/views/dockCenter/dynamicInfo/parts/zzqt.vue

@@ -0,0 +1,66 @@
+<template>
+  <div id="zzqt">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="list" v-for="(item, index) in zzqtList" :key="index">
+          <el-col :span="24" class="name">
+            {{ item.product_name }}
+          </el-col>
+          <el-col :span="24" class="text">
+            营销人：<span>{{ item.username }}</span>
+          </el-col>
+          <el-col :span="24" class="text">
+            购买人：<span>{{ item.market_username }}</span>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'zzqt',
+  props: {
+    zzqtList: null,
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>

src/views/vipDockCenter/dynamicInfo/index.vue

@@ -6,7 +6,17 @@
           <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
         </el-col>
         <el-col :span="24" class="main">
-          动态监测
+          <el-tabs v-model="activeName" type="card">
+            <el-tab-pane label="正在洽谈" name="first">
+              <zzqt :zzqtList="zzqtList"></zzqt>
+            </el-tab-pane>
+            <el-tab-pane label="达成意向" name="second">
+              <dcyx :dcyxList="dcyxList"></dcyx>
+            </el-tab-pane>
+            <el-tab-pane label="交易完成" name="third">
+              <jywc :jywcList="jywcList"></jywc>
+            </el-tab-pane>
+          </el-tabs>
         </el-col>
       </el-col>
     </el-row>
@@ -14,12 +24,15 @@
 </template>
 
 <script>
+import zzqt from './parts/zzqt.vue';
+import dcyx from './parts/dcyx.vue';
+import jywc from './parts/jywc.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 import NavBar from '@/layout/common/topInfo.vue';
 export default {
   name: 'index',
   props: {},
-  components: { NavBar },
+  components: { NavBar, zzqt, dcyx, jywc },
   data: function() {
     return {
       // 头部标题
@@ -28,6 +41,28 @@ export default {
       isleftarrow: '',
       // 返回
       navShow: true,
+      activeName: 'first',
+      zzqtList: [
+        {
+          product_name: '产品名称',
+          username: '营销人',
+          market_username: '后买人',
+        },
+      ],
+      dcyxList: [
+        {
+          product_name: '产品名称',
+          username: '营销人',
+          market_username: '后买人',
+        },
+      ],
+      jywcList: [
+        {
+          product_name: '产品名称',
+          username: '营销人',
+          market_username: '后买人',
+        },
+      ],
     };
   },
   created() {},
@@ -45,7 +80,6 @@ export default {
   width: 100%;
   min-height: 667px;
   position: relative;
-  background-color: #f9fafc;
 }
 .top {
   height: 46px;

src/views/vipDockCenter/dynamicInfo/parts/dcyx.vue

@@ -0,0 +1,66 @@
+<template>
+  <div id="zzqt">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="list" v-for="(item, index) in dcyxList" :key="index">
+          <el-col :span="24" class="name">
+            {{ item.product_name }}
+          </el-col>
+          <el-col :span="24" class="text">
+            营销人：<span>{{ item.username }}</span>
+          </el-col>
+          <el-col :span="24" class="text">
+            购买人：<span>{{ item.market_username }}</span>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'zzqt',
+  props: {
+    dcyxList: null,
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>

src/views/vipDockCenter/dynamicInfo/parts/jywc.vue

@@ -0,0 +1,66 @@
+<template>
+  <div id="zzqt">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="list" v-for="(item, index) in jywcList" :key="index">
+          <el-col :span="24" class="name">
+            {{ item.product_name }}
+          </el-col>
+          <el-col :span="24" class="text">
+            营销人：<span>{{ item.username }}</span>
+          </el-col>
+          <el-col :span="24" class="text">
+            购买人：<span>{{ item.market_username }}</span>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'zzqt',
+  props: {
+    jywcList: null,
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>

src/views/vipDockCenter/dynamicInfo/parts/zzqt.vue

@@ -0,0 +1,66 @@
+<template>
+  <div id="zzqt">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="list" v-for="(item, index) in zzqtList" :key="index">
+          <el-col :span="24" class="name">
+            {{ item.product_name }}
+          </el-col>
+          <el-col :span="24" class="text">
+            营销人：<span>{{ item.username }}</span>
+          </el-col>
+          <el-col :span="24" class="text">
+            购买人：<span>{{ item.market_username }}</span>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'zzqt',
+  props: {
+    zzqtList: null,
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>

src/views/vipDockCenter/statisInfo/index.vue

@@ -6,7 +6,14 @@
           <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
         </el-col>
         <el-col :span="24" class="main">
-          统计报表
+          <el-tabs v-model="activeName" type="card">
+            <el-tab-pane label="技术需求" name="first">
+              <technology></technology>
+            </el-tab-pane>
+            <el-tab-pane label="可转化成果" name="second">
+              <achievements></achievements>
+            </el-tab-pane>
+          </el-tabs>
         </el-col>
       </el-col>
     </el-row>
@@ -16,10 +23,12 @@
 <script>
 import { mapState, createNamespacedHelpers } from 'vuex';
 import NavBar from '@/layout/common/topInfo.vue';
+import technology from './parts/technology.vue';
+import achievements from './parts/achievements.vue';
 export default {
   name: 'index',
   props: {},
-  components: { NavBar },
+  components: { NavBar, technology, achievements },
   data: function() {
     return {
       // 头部标题
@@ -28,6 +37,7 @@ export default {
       isleftarrow: '',
       // 返回
       navShow: true,
+      activeName: 'first',
     };
   },
   created() {},
@@ -45,7 +55,6 @@ export default {
   width: 100%;
   min-height: 667px;
   position: relative;
-  background-color: #f9fafc;
 }
 .top {
   height: 46px;
@@ -56,4 +65,13 @@ export default {
 .main {
   min-height: 570px;
 }
+/deep/.el-tabs--card > .el-tabs__header {
+  position: fixed;
+  width: 100%;
+  z-index: 999;
+  background: #fff;
+}
+/deep/.el-tabs__content {
+  top: 55px;
+}
 </style>

src/views/vipDockCenter/statisInfo/parts/achievements.vue

@@ -0,0 +1,132 @@
+<template>
+  <div id="achievements">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="shaixuan">
+          技术领域：
+          <el-select v-model="field" filterable clearable placeholder="请选择所属领域" @change="changeField">
+            <el-option label="先进制造" value="0"></el-option>
+            <el-option label="新材料" value="1"></el-option>
+            <el-option label="光电子" value="2"></el-option>
+            <el-option label="信息技术" value="3"></el-option>
+            <el-option label="文化和科技融合" value="4"></el-option>
+          </el-select>
+        </el-col>
+        <el-col :span="24">
+          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+            <el-col :span="24" class="name">
+              {{ item.name }}
+            </el-col>
+            <el-col :span="24" class="text">
+              技术领域
+              <span>
+                {{
+                  item.field == '0'
+                    ? '先进制造'
+                    : item.field == '1'
+                    ? '新材料'
+                    : item.field == '2'
+                    ? '光电子'
+                    : item.field == '3'
+                    ? '信息技术'
+                    : item.field == '4'
+                    ? '文化和科技融合'
+                    : '暂无'
+                }}
+              </span>
+            </el-col>
+            <el-col :span="24" class="text">
+              合作方式
+              <span>
+                {{
+                  item.coopermode == '0'
+                    ? '技术转让'
+                    : item.coopermode == '1'
+                    ? '技术服务'
+                    : item.coopermode == '2'
+                    ? '技术许可'
+                    : item.coopermode == '3'
+                    ? '技术融资'
+                    : item.coopermode == '4'
+                    ? '其他'
+                    : '暂无'
+                }}
+              </span>
+            </el-col>
+            <el-col :span="24" class="text">
+              交易方式：
+              <span>
+                {{ item.business == '0' ? '公用' : item.business == '1' ? '竞价' : item.business == '2' ? '转让' : '暂无' }}
+              </span>
+            </el-col>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'achievements',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      // 筛选
+      field: '',
+      list: [
+        {
+          name: '产品名称产品名称产品名称产品名称',
+          field: '0',
+          coopermode: '0',
+          business: '0',
+        },
+      ],
+    };
+  },
+  created() {},
+  methods: {
+    // 筛选技术领域
+    changeField(value) {
+      var arr = this.applyList.filter(item => item.field === value);
+      this.$set(this, `list`, arr);
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.shaixuan {
+  padding: 0 0 10px 10px;
+}
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>

src/views/vipDockCenter/statisInfo/parts/technology.vue

@@ -0,0 +1,132 @@
+<template>
+  <div id="technology">
+    <el-row>
+      <el-col :span="24">
+        <el-col :span="24" class="shaixuan">
+          技术领域：
+          <el-select v-model="field" filterable clearable placeholder="请选择所属领域" @change="changeField">
+            <el-option label="先进制造" value="0"></el-option>
+            <el-option label="新材料" value="1"></el-option>
+            <el-option label="光电子" value="2"></el-option>
+            <el-option label="信息技术" value="3"></el-option>
+            <el-option label="文化和科技融合" value="4"></el-option>
+          </el-select>
+        </el-col>
+        <el-col :span="24">
+          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+            <el-col :span="24" class="name">
+              {{ item.name }}
+            </el-col>
+            <el-col :span="24" class="text">
+              技术领域
+              <span>
+                {{
+                  item.field == '0'
+                    ? '先进制造'
+                    : item.field == '1'
+                    ? '新材料'
+                    : item.field == '2'
+                    ? '光电子'
+                    : item.field == '3'
+                    ? '信息技术'
+                    : item.field == '4'
+                    ? '文化和科技融合'
+                    : '暂无'
+                }}
+              </span>
+            </el-col>
+            <el-col :span="24" class="text">
+              合作方式
+              <span>
+                {{
+                  item.coopermode == '0'
+                    ? '技术转让'
+                    : item.coopermode == '1'
+                    ? '技术服务'
+                    : item.coopermode == '2'
+                    ? '技术许可'
+                    : item.coopermode == '3'
+                    ? '技术融资'
+                    : item.coopermode == '4'
+                    ? '其他'
+                    : '暂无'
+                }}
+              </span>
+            </el-col>
+            <el-col :span="24" class="text">
+              交易方式：
+              <span>
+                {{ item.business == '0' ? '公用' : item.business == '1' ? '竞价' : item.business == '2' ? '转让' : '暂无' }}
+              </span>
+            </el-col>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'technology',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      // 筛选
+      field: '',
+      list: [
+        {
+          name: '产品名称产品名称产品名称产品名称',
+          field: '0',
+          coopermode: '0',
+          business: '0',
+        },
+      ],
+    };
+  },
+  created() {},
+  methods: {
+    // 筛选技术领域
+    changeField(value) {
+      var arr = this.applyList.filter(item => item.field === value);
+      this.$set(this, `list`, arr);
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.shaixuan {
+  padding: 0 0 10px 10px;
+}
+.list {
+  margin: 0 5px 10px 5px;
+  width: 97%;
+  padding: 0 10px;
+  border-radius: 10px;
+  background: #f9fafc;
+  .name {
+    padding: 5px 0px;
+    font-size: 16px;
+  }
+  .text {
+    padding: 5px 0;
+    font-size: 14px;
+    color: #ccc;
+    span {
+      color: #000;
+    }
+  }
+}
+</style>