fix:打分bug修改
This commit is contained in:
@@ -779,62 +779,6 @@ export const useCommonStore = defineStore('common', {
|
|||||||
},
|
},
|
||||||
disable_option_update: null,
|
disable_option_update: null,
|
||||||
cascade: []
|
cascade: []
|
||||||
},
|
|
||||||
{
|
|
||||||
option: '<p>选项3</p>',
|
|
||||||
id: '1049108',
|
|
||||||
type: 0,
|
|
||||||
is_other: 0,
|
|
||||||
is_fixed: 0,
|
|
||||||
is_remove_other: 0,
|
|
||||||
created_at: null,
|
|
||||||
created_user_id: null,
|
|
||||||
parent_id: null,
|
|
||||||
option_index: 3,
|
|
||||||
list_id: 74455,
|
|
||||||
option_code: '',
|
|
||||||
option_config: {
|
|
||||||
title: '',
|
|
||||||
instructions: [],
|
|
||||||
price: 0.0,
|
|
||||||
gradient: '',
|
|
||||||
image_url: [],
|
|
||||||
option_type: 0,
|
|
||||||
type: 0,
|
|
||||||
limit_right_content: '',
|
|
||||||
child_area: null,
|
|
||||||
binding_goods_id: ''
|
|
||||||
},
|
|
||||||
disable_option_update: null,
|
|
||||||
cascade: []
|
|
||||||
},
|
|
||||||
{
|
|
||||||
option: '<p>选项4</p>',
|
|
||||||
id: '1049171',
|
|
||||||
type: 0,
|
|
||||||
is_other: 0,
|
|
||||||
is_fixed: 0,
|
|
||||||
is_remove_other: 0,
|
|
||||||
created_at: null,
|
|
||||||
created_user_id: null,
|
|
||||||
parent_id: null,
|
|
||||||
option_index: 4,
|
|
||||||
list_id: 74455,
|
|
||||||
option_code: '',
|
|
||||||
option_config: {
|
|
||||||
title: '',
|
|
||||||
instructions: [],
|
|
||||||
price: 0.0,
|
|
||||||
gradient: '',
|
|
||||||
image_url: [],
|
|
||||||
option_type: 0,
|
|
||||||
type: 0,
|
|
||||||
limit_right_content: '',
|
|
||||||
child_area: null,
|
|
||||||
binding_goods_id: ''
|
|
||||||
},
|
|
||||||
disable_option_update: null,
|
|
||||||
cascade: []
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -22,17 +22,7 @@
|
|||||||
class="van-field"
|
class="van-field"
|
||||||
v-html="item.option"
|
v-html="item.option"
|
||||||
></div>
|
></div>
|
||||||
<ul>
|
<RateCharacter></RateCharacter>
|
||||||
<li
|
|
||||||
v-for="(rate, rateIndex) in rateItem"
|
|
||||||
:key="rateIndex"
|
|
||||||
class="rate_item"
|
|
||||||
:class="{ active_item: rate.active }"
|
|
||||||
@click="getItem(rate)"
|
|
||||||
>
|
|
||||||
{{ rate.label }}
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -42,54 +32,11 @@
|
|||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
const rateItem = ref([
|
import RateCharacter from './RateCharacter.vue';
|
||||||
{
|
|
||||||
label: 1,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 2,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 3,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 4,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 5,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 6,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 7,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 8,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 9,
|
|
||||||
active: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 10,
|
|
||||||
active: false
|
|
||||||
}
|
|
||||||
]);
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
element: {
|
element: {
|
||||||
type: Object,
|
type: Object
|
||||||
default: () => {
|
|
||||||
// 补充
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
active: {
|
active: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
@@ -105,46 +52,16 @@ const localElement = ref({ ...props.element });
|
|||||||
|
|
||||||
const saveStem = (e) => {
|
const saveStem = (e) => {
|
||||||
localElement.value.stem = e.target.innerHTML;
|
localElement.value.stem = e.target.innerHTML;
|
||||||
// 如果需要,可以在这里发出事件以通知父组件
|
|
||||||
// this.$emit('update:element', localElement.value);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const chooseOption = (item) => {
|
const chooseOption = (item) => {
|
||||||
console.log(item);
|
console.log(item);
|
||||||
chooseId.value = item.id;
|
chooseId.value = item.id;
|
||||||
};
|
};
|
||||||
const getItem = (value) => {
|
|
||||||
chooseId.value = value.id;
|
|
||||||
rateItem.value.forEach((item, index) => {
|
|
||||||
rateItem.value[index].active = item.label <= value.label;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.content {
|
.content {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
|
||||||
ul {
|
|
||||||
// border: 1px solid red;
|
|
||||||
display: flex;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rate_item {
|
|
||||||
margin: 0 3px;
|
|
||||||
margin-top: 5px;
|
|
||||||
padding: 0 8px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-radius: 4px;
|
|
||||||
color: #666;
|
|
||||||
|
|
||||||
// border: 1px solid red;
|
|
||||||
}
|
|
||||||
|
|
||||||
.active_item {
|
|
||||||
background-color: #70b936;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
91
src/views/Design/components/Questions/RateCharacter.vue
Normal file
91
src/views/Design/components/Questions/RateCharacter.vue
Normal file
@@ -0,0 +1,91 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<ul>
|
||||||
|
<li
|
||||||
|
v-for="(rate, rateIndex) in rateItem"
|
||||||
|
:key="rateIndex"
|
||||||
|
class="rate_item"
|
||||||
|
:class="{ active_item: rate.active }"
|
||||||
|
@click="getItem(rate)"
|
||||||
|
>
|
||||||
|
{{ rate.label }}
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref } from 'vue';
|
||||||
|
const rateItem = ref([
|
||||||
|
{
|
||||||
|
label: 1,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 2,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 3,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 4,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 5,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 6,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 7,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 8,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 9,
|
||||||
|
active: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 10,
|
||||||
|
active: false
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
const getItem = (value) => {
|
||||||
|
// chooseId.value = value.id;
|
||||||
|
rateItem.value.forEach((item, index) => {
|
||||||
|
rateItem.value[index].active = item.label <= value.label;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
ul {
|
||||||
|
// border: 1px solid red;
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rate_item {
|
||||||
|
margin: 0 3px;
|
||||||
|
margin-top: 5px;
|
||||||
|
padding: 0 8px;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #666;
|
||||||
|
|
||||||
|
// border: 1px solid red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active_item {
|
||||||
|
background-color: #70b936;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user