gengxin

src/layout/matter/detailinfo.vue

@@ -0,0 +1,112 @@
+<template>
+  <div id="detailinfo">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <p class="textOver">{{ detailInfo.name }}</p>
+        </el-col>
+        <el-col :span="24" class="message">
+          <p>
+            <span>服务范围</span>
+            <span>{{ detailInfo.scope || '暂无' }}</span>
+          </p>
+          <p>
+            <span>产品单价</span>
+            <span>{{ detailInfo.price }}/{{ detailInfo.priceunit }}</span>
+          </p>
+          <p>
+            <span>联系人</span>
+            <span>{{ detailInfo.contact_user }}</span>
+          </p>
+          <p>
+            <span>联系电话</span>
+            <span>{{ detailInfo.contact_tel }}</span>
+          </p>
+          <div class="introduction">
+            <p>产品简介</p>
+            <p>{{ detailInfo.introduction }}</p>
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'detailinfo',
+  props: {
+    detailInfo: 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>
+.info {
+  .top {
+    background: #fff;
+    min-height: 40px;
+    padding: 0 15px;
+    margin: 0 0 10px 0;
+    .carousel {
+      height: 200px !important;
+      padding: 10px 0;
+    }
+    .el-image {
+      width: 100%;
+      height: 200px;
+    }
+
+    p {
+      font-size: 18px;
+      // color: #7996b1;
+      padding: 10px 0 10px 0;
+      color: transparent;
+      -webkit-text-stroke: 1px #7996b1;
+      letter-spacing: 0.04em;
+    }
+  }
+  .message {
+    background: #fff;
+    padding: 0 15px;
+    min-height: 50px;
+    p {
+      min-height: 50px;
+      line-height: 50px;
+      border-bottom: 1px solid #ccc;
+    }
+    span:first-child {
+      display: inline-block;
+      width: 80px;
+      color: #ccc;
+    }
+    span:last-child {
+      color: #000;
+    }
+    div {
+      p {
+        border-bottom: none;
+      }
+    }
+  }
+}
+/deep/.el-carousel__container {
+  height: 200px !important;
+}
+</style>

src/router/index.js

@@ -70,6 +70,15 @@ const routes = [
     meta: { title: '事项管理', isleftarrow: true },
     component: () => import('../views/userCenter/matter/index.vue'),
   },
+
+  // 用户-事项管理详情
+  {
+    path: '/userCenter/matter/detailinfo',
+    name: 'matter_idetailinfo',
+    meta: { title: '事项详情', isleftarrow: true },
+    component: () => import('../views/userCenter/matter/detailinfo.vue'),
+  },
+
   // 用户-展会管理
   {
     path: '/userCenter/dock/index',

src/views/userCenter/matter/detailinfo.vue

@@ -0,0 +1,62 @@
+<template>
+  <div id="">
+    <el-row>
+      <el-col :span="24" class="style">
+        <el-col :span="24" class="top">
+          <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
+        </el-col>
+        <el-col :span="24" class="main">
+          <detailinfo :detailInfo="detailInfo"></detailinfo>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import NavBar from '@/layout/common/topInfo.vue';
+import detailinfo from '@/layout/matter/detailinfo.vue';
+export default {
+  name: 'prodDetail',
+  props: {},
+  components: {
+    NavBar,
+    detailinfo, //详情
+  },
+  data: () => ({
+    // 头部标题
+    title: '',
+    // meta为true
+    isleftarrow: '',
+    // 返回
+    navShow: true,
+    // 产品名称
+    detailInfo: {name:'测试产品'},
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+  mounted() {
+    this.title = this.$route.meta.title;
+    this.isleftarrow = this.$route.meta.isleftarrow;
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.style {
+  width: 100%;
+  min-height: 667px;
+  position: relative;
+  background-color: #f9fafc;
+}
+.top {
+  height: 46px;
+  overflow: hidden;
+  position: relative;
+  z-index: 999;
+}
+.main {
+  min-height: 570px;
+}
+</style>

src/views/userCenter/matter/index.vue

@@ -1,30 +1,134 @@
 <template>
   <div id="index">
-    <p>事项管理</p>
+    <el-col :span="24" class="style">
+      <el-col :span="24" class="top">
+        <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
+      </el-col>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="main">
+          <el-col :span="24" class="one">
+            <van-tabs v-model="active" animated>
+              <van-tab>
+                <template #title>
+                  <van-icon name="todo-list" />
+                  <p>我的全部</p>
+                </template>
+                <wholeList></wholeList>
+              </van-tab>
+              <van-tab>
+                <template #title>
+                  <van-icon name="column" />
+                  <p>我的洽谈</p>
+                </template>
+                <negotiation></negotiation>
+              </van-tab>
+              <van-tab>
+                <template #title>
+                  <van-icon name="label" />
+                  <p>我的意向</p>
+                </template>
+                <intentionList></intentionList>
+              </van-tab>
+
+              <van-tab>
+                <template #title>
+                  <van-icon name="label" />
+                  <p>我的交易</p>
+                </template>
+                <transaction></transaction>
+              </van-tab>
+            </van-tabs>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-col>
   </div>
 </template>
 
 <script>
 import { mapState, createNamespacedHelpers } from 'vuex';
+import NavBar from '@/layout/common/topInfo.vue';
+import wholeList from './parts/wholeList.vue';
+import negotiation from './parts/negotiation.vue';
+import intentionList from './parts/intentionList.vue';
+import transaction from './parts/transaction.vue';
+
 export default {
   name: 'index',
   props: {},
-  components: {},
-  data: function() {
-    return {};
-  },
+  components: { NavBar, wholeList, negotiation, intentionList, transaction },
+  data: () => ({
+    // 头部标题
+    title: '',
+    // meta为true
+    isleftarrow: '',
+    // 返回
+    navShow: true,
+    img_path: require('@/assets/logo.png'),
+  }),
   created() {},
-  methods: {},
-  computed: {
-    ...mapState(['user']),
-    pageTitle() {
-      return `${this.$route.meta.title}`;
+  computed: {},
+  methods: {
+    uploadSuccess({ type, data }) {
+      console.log(type, data);
+      // if (type !== 'img_path') {
+      //   let arr = _.get(this.uploads, type);
+      //   if (arr !== undefined) {
+      //     this.uploads[type].push({ name: data.name, uri: data.uri });
+      //   } else {
+      //     let newArr = [{ name: data.name, uri: data.uri }];
+      //     this.$set(this.uploads, `${type}`, newArr);
+      //   }
+      // } else {
+      //   this.picLoading = false;
+      //   this.$set(this.info, `${type}`, data.uri);
+      //   this.$nextTick(() => {
+      //     this.picLoading = true;
+      //   });
+      // }
     },
   },
-  metaInfo() {
-    return { title: this.$route.meta.title };
+  mounted() {
+    this.title = this.$route.meta.title;
+    this.isleftarrow = this.$route.meta.isleftarrow;
   },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.style {
+  width: 100%;
+  min-height: 667px;
+  position: relative;
+  background-color: #f9fafc;
+}
+.top {
+  height: 46px;
+  overflow: hidden;
+  position: relative;
+  z-index: 999;
+}
+.main {
+  min-height: 570px;
+  .two {
+    position: fixed;
+    top: 80%;
+
+    left: 10px;
+    z-index: 999;
+  }
+}
+/deep/.van-tab {
+  text-align: center;
+}
+/deep/.van-tabs--line .van-tabs__wrap {
+  height: 70px;
+  margin: 0 0 10px 0;
+}
+/deep/.van-tab--active {
+  color: red;
+}
+.van-icon {
+  font-size: 20px;
+}
+</style>

src/views/userCenter/matter/parts/intentionList.vue

@@ -0,0 +1,124 @@
+<template>
+  <div id="auditList">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="list" @click.native="$router.push({ path: '/userCenter/matter/detailinfo' })" v-for="(item, index) in list" :key="index">
+          <p class="textOver">{{ item.product_name }}</p>
+          <p>
+            <span class="ptwo"><span>营销人名称:</span>{{ item.market_username || '暂无phase' }}</span>
+            <span class="ptwo"><span>购买人名称:</span>{{ item.username || '暂无' }}</span>
+          </p>
+          <p class="textOver"><span>说明：</span>{{ item.description || '暂无' }}</p>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: product } = createNamespacedHelpers('marketproduct');
+export default {
+  name: 'auditList',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      list: [
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+      ],
+    };
+  },
+  created() {
+    this.searchInfo();
+  },
+  methods: {
+    ...product(['newquery']),
+    async searchInfo() {
+      // let res = await this.newquery({ skip: 0, limit: 6, totaltype: '0', status: '1' });
+      // if (this.$checkRes(res)) {
+      //   this.$set(this, `list`, res.data);
+      // }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.info {
+  border-top: 1px solid #f5f5f5;
+  .list {
+    background: #fff;
+    padding: 0 10px;
+    border-bottom: 1px solid #ccc;
+    p {
+      font-size: 14px;
+      color: #000;
+      padding: 5px 0;
+    }
+    p:first-child {
+      font-size: 16px;
+    }
+    p:nth-child(2) .ptwo {
+      display: inline-block;
+      width: 50%;
+    }
+    p:nth-child(2) .ptwo span:first-child {
+      color: #ccc;
+    }
+    p:last-child span {
+      color: #ccc;
+    }
+  }
+}
+</style>

src/views/userCenter/matter/parts/negotiation.vue

@@ -0,0 +1,124 @@
+<template>
+  <div id="auditList">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="list" @click.native="$router.push({ path: '/userCenter/matter/detailinfo' })" v-for="(item, index) in list" :key="index">
+          <p class="textOver">{{ item.product_name }}</p>
+          <p>
+            <span class="ptwo"><span>营销人名称:</span>{{ item.market_username || '暂无phase' }}</span>
+            <span class="ptwo"><span>购买人名称:</span>{{ item.username || '暂无' }}</span>
+          </p>
+          <p class="textOver"><span>说明：</span>{{ item.description || '暂无' }}</p>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: product } = createNamespacedHelpers('marketproduct');
+export default {
+  name: 'auditList',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      list: [
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+      ],
+    };
+  },
+  created() {
+    this.searchInfo();
+  },
+  methods: {
+    ...product(['newquery']),
+    async searchInfo() {
+      // let res = await this.newquery({ skip: 0, limit: 6, totaltype: '0', status: '1' });
+      // if (this.$checkRes(res)) {
+      //   this.$set(this, `list`, res.data);
+      // }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.info {
+  border-top: 1px solid #f5f5f5;
+  .list {
+    background: #fff;
+    padding: 0 10px;
+    border-bottom: 1px solid #ccc;
+    p {
+      font-size: 14px;
+      color: #000;
+      padding: 5px 0;
+    }
+    p:first-child {
+      font-size: 16px;
+    }
+    p:nth-child(2) .ptwo {
+      display: inline-block;
+      width: 50%;
+    }
+    p:nth-child(2) .ptwo span:first-child {
+      color: #ccc;
+    }
+    p:last-child span {
+      color: #ccc;
+    }
+  }
+}
+</style>

src/views/userCenter/matter/parts/transaction.vue

@@ -0,0 +1,124 @@
+<template>
+  <div id="auditList">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="list" @click.native="$router.push({ path: '/userCenter/matter/detailinfo' })" v-for="(item, index) in list" :key="index">
+          <p class="textOver">{{ item.product_name }}</p>
+          <p>
+            <span class="ptwo"><span>营销人名称:</span>{{ item.market_username || '暂无phase' }}</span>
+            <span class="ptwo"><span>购买人名称:</span>{{ item.username || '暂无' }}</span>
+          </p>
+          <p class="textOver"><span>说明：</span>{{ item.description || '暂无' }}</p>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: product } = createNamespacedHelpers('marketproduct');
+export default {
+  name: 'auditList',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      list: [
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+      ],
+    };
+  },
+  created() {
+    this.searchInfo();
+  },
+  methods: {
+    ...product(['newquery']),
+    async searchInfo() {
+      // let res = await this.newquery({ skip: 0, limit: 6, totaltype: '0', status: '1' });
+      // if (this.$checkRes(res)) {
+      //   this.$set(this, `list`, res.data);
+      // }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.info {
+  border-top: 1px solid #f5f5f5;
+  .list {
+    background: #fff;
+    padding: 0 10px;
+    border-bottom: 1px solid #ccc;
+    p {
+      font-size: 14px;
+      color: #000;
+      padding: 5px 0;
+    }
+    p:first-child {
+      font-size: 16px;
+    }
+    p:nth-child(2) .ptwo {
+      display: inline-block;
+      width: 50%;
+    }
+    p:nth-child(2) .ptwo span:first-child {
+      color: #ccc;
+    }
+    p:last-child span {
+      color: #ccc;
+    }
+  }
+}
+</style>

src/views/userCenter/matter/parts/wholeList.vue

@@ -0,0 +1,124 @@
+<template>
+  <div id="auditList">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="list" @click.native="$router.push({ path: '/userCenter/matter/detailinfo' })" v-for="(item, index) in list" :key="index">
+          <p class="textOver">{{ item.product_name }}</p>
+          <p>
+            <span class="ptwo"><span>营销人名称:</span>{{ item.market_username || '暂无phase' }}</span>
+            <span class="ptwo"><span>购买人名称:</span>{{ item.username || '暂无' }}</span>
+          </p>
+          <p class="textOver"><span>说明：</span>{{ item.description || '暂无' }}</p>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: product } = createNamespacedHelpers('marketproduct');
+export default {
+  name: 'auditList',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      list: [
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+        {
+          product_name: '最最新新技术',
+          market_username: '卖家1',
+          username: '买家1',
+          description: '222222222222222222222222222222',
+        },
+      ],
+    };
+  },
+  created() {
+    this.searchInfo();
+  },
+  methods: {
+    ...product(['newquery']),
+    async searchInfo() {
+      // let res = await this.newquery({ skip: 0, limit: 6, totaltype: '0', status: '1' });
+      // if (this.$checkRes(res)) {
+      //   this.$set(this, `list`, res.data);
+      // }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.info {
+  border-top: 1px solid #f5f5f5;
+  .list {
+    background: #fff;
+    padding: 0 10px;
+    border-bottom: 1px solid #ccc;
+    p {
+      font-size: 14px;
+      color: #000;
+      padding: 5px 0;
+    }
+    p:first-child {
+      font-size: 16px;
+    }
+    p:nth-child(2) .ptwo {
+      display: inline-block;
+      width: 50%;
+    }
+    p:nth-child(2) .ptwo span:first-child {
+      color: #ccc;
+    }
+    p:last-child span {
+      color: #ccc;
+    }
+  }
+}
+</style>