Revert "Revert "添加""

This reverts commit 1881f89d82caf32c76334fd19bedbc700da656a8.

README-zh.md

@@ -70,6 +70,15 @@ npm run preview -- --report
 
 ```
 
+## 组件
+组件使用的文件统一放到：src/components 目录下，首字母大写
+
+Upload -- 目前只实现了图片上传
+QrCode -- 生成二维码弹窗
+Editor -- 富文本编辑器（如果要用到上传视屏，则需要在处理一下）
+Tooltip --
+
+
 ## 注意事项
 
 ```bash

src/components/QrCode/index.vue

@@ -0,0 +1,86 @@
+
+<template>
+    <div class="qrCode">
+        <el-dialog :title="title"
+               :visible.sync="status"
+               @close="onDialogClose"
+               width="300px">
+            <div class="left-code">
+                <vue-qr :text="codeUrl" style="width: 100%" :margin="0"></vue-qr>
+                <p class="code-url" v-if="codeUrl">{{ codeUrl }} <el-link @click="copyUrl(codeUrl)" class="link-btn" type="primary">复制</el-link></p>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import VueQr from 'vue-qr'
+import copy from 'copy-to-clipboard'
+export default {
+    data() {
+        return {
+            status: false
+        };
+    },
+    components: {
+        VueQr
+    },
+    props: {
+        value: {
+            // 组件状态
+            type: Boolean,
+            required: true,
+            default() {
+                return false
+            }
+        },
+        title: {
+            type: String,
+            default() {
+                return '查看二维码'
+            }
+        },
+        codeUrl: {
+            type: String
+        }
+    },
+    mounted() {
+        this.status = this.value
+    },
+    methods: {
+        onDialogClose() {
+            this.status = false
+            this.$emit('input', false)
+        },
+        copyUrl(url) {
+            copy(url)
+            this.$message.success('复制成功')
+        },
+    },
+    watch: {
+        value(newValue) {
+            this.status = newValue;
+        },
+        title(newValue, oldValue) {
+            if(newValue != oldValue) {
+                this.title = newValue
+            }
+        }
+    },
+    beforeDestroy() {},
+};
+</script>
+
+<style lang="scss">
+.left-code{
+    .code-url{
+        margin-top: 10px;
+        margin-bottom: 10px;
+        .link-btn{
+            margin-top: 0;
+            margin-bottom: 0;
+            font-size: 12px;
+        }
+    }
+}
+</style>