能效诊断

src/views/facilityManage/common-vue/radio.vue

@@ -0,0 +1,75 @@
+<template>
+    <div class="btn">
+        <div class="btn-click" @click="handelClickOk(item)">
+            <div :class="item.color ? 'round-out yes-out' : 'round-out no-out'">
+                <div :class="item.color ? 'round-in yes-in' : 'round-in no-in'"></div>
+            </div>
+            <span>是</span>
+        </div>
+        <div class="btn-click" @click="handelClickNo(item, index)">
+            <div :class="item.color ? 'round-out no-out' : 'round-out yes-out'">
+                <div :class="item.color ? 'round-in no-in' : 'round-in yes-in'"></div>
+            </div>
+            <span>否</span>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        item: {
+            type: Object,
+            default: () => {},
+        },
+        index: {
+            type: Number,
+            default: () => {},
+        },
+    },
+    methods: {
+        handelClickOk(ele) {
+            this.$emit('handelClickOk', ele)
+        },
+        handelClickNo(ele, i) {
+            this.$emit('handelClickNo', ele, i)
+        },
+    },
+}
+</script>
+<style lang='less' scoped>
+.btn {
+    margin-top: 10px;
+    display: flex;
+    justify-content: flex-end;
+    .btn-click {
+        display: flex;
+        font-size: 15px;
+        align-items: center;
+    }
+    .round-out {
+        width: 12px;
+        height: 12px;
+        border-radius: 50%;
+        margin: 0 7px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        overflow: hidden;
+        .round-in {
+            width: 8px;
+            height: 8px;
+            border-radius: 50%;
+        }
+    }
+    .yes-out {
+        border: 2.5px solid #34baae;
+        .yes-in {
+            background: #34baae;
+        }
+    }
+    .no-out {
+        border: 2px solid #b3b3b3;
+    }
+}
+</style>