更新

src/views/Training/AnnualInspection/components/pxgs.vue

@@ -0,0 +1,55 @@
+<template>
+    <div>
+        <el-dialog title="选择培训公司" v-model="dialogForm" width="400px">
+            <ul class="company-list">
+                <li :class="{'active': active == item.id}" @click="active = item.id" class="company-item one_text_detail" v-for="item in companyList" :key="item.id">{{ item.name }}</li>
+            </ul>
+            <div class="flex just-center mt10">
+                <el-button  type="primary" @click="dialogForm = false">确定</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup>
+import { ref ,defineExpose} from 'vue';
+const dialogForm = ref(false);
+const companyList = ref([
+    { id: 1, name: '公司A' },
+    { id: 2, name: '公司B' },
+    { id: 3, name: '公司C' },
+]);
+
+const active = ref(null)
+
+const init = (id) => {
+    active.value = id;
+    dialogForm.value = true;
+}
+
+defineExpose({
+    init
+})
+</script>
+
+<style scoped lang="scss">
+.company-list {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+    max-height: 40vh;
+    overflow: hidden;
+    overflow-y: auto;
+    .company-item {
+        padding: 10px;
+        cursor: pointer;
+        line-height: 20px;
+        text-align: center;
+        border-bottom: 1px solid #eee;
+    }
+    .active{
+        background: #00bfbf;
+        color: #fff;
+    }
+}
+</style>