From 75852d62558dd82f91ff9a781a9a8c6f9af0c113 Mon Sep 17 00:00:00 2001
From: wlikett <2331964395@qq.com>
Date: Thu, 30 Nov 2023 18:38:05 +0800
Subject: [PATCH] qiyerzhengbufengdaim

---
 src/components/uploadImg/index.vue          |  80 +++++++
 src/router/index.js                         |   6 +-
 src/views/enterprisecertification/index.vue | 220 ++++++++++++++++++++
 3 files changed, 303 insertions(+), 3 deletions(-)
 create mode 100644 src/components/uploadImg/index.vue
 create mode 100644 src/views/enterprisecertification/index.vue

diff --git a/src/components/uploadImg/index.vue b/src/components/uploadImg/index.vue
new file mode 100644
index 0000000..727d7a0
--- /dev/null
+++ b/src/components/uploadImg/index.vue
@@ -0,0 +1,80 @@
+<template>
+    <div class="uploadImg" :style="`width:${width}px;height:${width}px`">
+      <el-upload
+        :disabled="disable"
+        class="avatar-uploader"
+        action="#"
+        :show-file-list="false"
+        :on-change="handleAvatarSuccess">
+        <img v-if="imageUrl" :src="imageUrl" @click="clickImg" class="avatar">
+        <i v-else class="el-icon-plus avatar-uploader-icon" :style="`line-height: ${width}px`"></i>
+      </el-upload>
+    </div>
+</template>
+
+<script>
+export default {
+  name: "uploadImg",
+  data() {
+    return {
+      imageUrl:'',
+      file:null
+    }
+  },
+  props:{
+    disable:{
+      type:Boolean,
+      default:() => false
+    },
+
+    width:{
+      type:String | Number,
+      default:() => '50'
+    }
+  },
+  methods: {
+    handleAvatarSuccess(file,fileList){
+      this.imageUrl = URL.createObjectURL(file.raw)
+      this.file = file
+    },
+    clickImg(){
+      if(!this.disable){
+        this.$emit('onClick',{
+          ...this.file,
+          baseUrl:this.imageUrl
+        })
+      }
+    }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.uploadImg{
+    ::v-deep .avatar-uploader{
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border: 1px solid #dfdfdf;
+      overflow: hidden;
+      .el-upload--text{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 100%;
+        height: 100%;
+        .avatar-uploader-icon{
+          width: 100%;
+          height: 100%;
+        }
+      }
+      .avatar{
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+    }
+}
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index 19b0820..55e32be 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -132,9 +132,9 @@ export const constantRoutes = [
         ]
       },
       {
-        path: 'enterprise',
-        component: () => import('@/views/index'),
-        name: 'enterprise',
+        path: 'enterprisecertification',
+        component: () => import('@/views/enterprisecertification'),
+        name: 'enterprisecertification',
         meta: { title: '企业信息', icon: 'dashboard', affix: false },
 
       },
diff --git a/src/views/enterprisecertification/index.vue b/src/views/enterprisecertification/index.vue
new file mode 100644
index 0000000..ee495d0
--- /dev/null
+++ b/src/views/enterprisecertification/index.vue
@@ -0,0 +1,220 @@
+<template>
+  <div class="enterpriseCertification">
+    <div class="baseInfo card">
+      <div class="top">
+        <div class="title">
+          企业基本信息
+        </div>
+        <div class="options">
+          <el-button size="mini" type="primary">我的邀请码</el-button>
+          <el-button size="mini" type="primary">编辑</el-button>
+        </div>
+      </div>
+      <el-form class="baseForm">
+        <el-row :gutter="20">
+          <el-col :span="6">
+            <el-form-item label="企业名称">
+              <el-input placeholder=""></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="7">
+            <el-form-item label="统一社会信用代码">
+              <el-input placeholder=""></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="注册地址">
+          <el-row :gutter="10">
+            <el-col :span="3">
+              <el-select v-model="value" placeholder="请选择省份">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="3">
+              <el-select v-model="value" placeholder="请选择市">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="3">
+              <el-select v-model="value" placeholder="请选择区">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="15">
+              <el-input placeholder="请输入实际办公地址"></el-input>
+            </el-col>
+          </el-row>
+
+        </el-form-item>
+
+        <el-form-item label="经营地址">
+          <el-row :gutter="10">
+            <el-col :span="3">
+              <el-select v-model="value" placeholder="请选择省份">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="3">
+              <el-select v-model="value" placeholder="请选择市">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="3">
+              <el-select v-model="value" placeholder="请选择区">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="15">
+              <el-input placeholder="请输入实际办公地址"></el-input>
+            </el-col>
+          </el-row>
+
+        </el-form-item>
+
+        <el-row :gutter="20">
+            <el-col :span="5">
+                <el-form-item label="法人证件类型">
+                  <el-select v-model="value" placeholder="请选择省份">
+                    <el-option
+                      v-for="item in options"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+            </el-col>
+
+            <el-col :span="7">
+                <el-form-item label="法人证件号码">
+                    <el-input></el-input>
+                </el-form-item>
+            </el-col>
+
+            <el-col :span="6">
+                <el-form-item class="" label="营业执照">
+                  <upload-img width="80" @onClick="test" />
+
+                </el-form-item>
+
+            </el-col>
+        </el-row>
+      </el-form>
+    </div>
+  </div>
+
+</template>
+
+<script>
+import uploadImg from "@/components/uploadImg/index.vue";
+export default {
+  data() {
+    return {
+      options: [{
+        value: '选项1',
+        label: '黄金糕'
+      }, {
+        value: '选项2',
+        label: '双皮奶'
+      }, {
+        value: '选项3',
+        label: '蚵仔煎'
+      }, {
+        value: '选项4',
+        label: '龙须面'
+      }, {
+        value: '选项5',
+        label: '北京烤鸭'
+      }],
+      value: '',
+
+      imageUrl: ''
+    }
+  },
+  components:{uploadImg},
+  methods: {
+    handleAvatarSuccess(res, file) {
+      this.imageUrl = URL.createObjectURL(res.raw);
+    },
+    test(arg){
+      console.log(arg)
+    }
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.d-flex{
+  display: flex;
+  align-items: center;
+}
+::v-deep.el-form-item {
+  display: flex;
+
+  .el-form-item__content {
+    flex: 1;
+  }
+}
+
+.enterpriseCertification {
+  height: 100%;
+  background: #f2f2f2;
+  padding: 15px 10px;
+
+  .card {
+    border-radius: 5px;
+    background: white;
+    padding: 10px;
+  }
+
+  .top {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 10px;
+
+    .title {
+      font-size: 16px;
+      font-weight: 600;
+    }
+
+    .options {
+
+    }
+  }
+
+  .baseForm {
+    padding: 0 10px;
+  }
+}
+</style>