parameters.vue
1.28 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<template>
<section class="parameter-card">
<el-radio-group v-model="selecteditem" @change="handleChange">
<div class="radio-item" v-for="item in items" :key="item.key">
<el-radio :label="item.key" :v-text="item.key" />
</div>
</el-radio-group>
</section>
</template>
<script setup>
import { useParametersStore } from '@/views/stores/applications/useParametersStore';
import { storeToRefs } from 'pinia';
const store = useParametersStore();
const { items, handleSelect } = store;
const { selecteditem } = storeToRefs(store);
const handleChange = (key) => {
handleSelect(key);
};
</script>
<style lang="less" scope>
.parameter-card {
height: 100%;
overflow-y: auto;
overflow-x: hidden;
padding: 0 4px;
font-weight: 300;
.radio-item {
width: 180px;
height: 28px;
border-radius: 4px;
&:hover {
background-color: @main-modellist-selected-color;
cursor: pointer;
}
}
.el-radio__input.is-checked + .el-radio__label {
color: @main-color;
}
.el-radio__input.is-checked .el-radio__inner {
border-color: transparent !important;
background: @main-color !important;
}
.el-radio {
width: 100%;
}
}
</style>