1

src/App.vue

@@ -42,4 +42,8 @@ body {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+p {
+  padding: 0;
+  margin: 0;
+}
 </style>

src/components/supermaket/supermarketlistDetail.vue

@@ -18,7 +18,7 @@
         <div class="w_1200">
           <el-col :span="24" class="rightcont">
             <listcontext v-on="$listeners" :contentList="contentList" :columnName="columnName" v-if="display === 'list'" :total="total"></listcontext>
-            <detali v-else :policyInfo="policyInfo" v-on="$listeners"> </detali>
+            <detali v-else :detailInfo="policyInfo" v-on="$listeners"> </detali>
           </el-col>
         </div>
       </el-col>

src/layout/supermarket/detali.vue

@@ -2,82 +2,144 @@
   <div id="policyrightcont">
     <el-row>
       <el-col :span="24" class="info">
-        <el-col :span="24" class="infoTop">
-          <span>详情页面</span>
+        <el-col :span="24" class="top">
+          <el-col :span="12" class="txt">
+            <span>详情页面</span>
+          </el-col>
+          <el-col :span="12" class="btn">
+            <el-button type="primary" size="mini" @click="back()">返回</el-button>
+          </el-col>
         </el-col>
         <el-col :span="24" class="infoMiddle">
-          <el-col :span="8" class="infoImage">
-            <el-carousel trigger="click" height="400px">
-              <template v-if="policyInfo.image && policyInfo.image.length > 0">
-                <el-carousel-item v-for="(item, index) in policyInfo.image" :key="index">
-                  <el-image :src="item.url"> </el-image>
+          <el-col :span="24" class="infotop">
+            <el-col :span="7" class="left">
+              <el-carousel trigger="click" height="345px" :autoplay="false">
+                <el-carousel-item v-for="(item, index) in detailInfo.image" :key="index">
+                  <el-image :src="item.url" style="width:99%;height:345px;border: 1px solid #ccc;"></el-image>
                 </el-carousel-item>
-              </template>
-              <template v-if="policyInfo.image && policyInfo.image.length == 0"><h1 style="text-align:center;line-height:370px;">暂无图片</h1></template>
-            </el-carousel>
+              </el-carousel>
+            </el-col>
+            <el-col :span="17" class="right">
+              <el-col :span="24" class="name textOver">
+                {{ detailInfo.name || '暂无' }}
+              </el-col>
+              <el-col :span="24">
+                <el-col :span="4" class="otherInfo textOver">
+                  需求方
+                </el-col>
+                <el-col :span="20" class="otherInfo textOver">
+                  {{ detailInfo.company }}
+                  <el-link v-if="detailInfo.companyweb != null || ''" :href="detailInfo.companyweb" :underline="false" target="_blank"
+                    >({{ detailInfo.companyweb }})</el-link
+                  >
+                </el-col>
+              </el-col>
+              <el-col :span="24">
+                <el-col :span="4" class="otherInfo textOver">
+                  所属领域
+                </el-col>
+                <el-col :span="20" class="otherInfo textOver">
+                  {{ detailInfo.degreeurgency || '暂无' }}
+                </el-col>
+              </el-col>
+
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  注册类型
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver"> {{ detailInfo.companytype || '暂无' }} </el-col>
+              </el-col>
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  注册时间
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver"> {{ detailInfo.companydate || '暂无' }} </el-col>
+              </el-col>
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  注册资金
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver"> {{ detailInfo.companycapital || '暂无' }}</el-col>
+              </el-col>
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  投资预算
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver"> {{ detailInfo.budget || '暂无' }}万元 </el-col>
+              </el-col>
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  紧急程度
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver"> {{ detailInfo.degreeurgency || '暂无' }} </el-col>
+              </el-col>
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  合作方式
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver">
+                  {{ detailInfo.cooperation || '暂无' }}
+                </el-col>
+              </el-col>
+              <el-col :span="24">
+                <el-col :span="4" class="otherInfo textOver">
+                  机构代码
+                </el-col>
+                <el-col :span="20" class="otherInfo textOver"> {{ detailInfo.zzjgdm || '暂无' }} </el-col>
+              </el-col>
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  联系人
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver">
+                  {{ detailInfo.contacts || '暂无' }}
+                </el-col>
+              </el-col>
+              <el-col :span="12">
+                <el-col :span="8" class="otherInfo textOver">
+                  电子邮箱
+                </el-col>
+                <el-col :span="16" class="otherInfo textOver">
+                  {{ detailInfo.email || '暂无' }}
+                </el-col>
+              </el-col>
+            </el-col>
           </el-col>
-          <el-col :span="14" class="infoRight">
-            <p>{{ policyInfo.name }}</p>
-            <p class="infoType">
-              <span>总分类：</span
-              ><span>{{ policyInfo.totaltype === '0' ? '技术' : policyInfo.totaltype === '1' ? '产品' : policyInfo.totaltype === '2' ? '服务' : '暂无' }}</span>
-              <span>类型名称：</span>
-              <span>{{ policyInfo.product_type_name }}</span>
-            </p>
-            <p class="infoPrice">
-              <span>收费标准：</span><span>{{ policyInfo.price }}元/</span><span>{{ policyInfo.priceunit }}</span>
-            </p>
-            <p class="infoStatus">
-              <span>交易方式：</span
-              ><span>{{ policyInfo.business === '0' ? '公用' : policyInfo.business === '1' ? '转让' : policyInfo.business === '2' ? '竞价' : '暂无' }}</span
-              ><span>状态：</span
-              ><span>{{
-                policyInfo.status === '0' ? '待审核' : policyInfo.status === '1' ? '通过审核' : policyInfo.status === '2' ? '审核拒绝' : '暂无'
-              }}</span>
-            </p>
-            <p class="infoStatus">
-              <span>研发阶段：</span><span>{{ policyInfo.phase === '0' ? '阶段成果' : policyInfo.phase === '1' ? '最终成果' : '暂无' }}</span
-              ><span>供/需：</span
-              ><span>{{ policyInfo.business === '0' ? '公用' : policyInfo.business === '1' ? '供' : policyInfo.business === '2' ? '需' : '暂无' }}</span>
-            </p>
-            <p class="infoType">
-              <span>联系人：</span><span>{{ policyInfo.contact_user }}</span
-              ><span>联系电话：</span><span>{{ policyInfo.contact_tel }}</span>
-            </p>
+          <el-col :span="24" class="down">
+            <el-col :span="24" class="downInfo">
+              <el-col :span="4" class="tit">
+                <h2>需求说明</h2>
+              </el-col>
+              <el-col :span="20" class="info">
+                {{ detailInfo.requirementdesc || '暂无' }}
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="downInfo">
+              <el-col :span="4" class="tit">
+                <h2>预期目标</h2>
+              </el-col>
+              <el-col :span="20" class="info">
+                {{ detailInfo.expect || '暂无' }}
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="downInfo">
+              <el-col :span="4" class="tit">
+                <h2>需求现状</h2>
+              </el-col>
+              <el-col :span="20" class="info">
+                {{ detailInfo.present || '暂无' }}
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="downInfo">
+              <el-col :span="4" class="tit">
+                <h2>合作要求</h2>
+              </el-col>
+              <el-col :span="20" class="info">
+                {{ detailInfo.condition || '暂无' }}
+              </el-col>
+            </el-col>
           </el-col>
         </el-col>
-        <el-col :span="24" class="infoDown">
-          <el-form label-width="150px">
-            <el-form-item label="应用领域：">
-              <span>{{ policyInfo.field }}</span>
-            </el-form-item>
-            <el-form-item label="市场前景：">
-              <span>{{ policyInfo.prospect }}</span>
-            </el-form-item>
-            <el-form-item label="电子合同：">
-              <span>{{ policyInfo.contract }}</span>
-            </el-form-item>
-            <el-form-item label="服务范围：">
-              <span>{{ policyInfo.scope }}</span>
-            </el-form-item>
-            <el-form-item label="描述：">
-              <span>{{ policyInfo.description }}</span>
-            </el-form-item>
-            <el-form-item label="知识产权：">
-              <span>{{ policyInfo.property }}</span>
-            </el-form-item>
-            <el-form-item label="简介：">
-              <span>{{ policyInfo.introduction }}</span>
-            </el-form-item>
-            <el-form-item label="产品参数：">
-              <el-table :data="policyInfo.product_args" border style="width: 800px">
-                <el-table-column prop="arg_name" label="参数名称"> </el-table-column>
-                <el-table-column prop="memo" label="参数内容"> </el-table-column>
-              </el-table>
-            </el-form-item>
-          </el-form>
-        </el-col>
-        <el-col :span="4" class="infoButton"> <el-button @click="onSubmit">立即创建</el-button></el-col>
       </el-col>
     </el-row>
   </div>
@@ -86,123 +148,79 @@
 <script>
 export default {
   name: 'policyrightcont',
-  props: { policyInfo: { type: Object, required: true, default: () => {} } },
+  props: { detailInfo: { type: Object, required: true, default: () => {} } },
   components: {},
   data: () => ({}),
   created() {},
   computed: {},
   methods: {
-    onSubmit() {
-      console.log(this.policyInfo);
-      this.$emit('onSubmit', this.policyInfo);
+    back() {
+      history.back(-1);
     },
   },
 };
 </script>
 
 <style lang="less" scoped>
-p {
-  padding: 0;
-  margin: 0;
-}
-.infoTop {
-  height: 60px;
-  border-bottom: 1px solid #22529a;
-}
-.infoTop span:only-child {
-  width: 15%;
+.top {
   height: 60px;
-  background-color: #22529a;
-  color: #fff;
-  text-align: center;
   line-height: 60px;
-  font-size: 20px;
-  display: block;
+  border-bottom: 1px solid #215299;
+  .txt {
+    span {
+      display: inline-block;
+      padding: 0 30px;
+      background-color: #215299;
+      color: #fff;
+    }
+  }
+  .btn {
+    text-align: right;
+    padding: 0 10px;
+  }
 }
 .infoMiddle {
-  margin: 20px;
-  padding-bottom: 20px;
-  border-bottom: 1px dashed #ccc;
-}
-.infoImage {
-  width: 40%;
-}
-.infoImage .el-image {
-  width: 100%;
-  height: 100%;
-}
-.infoRight {
-  float: right;
-  font-family: 微软雅黑;
-  color: rgba(1, 1, 1, 0.7);
-}
-.infoRight p:first-child {
-  font-size: 25px;
-  margin: 20px 0 30px 0;
-}
-.infoType {
-  font-size: 20px;
-}
-.infoType span:first-child {
-  font-weight: bolder;
-}
-.infoType span:nth-child(2) {
-  display: inline-block;
-  width: 35%;
-}
-.infoType span:nth-child(3) {
-  font-weight: bolder;
-}
-.infoPrice {
-  background-color: rgba(1, 1, 1, 0.1);
-  line-height: 60px;
-  margin: 30px 0 30px 0;
-  width: 600px;
-  padding: 0 30px;
-  font-size: 28px;
-  color: #fe0000;
-}
-.infoPrice span:first-child {
-  color: rgba(1, 1, 1, 0.7);
-  font-size: 18px;
-}
-.infoStatus {
-  margin: 30px 0 30px 0;
-}
-.infoStatus span:nth-child(2) {
-  display: inline-block;
-  width: 35%;
-}
-.infoDown {
-  margin: 10px 20px;
-}
-/deep/.el-form-item__label {
-  color: rgba(1, 1, 1, 0.7);
-  font-size: 18px;
-}
-/deep/.el-form-item__content {
-  color: rgba(1, 1, 1, 0.7);
-  font-size: 18px;
-}
-/deep/.el-table th {
-  background-color: #f3f3f3;
-  color: rgba(1, 1, 1, 0.5);
-  font-size: 18px;
-  text-align: center;
-}
-/deep/.el-table td {
-  color: rgba(1, 1, 1, 0.7);
-  font-size: 18px;
-  text-align: center;
-}
-.infoButton {
-  margin: 20px auto;
-  float: none;
-}
-/deep/.el-button {
-  width: 100px;
-  background-color: #22529a;
-  border-radius: 0;
-  color: white;
+  padding: 10px 15px;
+  .infotop {
+    height: 360px;
+    overflow: hidden;
+    .right {
+      padding: 0 0 0 10px;
+      .name {
+        font-size: 18px;
+        font-weight: bold;
+        padding: 10px;
+        border: 1px solid #ccc;
+      }
+      .otherInfo {
+        padding: 10px;
+        font-size: 16px;
+        border: 1px solid #ccc;
+      }
+    }
+  }
+  .down {
+    margin: 0 0 15px 0;
+    .downInfo {
+      border: 1px solid #ccc;
+      .tit {
+        // height: 150px;
+        line-height: 150px;
+        text-align: center;
+        border-right: 1px solid #ccc;
+      }
+      .info {
+        font-size: 16px;
+        padding: 10px;
+        min-height: 150px;
+      }
+    }
+  }
+  .anniu {
+    text-align: center;
+    /deep/.el-button {
+      margin: 0 10px;
+    }
+  }
 }
 </style>