更新我要发布和组件个人中心

src/components/svstem/svstem.vue

@@ -18,7 +18,7 @@
         <div class="w_1200">
           <el-col :span="5" class="fenlei">
             <el-col :span="24" class="geren">
-              <geren></geren>
+              <fabuinfo></fabuinfo>
             </el-col>
             <el-col :span="24" class="diaocha">
               <diaocha :diaochatitle="diaochatitle"></diaocha>
@@ -43,7 +43,7 @@ import top from '@/layout/index/top.vue';
 import logo from '@/layout/index/logo.vue';
 import menuInfo from '@/layout/index/menuInfo.vue';
 import foot from '@/layout/index/foot.vue';
-import geren from '@/layout/svstem/geren.vue';
+import fabuinfo from '@/layout/svstem/fabuinfo.vue';
 import diaocha from '@/layout/svstem/diaocha.vue';
 import rightcont from '@/layout/svstem/rightcont.vue';
 export default {
@@ -58,7 +58,7 @@ export default {
     logo, //logo
     menuInfo, //导航
     foot, //底部
-    geren, //左边个人中心
+    fabuinfo, //左边个人中心
     rightcont, //右边基本信息
     diaocha, //左边网上调查
   },

src/components/svstem/svstemorder.vue

@@ -0,0 +1,142 @@
+<template>
+  <div id="svstemorder">
+    <el-row>
+      <el-col :span="24" class="top">
+        <top></top>
+      </el-col>
+      <el-col :span="24" class="logo">
+        <div class="w_1200">
+          <logo :info="info"></logo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="menu">
+        <div class="w_1200">
+          <menuInfo></menuInfo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="main">
+        <div class="w_1200">
+          <el-col :span="5" class="fenlei">
+            <el-col :span="24" class="gereninfo">
+              <fabuinfo></fabuinfo>
+            </el-col>
+            <el-col :span="24" class="diaocha">
+              <diaocha :diaochatitle="diaochatitle"></diaocha>
+            </el-col>
+          </el-col>
+          <el-col :span="19" class="rightcont">
+            <dinggouinfo :dinggouList="dinggouList"></dinggouinfo>
+          </el-col>
+        </div>
+      </el-col>
+      <el-col :span="24" class="foot">
+        <div class="w_1200">
+          <foot :info="info"></foot>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/index/top.vue';
+import logo from '@/layout/index/logo.vue';
+import menuInfo from '@/layout/index/menuInfo.vue';
+import foot from '@/layout/index/foot.vue';
+import fabuinfo from '@/layout/svstem/fabuinfo.vue';
+import diaocha from '@/layout/svstem/diaocha.vue';
+import dinggouinfo from '@/layout/svstem/dinggouinfo.vue';
+export default {
+  name: 'svstemorder',
+  props: {
+    info: null, //站点信息
+    dinggouList: null,
+    diaochatitle: null,
+  },
+  components: {
+    top, //头部
+    logo, //logo
+    menuInfo, //导航
+    foot, //底部
+    fabuinfo, //左边个人中心
+    dinggouinfo, //右边
+    diaocha, //左边网上调查
+  },
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.top {
+  height: 40px;
+  overflow: hidden;
+  background-color: rgba(11, 58, 125, 0.8);
+}
+.logo {
+  height: 200px;
+  overflow: hidden;
+}
+.menu {
+  height: 70px;
+  overflow: hidden;
+}
+
+.main {
+  min-height: 600px;
+  overflow: hidden;
+  margin: 10px 0;
+}
+.main .fenlei {
+  float: left;
+  width: 240px;
+  min-height: 850px;
+  margin: 0 10px 0 0;
+  overflow: hidden;
+}
+.gereninfo {
+  float: left;
+  width: 240px;
+  min-height: 360px;
+  // margin: 0 10px 0 0;
+  overflow: hidden;
+  background-color: #ffffff;
+}
+
+.diaocha {
+  float: left;
+  width: 240px;
+  min-height: 480px;
+  margin: 10px 0 0 0;
+  overflow: hidden;
+  background-color: #ffffff;
+}
+
+.main .rightcont {
+  float: left;
+  width: 950px;
+  min-height: 850px;
+  overflow: hidden;
+  background-color: #fff;
+}
+
+.main .link {
+  float: left;
+  width: 100%;
+  height: 100px;
+  overflow: hidden;
+  background-color: #fff;
+}
+.foot {
+  float: left;
+  width: 100%;
+  height: 120px;
+  overflow: hidden;
+}
+</style>

src/components/svstem/svstemrelease.vue

@@ -0,0 +1,140 @@
+<template>
+  <div id="svstemrelese">
+    <el-row>
+      <el-col :span="24" class="top">
+        <top></top>
+      </el-col>
+      <el-col :span="24" class="logo">
+        <div class="w_1200">
+          <logo :info="info"></logo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="menu">
+        <div class="w_1200">
+          <menuInfo></menuInfo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="main">
+        <div class="w_1200">
+          <el-col :span="5" class="fenlei">
+            <el-col :span="24" class="gereninfo">
+              <fabuinfo></fabuinfo>
+            </el-col>
+            <el-col :span="24" class="diaocha">
+              <diaocha></diaocha>
+            </el-col>
+          </el-col>
+          <el-col :span="19" class="rightcont">
+            <xiuqiuright></xiuqiuright>
+          </el-col>
+        </div>
+      </el-col>
+      <el-col :span="24" class="foot">
+        <div class="w_1200">
+          <foot :info="info"></foot>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/index/top.vue';
+import logo from '@/layout/index/logo.vue';
+import menuInfo from '@/layout/index/menuInfo.vue';
+import foot from '@/layout/index/foot.vue';
+import diaocha from '@/layout/svstem/diaocha.vue';
+import fabuinfo from '@/layout/svstem/fabuinfo.vue';
+import xiuqiuright from '@/layout/svstem/xiuqiuright.vue';
+export default {
+  name: 'svstemrelese',
+  props: {
+    info: null, //站点信息
+  },
+  components: {
+    top, //头部
+    logo, //logo
+    menuInfo, //导航
+    foot, //底部
+    fabuinfo, //个人中心
+    diaocha, //相似产品
+    xiuqiuright, //右边信息
+  },
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.top {
+  height: 40px;
+  overflow: hidden;
+  background-color: rgba(11, 58, 125, 0.8);
+}
+.logo {
+  height: 200px;
+  overflow: hidden;
+}
+.menu {
+  height: 70px;
+  overflow: hidden;
+}
+
+.main {
+  min-height: 600px;
+  overflow: hidden;
+  margin: 10px 0;
+}
+.main .fenlei {
+  float: left;
+  width: 240px;
+  // min-height: 857px;
+  margin: 0 10px 0 0;
+  overflow: hidden;
+}
+.gereninfo {
+  float: left;
+  width: 240px;
+  min-height: 420px;
+  // margin: 0 10px 0 0;
+  overflow: hidden;
+  background-color: #ffffff;
+}
+
+.diaocha {
+  float: left;
+  width: 240px;
+  min-height: 346px;
+  margin: 10px 0 0 0;
+  overflow: hidden;
+  background-color: #ffffff;
+}
+
+.main .rightcont {
+  float: left;
+  width: 950px;
+  min-height: 875px;
+  overflow: hidden;
+  background-color: #fff;
+}
+
+.main .link {
+  float: left;
+  width: 100%;
+  height: 100px;
+  overflow: hidden;
+  background-color: #fff;
+}
+.foot {
+  float: left;
+  width: 100%;
+  height: 120px;
+  overflow: hidden;
+}
+</style>

src/components/svstem/svstemreview.vue

@@ -18,7 +18,7 @@
         <div class="w_1200">
           <el-col :span="5" class="fenlei">
             <el-col :span="24" class="geren">
-              <geren></geren>
+              <fabuinfo></fabuinfo>
             </el-col>
             <el-col :span="24" class="diaocha">
               <diaocha :diaochatitle="diaochatitle"></diaocha>
@@ -43,7 +43,7 @@ import top from '@/layout/index/top.vue';
 import logo from '@/layout/index/logo.vue';
 import menuInfo from '@/layout/index/menuInfo.vue';
 import foot from '@/layout/index/foot.vue';
-import geren from '@/layout/svstem/geren.vue';
+import fabuinfo from '@/layout/svstem/fabuinfo.vue';
 import diaocha from '@/layout/svstem/diaocha.vue';
 import rightinfo from '@/layout/svstem/rightinfo.vue';
 export default {
@@ -59,7 +59,7 @@ export default {
     logo, //logo
     menuInfo, //导航
     foot, //底部
-    geren, //左边个人中心
+    fabuinfo, //左边个人中心
     rightinfo, //右边
     diaocha, //左边网上调查
   },

src/components/svstem/svstemuser.vue

@@ -18,7 +18,7 @@
         <div class="w_1200">
           <el-col :span="5" class="fenlei">
             <el-col :span="24" class="geren">
-              <xingeren></xingeren>
+              <fabuinfo></fabuinfo>
             </el-col>
             <el-col :span="24" class="diaocha">
               <diaocha :diaochatitle="diaochatitle"></diaocha>
@@ -43,7 +43,7 @@ import top from '@/layout/index/top.vue';
 import logo from '@/layout/index/logo.vue';
 import menuInfo from '@/layout/index/menuInfo.vue';
 import foot from '@/layout/index/foot.vue';
-import xingeren from '@/layout/svstem/xingeren.vue';
+import fabuinfo from '@/layout/svstem/fabuinfo.vue';
 import diaocha from '@/layout/svstem/diaocha.vue';
 import right from '@/layout/svstem/right.vue';
 export default {
@@ -59,7 +59,7 @@ export default {
     logo, //logo
     menuInfo, //导航
     foot, //底部
-    xingeren, //左边个人中心
+    fabuinfo, //左边个人中心
     right, //右边基本信息
     diaocha, //左边网上调查
   },

src/layout/svstem/chanpin.vue

@@ -0,0 +1,55 @@
+<template>
+  <div id="chanpin">
+    <el-col :span="24" class="leftTop"> <span class="spanOne"> </span> 相似产品<span class="spanTwo"></span> </el-col>
+
+    <el-col :span="24" class="leftContent">
+      {{ context }}
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'chanpin',
+  props: {},
+  components: {},
+  data: () => ({
+    context: '没有找到相似产品',
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.leftTop {
+  width: 204px;
+  height: 52px;
+  line-height: 52px;
+  color: #555;
+  margin-left: 18px;
+}
+
+.spanOne {
+  width: 60px;
+  height: 1px;
+  display: block;
+  margin: 25px 10px 0 0;
+  background: #c2c2c2;
+  float: left;
+}
+.spanTwo {
+  width: 60px;
+  height: 1px;
+  display: block;
+  margin: -25px 0 0 10px;
+  background: #c2c2c2;
+  float: right;
+}
+.leftContent {
+  width: 204px;
+  margin-left: 18px;
+  color: #a3a3a3;
+}
+</style>

src/layout/svstem/diaocha.vue

@@ -1,15 +1,14 @@
 <template>
   <div id="diaocha">
     <el-col class="swfl">
-      <el-image style="width:22px;height:22px;margin:0 5px -5px 0;" :src="src"></el-image>
-      <span>{{ title }}</span>
+      <el-image style="width:240px;height:60px;" :src="src"></el-image>
+      <!-- <span>{{ title }}</span> -->
     </el-col>
     <el-col :span="24" class="tu">
       <el-image :src="pic"></el-image>
     </el-col>
-
     <el-col :span="24" class="wenZi">
-      <el-col :span="24" v-for="(item, index) in diaochatitle" :key="index">{{ item.context }} </el-col>
+      <el-col :span="24"> 您是否愿意继续关注本平台 </el-col>
       <el-col :span="24">
         <el-radio-group v-model="form.resource">
           <el-col :span="24" class="anniu"><el-radio :label="3"> 同意</el-radio></el-col>
@@ -24,14 +23,12 @@
 <script>
 export default {
   name: 'diaocha',
-  props: {
-    diaochatitle: null,
-  },
+  props: {},
   components: {},
   data: () => ({
-    src: require('@/assets/zw2.png'),
+    src: require('@/assets/diaocha.gif'),
     pic: require('@/assets/cha.png'),
-    title: '网上调查',
+
     form: {
       resource: '',
     },
@@ -54,10 +51,6 @@ export default {
 
 <style lang="less" scoped>
 .swfl {
-  height: 60px;
-  width: 240px;
-  line-height: 60px;
-  background-color: #22529a;
   text-align: center;
 }
 .swfl span {
@@ -85,7 +78,6 @@ export default {
   padding-left: 28px;
   font-size: 14px;
   padding-right: 10px;
-  margin-top: 35px;
 
   line-height: 30px;
   padding-bottom: 15px;

src/layout/svstem/dinggouinfo.vue

@@ -0,0 +1,227 @@
+<template>
+  <div id="dinggouinfo">
+    <el-col :span="24">
+      <el-col :span="24" class="rightTop"
+        ><span class="title">{{ title }}</span></el-col
+      >
+
+      <el-col :span="24" class="context">
+        <el-tabs v-model="activeName" @tab-click="handleClick" class="shenhe">
+          <el-tab-pane label="我的订购" name="first">
+            <el-col :span="24">
+              <el-col :span="24" class="fblist1" v-for="(item, index) in dinggouList" :key="index">
+                <el-col :span="24" class="fbListTop">
+                  <el-col :span="20"> 信息号：{{ item.id }} </el-col>
+                  <el-col :span="4">{{ item.date }}</el-col>
+                </el-col>
+                <el-col :span="24">
+                  <el-col :span="9">
+                    <el-col :span="10" class="image_1"><el-image :src="item.pic"></el-image> </el-col>
+                    <el-col :span="14" class="fbListCenterC">
+                      <el-col class="listname">产品：{{ item.name }}</el-col>
+                      <el-col class="listtype">类别：{{ item.type }}</el-col>
+                      <el-col class="listMoney">{{ item.maoney }}/台</el-col>
+                    </el-col>
+                  </el-col>
+                  <el-col :span="11" class="fbListCenterTwo">
+                    <el-col>
+                      <el-col class="faTop"> 最新申请</el-col>
+                      <el-col class="faTxt">我要买</el-col>
+                    </el-col>
+                  </el-col>
+                  <el-col :span="4">
+                    <el-col class="fbListCenterR">
+                      <el-col class="fbListCenterQ"> 编辑</el-col>
+                      <el-col class="fbListCenterQ">彻底删除 </el-col>
+                      <el-col class="fbListCenterQ">查看详情 </el-col>
+                    </el-col>
+                  </el-col>
+                </el-col>
+              </el-col>
+              <el-col class="page">
+                <el-pagination
+                  @size-change="handleSizeChange"
+                  @current-change="handleCurrentChange"
+                  :current-page="currentPage"
+                  layout="total,  prev, pager, next, jumper"
+                  :total="1"
+                >
+                </el-pagination>
+              </el-col>
+            </el-col>
+          </el-tab-pane>
+        </el-tabs>
+      </el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'gereninfo',
+  props: {
+    dinggouList: null,
+  },
+  components: {},
+  data: () => ({
+    activeName: 'first',
+    title: '我要订购',
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.rightTop {
+  height: 60px;
+
+  line-height: 60px;
+  border-bottom: 1px solid #215299;
+}
+.rightTop .title {
+  width: 130px;
+  height: 60px;
+  float: left;
+  color: rgb(255, 255, 255);
+  font-size: 18px;
+  text-align: center;
+  font-family: 微软雅黑, Tahoma, Arial, Helvetica, STHeiti;
+  background: rgb(33, 82, 153);
+}
+/deep/.el-tabs__item.is-active {
+  color: #215299;
+}
+/deep/.el-tabs__active-bar {
+  background-color: #215299;
+}
+.context {
+  width: 885px;
+  margin: 30px 20px 0 20px;
+  min-height: 710px;
+}
+.fblist1 {
+  width: 888px;
+  height: 183px;
+  border: 1px solid #ccc;
+  margin-top: 20px;
+}
+.fbListTop {
+  height: 43px;
+  margin-left: 1px;
+  background: #fafafa;
+  line-height: 43px;
+  text-indent: 10px;
+  font-size: 13px;
+  color: #888888;
+  width: 885px;
+}
+.image_1 {
+  width: 110px;
+  height: 119px;
+  float: left;
+  margin: 10px 0 0 10px;
+}
+.listname {
+  width: 110px;
+  height: 119px;
+  float: left;
+  margin: 10px 0 0 20px;
+  height: 30px;
+  font-size: 16px;
+  color: #555555;
+}
+.listtype {
+  width: 110px;
+  height: 119px;
+  float: left;
+  margin: 0 0 0 20px;
+  height: 30px;
+  font-size: 16px;
+  color: #555555;
+}
+.listMoney {
+  height: 30px;
+  font-size: 16px;
+  color: #fe0000;
+  width: 196px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+
+  margin: 0 0 0 20px;
+}
+.faTop {
+  padding-left: 10px;
+  width: 374px;
+  font-size: 14px;
+  height: 35px;
+  line-height: 35px;
+  color: #215299;
+}
+
+.fbListCenterC[data-v-3bd16ea3] {
+  width: 199px;
+  border-right: 1px solid #ccc;
+  float: left;
+  padding-right: 0px;
+  height: 100px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+
+  margin: 15px 0 0 0;
+}
+.fbListCenterTwo {
+  width: 385px;
+  float: left;
+  margin-left: 10px;
+  margin-right: 10px;
+  background: #fafafa;
+  height: 100px;
+  margin-top: 10px;
+}
+.faTxt {
+  padding-left: 10px;
+  width: 374px;
+  height: 55px;
+  font-size: 14px;
+  word-break: break-all;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3;
+  overflow: hidden;
+}
+.fbListCenterR {
+  border-left: 1px solid #ccc;
+  width: 125px;
+  height: 100px;
+  float: left;
+  margin: 18px 0 0 0;
+}
+.fbListCenterQ {
+  color: #215299;
+  margin: 0 30px 0 30px;
+}
+.page {
+  margin: 20px 0 0 0;
+  text-align: center;
+}
+/deep/.el-tabs__active-bar .is-top {
+  width: 140px;
+  background-color: #215299;
+  text-align: center;
+}
+</style>

src/layout/svstem/fabuinfo.vue

@@ -0,0 +1,65 @@
+<template>
+  <div id="fabuinfo">
+    <el-col class="swfl">
+      <el-image style="width:22px;height:22px;margin:0 5px -5px 0;" :src="src"></el-image>
+      <span>个人中心</span>
+    </el-col>
+    <el-col>
+      <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" text-color="#215299" active-text-color="#215299">
+        <el-menu-item index="1"><span slot="title">基本信息</span></el-menu-item>
+        <el-menu-item index="2"><span slot="title">消息管理</span></el-menu-item>
+        <el-menu-item index="3"><span slot="title">用户管理</span></el-menu-item>
+        <el-menu-item index="4"><span slot="title">我要发布</span></el-menu-item>
+        <el-menu-item index="5"><span slot="title">我的发布</span></el-menu-item>
+        <el-menu-item index="6"><span slot="title">我的审核</span></el-menu-item>
+        <el-menu-item index="7"><span slot="title">我的订购</span></el-menu-item>
+        <el-menu-item index="8"><span slot="title">注销账号</span></el-menu-item>
+      </el-menu>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'fabuinfo',
+  props: {},
+  components: {},
+  data: () => ({
+    src: require('@/assets/personal.png'),
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.swfl {
+  height: 60px;
+  width: 240px;
+  line-height: 60px;
+  background-color: #22529a;
+  text-align: center;
+}
+.swfl span {
+  font-size: 22px;
+  color: #ffffff;
+}
+/deep/.el-menu-item {
+  height: 60px;
+  text-align: center;
+  line-height: 60px;
+  border-bottom: 1px dashed;
+  font-size: 22px;
+}
+/deep/.el-menu-item:last-child {
+  border-bottom: none;
+}
+</style>

src/layout/svstem/gereninfo.vue

@@ -0,0 +1,62 @@
+<template>
+  <div id="gereninfo">
+    <el-col class="swfl">
+      <el-image style="width:22px;height:22px;margin:0 5px -5px 0;" :src="src"></el-image>
+      <span>个人中心</span>
+    </el-col>
+    <el-col>
+      <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" text-color="#215299" active-text-color="#215299">
+        <el-menu-item index="1"><span slot="title">基本信息</span></el-menu-item>
+        <el-menu-item index="2"><span slot="title">用户管理</span></el-menu-item>
+        <el-menu-item index="3"><span slot="title">我的发布</span></el-menu-item>
+        <el-menu-item index="4"><span slot="title">我的订购</span></el-menu-item>
+        <el-menu-item index="5"><span slot="title">注销账号</span></el-menu-item>
+      </el-menu>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'gereninfo',
+  props: {},
+  components: {},
+  data: () => ({
+    src: require('@/assets/personal.png'),
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.swfl {
+  height: 60px;
+  width: 240px;
+  line-height: 60px;
+  background-color: #22529a;
+  text-align: center;
+}
+.swfl span {
+  font-size: 22px;
+  color: #ffffff;
+}
+/deep/.el-menu-item {
+  height: 60px;
+  text-align: center;
+  line-height: 60px;
+  border-bottom: 1px dashed;
+  font-size: 22px;
+}
+/deep/.el-menu-item:last-child {
+  border-bottom: none;
+}
+</style>

src/layout/svstem/xiuqiuright.vue

@@ -0,0 +1,334 @@
+<template>
+  <div id="xiuqiuright">
+    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+      <el-tab-pane label="需求发布" name="first">
+        <el-form ref="form" :model="form" label-width="80px">
+          <el-form-item label="名     称">
+            <el-col class="title"> <el-input v-model="form.name" placeholder="请输入供需信息名称"></el-input></el-col>
+          </el-form-item>
+          <el-form-item label="类     别">
+            <el-col class="Bg">
+              <el-select v-model="value" placeholder="请选择" size="medium">
+                <el-option v-for="item in cities" :key="item.value" :value="item.value">
+                  <span style="float: left">{{ item.value }}</span>
+                </el-option>
+              </el-select></el-col
+            >
+          </el-form-item>
+          <el-form-item label="单位/个人">
+            <el-col class="title"> <el-input v-model="form.person" placeholder=""></el-input></el-col>
+          </el-form-item>
+
+          <el-form-item label="价     格">
+            <el-col class="title"> <el-input v-model="form.money" placeholder=""></el-input></el-col>
+          </el-form-item>
+
+          <el-form-item label="联系电话">
+            <el-col class="title"> <el-input v-model="form.tel" placeholder=""></el-input></el-col>
+          </el-form-item>
+          <el-form-item label="图片">
+            <el-upload
+              action="https://jsonplaceholder.typicode.com/posts/"
+              list-type="picture-card"
+              :on-preview="handlePictureCardPreview"
+              :on-remove="handleRemove"
+            >
+              <i class="el-icon-plus"></i>
+            </el-upload>
+            <el-dialog :visible.sync="dialogVisible">
+              <img width="100%" :src="dialogImageUrl" alt="" />
+            </el-dialog>
+          </el-form-item>
+          <el-col :span="24">
+            <span class="max">最多上传6张,每张最大10m </span>
+          </el-col>
+          <el-col :span="24" class="jianjie">
+            <el-form-item label="简介">
+              <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 3 }" placeholder="请输入内容" v-model="textarea"> </el-input>
+            </el-form-item>
+            <el-col :soan="24" class="anniu">
+              <el-form-item>
+                <el-button type="primary" @click="onSubmit">提交</el-button>
+              </el-form-item>
+            </el-col>
+          </el-col>
+        </el-form>
+      </el-tab-pane>
+      <el-tab-pane label="供给发布" name="second">
+        <el-form ref="form" :model="form" label-width="80px">
+          <el-form-item label="名     称">
+            <el-col class="title"> <el-input v-model="form.name" placeholder="请输入供需信息名称"></el-input></el-col>
+          </el-form-item>
+          <el-form-item label="类     别">
+            <el-col class="Bg">
+              <el-select v-model="value" placeholder="请选择" size="medium">
+                <el-option v-for="item in cities" :key="item.value" :value="item.value">
+                  <span style="float: left">{{ item.value }}</span>
+                </el-option>
+              </el-select></el-col
+            >
+          </el-form-item>
+          <el-form-item label="服务项目">
+            <el-col class="title"> <el-input v-model="form.person" placeholder=""></el-input></el-col>
+          </el-form-item>
+
+          <el-form-item label="服务范围">
+            <el-col class="fanwei">
+              <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 3 }" placeholder="请输入内容" v-model="textarea"> </el-input
+            ></el-col>
+          </el-form-item>
+
+          <el-form-item label="单     价">
+            <el-col class="title"> <el-input v-model="form.price" placeholder=""></el-input></el-col>
+          </el-form-item>
+          <el-form-item label="交易方式">
+            <el-radio v-model="radio" label="1">转让</el-radio>
+            <el-radio v-model="radio" label="2">公用</el-radio>
+            <el-radio v-model="radio" label="3">竞价</el-radio>
+          </el-form-item>
+
+          <el-form-item label="简介">
+            <el-col class="jianjie">
+              <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 3 }" placeholder="请输入内容" v-model="textarea"> </el-input
+            ></el-col>
+          </el-form-item>
+          <el-col :soan="24" class="anniu">
+            <el-form-item>
+              <el-button type="primary" @click="onSubmit">提交</el-button>
+            </el-form-item>
+          </el-col>
+        </el-form>
+      </el-tab-pane>
+      <el-tab-pane label="产品发布" name="third">
+        <el-form ref="form" :model="form" label-width="80px">
+          <el-form-item label="类     别">
+            <el-col class="Bg">
+              <el-select v-model="value" placeholder="请选择" size="medium">
+                <el-option v-for="item in cities" :key="item.type" :value="item.type">
+                  <span style="float: left">{{ item.type }}</span>
+                </el-option>
+              </el-select></el-col
+            >
+          </el-form-item>
+          <el-form-item label="名     称">
+            <el-col class="title"> <el-input v-model="form.name" placeholder="请输入名称"></el-input></el-col>
+          </el-form-item>
+          <el-form-item label="类     型">
+            <el-col class="Bg">
+              <el-select v-model="value" placeholder="请选择" size="medium">
+                <el-option v-for="item in cities" :key="item.leixing" :value="item.leixing">
+                  <span style="float: left">{{ item.leixing }}</span>
+                </el-option>
+              </el-select></el-col
+            >
+          </el-form-item>
+          <el-form-item label="应用领域">
+            <el-col class="title"> <el-input v-model="form.lingyu" placeholder=""></el-input></el-col>
+          </el-form-item>
+
+          <el-form-item label="服务范围">
+            <el-col class="fanwei">
+              <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 3 }" placeholder="请输入内容" v-model="textarea"> </el-input
+            ></el-col>
+          </el-form-item>
+          <el-col :span="12">
+            <el-form-item label="单价">
+              <el-input v-model="form.price" placeholder=""></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="单位">
+              <el-select v-model="value" placeholder="请选择" size="medium">
+                <el-option v-for="item in cities" :key="item.danwei" :value="item.danwei">
+                  <span style="float: left">{{ item.danwei }}</span>
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="交易方式">
+              <el-radio v-model="radio" label="1">转让</el-radio>
+              <el-radio v-model="radio" label="2">公用</el-radio>
+              <el-radio v-model="radio" label="3">竞价</el-radio>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="简介">
+              <el-col class="jianjie">
+                <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 3 }" placeholder="请输入内容" v-model="textarea"> </el-input
+              ></el-col>
+            </el-form-item>
+          </el-col>
+          <el-col :soan="24" class="anniu">
+            <el-form-item>
+              <el-button type="primary" @click="onSubmit">提交</el-button>
+            </el-form-item>
+          </el-col>
+        </el-form>
+      </el-tab-pane>
+      <el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'xiuqiuright',
+  props: {},
+  components: {},
+  data: () => ({
+    form: {
+      name: '',
+      person: '',
+      delivery: false,
+      money: '',
+      tel: '',
+      price: '',
+      lingyu: '',
+      // type: [],
+      // resource: '',
+      // desc: '',
+    },
+    dialogImageUrl: '',
+    dialogVisible: false,
+    activeName: 'first',
+    textarea: '',
+    cities: [
+      {
+        danwei: '公斤',
+        value: '餐饮',
+        type: '服务',
+        leixing: '金属制炼',
+      },
+      {
+        value: '零食',
+        type: '产品',
+        danwei: '件',
+      },
+      {
+        danwei: '套',
+        type: '技术',
+      },
+    ],
+    value: '',
+    input: '',
+    radio: '1',
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    onSubmit() {
+      console.log('submit!');
+    },
+    handleRemove(file, fileList) {
+      console.log(file, fileList);
+    },
+    handlePictureCardPreview(file) {
+      this.dialogImageUrl = file.url;
+      this.dialogVisible = true;
+    },
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+/deep/.el-tabs--card > .el-tabs__header {
+  border-bottom: 1px solid #215299;
+}
+/deep/.el-tabs__item.is-active {
+  color: #ffffff;
+  background-color: #215299;
+}
+/deep/.el-tabs--card > .el-tabs__header .el-tabs__nav {
+  border: none;
+  border-bottom: none;
+}
+
+/deep/.el-tabs--card > .el-tabs__header .el-tabs__item {
+  border-bottom: none;
+  border-left: none;
+}
+/deep/.el-tabs__item:hover {
+  cursor: pointer;
+}
+
+/deep/.el-tabs__item {
+  color: #888;
+  height: 60px;
+  font-size: 18px;
+  line-height: 60px;
+}
+
+/deep/.el-form-item__label {
+  text-align: right;
+  vertical-align: middle;
+  float: left;
+  font-size: 16px;
+  color: #606266;
+  line-height: 40px;
+  padding: 0 9px 0 0;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+.title {
+  width: 300px;
+}
+
+.Bg {
+  width: 300px;
+  height: 40px;
+  float: left;
+}
+/deep/.el-input--medium .el-input__inner {
+  height: 36px;
+  line-height: 36px;
+  width: 300px;
+}
+/deep/.el-input__inner {
+  border-radius: 0px;
+}
+
+.image_1 {
+  margin: 25px 0 0 10px;
+  margin-bottom: 30px;
+  font-size: 18px;
+}
+
+/deep/.el-upload--picture-card {
+  border-radius: 0px;
+
+  width: 100px;
+  height: 100px;
+  line-height: 100px;
+}
+.max {
+  margin: 0 0 20px 80px;
+  color: #888;
+}
+.jianjie {
+  margin: 0 0 0 0;
+  font-size: 18px;
+  width: 700px;
+}
+.fanwei {
+  width: 700px;
+  font-size: 18px;
+}
+
+/deep/.el-textarea__inner {
+  height: 100px !important;
+}
+
+.anniu {
+  margin: 40px 0 0 0;
+  text-align: center;
+}
+
+.danwei {
+  float: left;
+  width: 100px;
+}
+</style>

src/router/index.js

@@ -128,6 +128,19 @@ const routes = [
     name: 'svstemreview',
     component: () => import('../views/svstem/svstemreview.vue'),
   },
+  //个人中心-我的订购
+  {
+    path: '/svstem/svstemorder',
+    name: 'svstemorder',
+    component: () => import('../views/svstem/svstemorder.vue'),
+  },
+  //个人中心-我要发布
+
+  {
+    path: '/svstem/svstemrelease',
+    name: 'svstemrelease',
+    component: () => import('../views/svstem/svstemrelease.vue'),
+  },
 ];
 
 const router = new VueRouter({

src/views/svstem/svstemorder.vue

@@ -0,0 +1,72 @@
+<template>
+  <div id="svstemorder">
+    <svstemorder-detail :info="info" :dinggouList="dinggouList" :diaochatitle="diaochatitle"></svstemorder-detail>
+  </div>
+</template>
+
+<script>
+import svstemorderDetail from '@/components/svstem/svstemorder.vue';
+export default {
+  name: 'svstemorder',
+  props: {},
+  components: {
+    svstemorderDetail,
+  },
+  data: () => ({
+    info: {
+      logo: require('@/assets/logo.png'),
+      banquan: '版权所有：吉林省计算中心',
+      jishu: '技术支持：长春市福瑞科技有限公司',
+      youbian: '邮编：130000',
+      chuanzhen: '传真：239823982',
+      address: '地址：吉林省长春市朝阳区前进大街1244号',
+      phone: '电话：0431-1234567',
+      email: '邮箱：123456@163.com',
+    },
+
+    diaochatitle: [
+      {
+        context: '您是否愿意继续关注本平台',
+      },
+      {
+        context: '您是否愿意继续关注本平台',
+      },
+      {
+        context: '您是否愿意继续关注本平台',
+      },
+    ],
+
+    dinggouList: [
+      {
+        id: '001',
+        date: '2018-01-04',
+        type: '产品',
+        name: '机器',
+        maoney: '1000',
+        pic: require('@/assets/getImage.jpg'),
+      },
+      {
+        id: '001',
+        date: '2018-01-04',
+        type: '产品',
+        name: '机器',
+        maoney: '1000',
+        pic: require('@/assets/getImage.jpg'),
+      },
+      {
+        id: '001',
+        date: '2018-01-04',
+        type: '产品',
+        name: '机器',
+        maoney: '1000',
+        pic: require('@/assets/getImage.jpg'),
+      },
+    ],
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped></style>

src/views/svstem/svstemrelease.vue

@@ -0,0 +1,33 @@
+<template>
+  <div id="svstemrelease">
+    <svstemrelease-detail :info="info"></svstemrelease-detail>
+  </div>
+</template>
+
+<script>
+import svstemreleaseDetail from '@/components/svstem/svstemrelease.vue';
+export default {
+  name: 'svstemorder',
+  props: {},
+  components: {
+    svstemreleaseDetail,
+  },
+  data: () => ({
+    info: {
+      logo: require('@/assets/logo.png'),
+      banquan: '版权所有：吉林省计算中心',
+      jishu: '技术支持：长春市福瑞科技有限公司',
+      youbian: '邮编：130000',
+      chuanzhen: '传真：239823982',
+      address: '地址：吉林省长春市朝阳区前进大街1244号',
+      phone: '电话：0431-1234567',
+      email: '邮箱：123456@163.com',
+    },
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped></style>