添加互联企业代码基础结构

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

@@ -0,0 +1,37 @@
+<template>
+  <div class="card-header">
+    <div v-if="hasLeft">
+      <slot name="left" />
+    </div>
+    <div class="title">
+      <slot name="title" />
+    </div>
+    <div>
+      <slot name="right" />
+    </div>
+  </div>
+</template>
+
+
+<script>
+export default {
+  data() {
+    return {
+      hasLeft: false,
+    }
+  },
+  mounted() {
+    this.hasLeft = !!this.$slots.left;
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  .title {
+    color: red;
+  }
+}
+</style>

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

@@ -0,0 +1,83 @@
+<template>
+  <div class="relation_company_info">
+    <div class="mlr-20">
+    <card-header>
+      <template v-slot:left>
+        left
+      </template>
+      <template #title>
+        标题组件
+      </template>
+      <template #right>
+        right
+      </template>
+    </card-header>
+  </div>
+  <div>
+    <div class="border-line"></div>
+  </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>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import CardHeader from './card-header';
+export default {
+  props: {
+    /**
+     * 企业关联关系对象:
+     * {
+     *  // 申请发起方
+     *  sendCompanyId,
+     *  sendCompanyName,
+     *  // 申请接收方
+     *  acceptCompanyId,
+     *  acceptCompanyName,
+     *  // 申请状态
+     *  // -1: 未申请 （前端自用）
+     *  //  0: 申请中
+     *  //  1: 申请通过
+     *  //  2: 申请驳回
+     *  auditStatus,
+     *  // 互链状态
+     *  //  0: 已解除
+     *  //  1: 关联中
+     *  //  2: 已暂停
+     *  linkStatus,
+     * }
+     * 
+     */
+    relationInfo: {
+      type: Object,
+      default: () => ({}),
+    }
+  },
+  components: {
+    CardHeader,
+  },
+  data(){
+    const mainCompanyId = this.$store.state.currentCompanyId;
+    return {
+      mainCompanyId,
+      companyData: {},
+    }
+  },
+  computed: {
+    
+  },
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>

src/views/manage_company/user/relation_company.vue

@@ -0,0 +1,134 @@
+<template>
+  <div>
+    <div class="layout_content">
+      <section class="title_section">
+        <div class="EC_col_8">
+          <slot name="nav" />
+        </div>
+      </section>
+      <section class="yiyun_section houtai">
+        <div class="fl_navBox">
+          <div class="fl_navBox_body">
+            <div class="admin_treeBox navtree">
+              <div class="tree_list">
+
+                <div class="tree_list_item">
+                  <i class="el-icon-models" />
+                  <span class="tree_list_item_label">企业名称</span>
+                </div>
+                <div class="tree_list_empty">
+                  暂无互链企业，请添加
+                </div>
+              </div>
+              <div class="bottombtn tree_list_bottom_button">添加互链企业</div>
+              <!-- <div class="navtreebox fulltreebox list-company-dept"> -->
+                <!-- 树形导航 -->
+              <!-- </div> -->
+            </div>
+          </div>
+        </div>
+        <div class="fl_contentBox dept-personnel-list">
+          <div class="admin_contentBox_body">
+            <div class="admin_contentBox_bodyPain">
+              <relation-company-info
+
+              />
+            </div>
+          </div>
+        </div>
+      </section>
+    </div>
+
+    <div class="ec_dialog" v-if="false">
+      <div class="ec_dialogBox">
+        <div class="ec_dialogBoxHead">
+          <h3 class="ec_dialogBoxHeadTitle fl">设置职员所在部门</h3>
+          <i
+            title="关闭"
+            class="Cicon icon font_family icon-icon_quxiaohuoguanbi ec_dialogBoxHeadclose fr"
+            @click="colseSet"
+          ></i>
+        </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>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+import RelationCompanyInfo from './components/relation_company_info';
+
+export default {
+  components: {
+    RelationCompanyInfo,
+  },
+  data() {
+    return {
+    };
+  },
+  filters: {
+  },
+  mounted: function () {
+  },
+  methods: {
+  },
+};
+</script>
+
+<style>
+  .list-company-dept .el-tree-node__content {
+    margin: 0 10px 0 0;
+  }
+</style>
+
+<style lang="less" scoped>
+.tree_list {
+  height: calc(100% - 56px);
+  padding: 10px 3% 0;
+  overflow: auto;
+}
+.tree_list_item {
+  position: relative;
+  height: 32px;
+  padding-left: 16px + 8px;
+  border-radius: 5px;
+  cursor: pointer;
+  &:hover, .active {
+    background-color: rgba(255, 255, 255, 0.2);
+  }
+  &_label {
+    color: #fff;
+    font-size: 12px;
+    line-height: 32px;
+  }
+  .el-icon-models {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    margin: auto;
+    transform: translateY(-2px);
+  }
+}
+.tree_list_empty {
+  margin-top: 350px;
+  text-align: center;
+  color: #fff;
+}
+.tree_list_bottom_button {
+  
+}
+</style>