update

src/views/manage_company/user/components/card-header.vue

@@ -30,8 +30,10 @@ export default {
 .card-header {
   display: flex;
   justify-content: space-between;
+  height: 40px;
+  line-height: 40px;
   .title {
-    color: red;
+    font-size: 18px;
   }
 }
 </style>

src/views/manage_company/user/components/relation_company_info.vue

@@ -2,14 +2,22 @@
   <div class="relation_company_info">
     <div class="mlr-20">
     <card-header>
-      <template v-slot:left>
-        left
-      </template>
+      <!-- 未申请状态 -->
+      <template v-if="isUnApply" #left><span /></template>
       <template #title>
-        标题组件
+        {{ isUnApply
+          ? '申请互链企业'
+          : isApplying && !isMyApply
+            ? '对方邀请建立互链'
+            : '企业信息' }}
       </template>
-      <template #right>
-        right
+      <template v-if="isUnApply" #right>
+        <button
+          type="button"
+          class="EC_button shadow bt_small_20 primaryBtn"
+        >
+          发起申请
+        </button>
       </template>
     </card-header>
   </div>
@@ -18,13 +26,50 @@
   </div>
   <div class="clear"></div>
     <div class="largecontentBox">
-      <div class="mlr-10">
-        <div class="yiyunTable_list mt-10">
-          <img class="prjitem_img"  ref="projimg" :class="{'height-full': isHeightFull && !isWidthFull, 'width-full': isWidthFull && !isHeightFull}"
-                :src="companyData.showImgUrl | resolveImg" alt="" 
-            />
-          {{mainCompanyId}}
+      <div class="mlr-20">
+        <div class="company_logo">
+          <img :src="companyData.showImgUrl | resolveImg" alt="" />
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">企业简称</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">企业全称</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">地址</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">所属行业</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">法人</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">法人电话</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">单位电话</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div>
+        <div class="info_item">
+          <span class="info_item_label">企业成员</span>
+          <span class="info_item_text">{{ mainCompanyId | displayText('人') }}</span>
         </div>
+        <div class="info_item">
+          <span class="info_item_label">企业部门</span>
+          <span class="info_item_text">{{ mainCompanyId | displayText('个部门') }}</span>
+        </div>
+        <!-- <div class="info_item">
+          <span class="info_item_label">企业ID</span>
+          <span class="info_item_text">{{ mainCompanyId }}</span>
+        </div> -->
       </div>
     </div>
   </div>
@@ -32,6 +77,8 @@
 
 <script>
 import CardHeader from './card-header';
+import { isNil } from 'lodash';
+
 export default {
   props: {
     /**
@@ -59,7 +106,7 @@ export default {
      */
     relationInfo: {
       type: Object,
-      default: () => ({}),
+      default: () => ({ auditStatus: '-1' }),
     }
   },
   components: {
@@ -73,11 +120,51 @@ export default {
     }
   },
   computed: {
-    
+    isUnApply(){ return this.relationInfo.auditStatus == '-1' },
+    isApplying(){ return this.relationInfo.auditStatus == '0' },
+    // 是否为我方发起的申请
+    isMyApply() { return this.relationInfo.sendCompanyId === this.mainCompanyId }
   },
+  filters: {
+    displayText: (v, unit) => isNil(v) ? '' : `${v} ${unit}`,
+  }
 }
 </script>
 
 <style lang="less" scoped>
-
+.border-line {
+  margin: 0;
+}
+.largecontentBox {
+  margin-top: 10px;
+}
+.company_logo {
+  width: 220px;
+  height: 165px;
+  background-color: #ebebf2;
+  border-radius: 16px;
+  margin-bottom: 10px;
+}
+.info_item {
+  display: inline-block;
+  vertical-align: top;
+  width: 50%;
+  &_label, &_text {
+    display: inline-block;
+    vertical-align: top;
+    line-height: 40px;
+    text-align: left;
+    font-size: 14px;
+  }
+  &_label {
+    width: 6em;
+    color: rgba(0, 0, 0, 0.56);
+    &:after{
+      content: ':';
+    }
+  }
+  &_text {
+    color: rgba(50, 50, 60, 100);
+  }
+}
 </style>

src/views/manage_company/user/relation_company.vue

@@ -38,8 +38,8 @@
         </div>
       </section>
     </div>
-
-    <div class="ec_dialog" v-if="false">
+    
+    <div class="ec_dialog" v-if="true">
       <div class="ec_dialogBox">
         <div class="ec_dialogBoxHead">
           <h3 class="ec_dialogBoxHeadTitle fl">设置职员所在部门</h3>
@@ -51,16 +51,12 @@
         </div>
         <div class="line"></div>
         <div class="ec_dialogBoxBody">
-          <el-cascader-panel
-            :options="deptOptions"
-            :props="selectProps"
-            v-model="currentUser.arraySuper"
-          ></el-cascader-panel>
+          
         </div>
         <div class="line"></div>
         <div class="ec_dialogBoxfooter">
-          <el-button @click="cancelAddDept()">取 消</el-button>
-          <el-button @click="enterAddDept()">指派至所选部门</el-button>
+          <el-button>取 消</el-button>
+          <el-button type="primary">查 询</el-button>
         </div>
       </div>
     </div>