TALL renderjs vue3版本
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

62 lines
1.5 KiB

<template>
<!-- 上传交付物 -->
<view class="px-3 py-6 bg-white">
<u-input :auto-height="autoHeight" :border="border" :height="height" :type="type" placeholder="输入备注" v-model="remark" />
<view class="flex flex-row-reverse text-xs text-gray-400 mt-2">{{ wordNum }}/140</view>
<!-- 评分 -->
<view class="flex justify-between mt-3">
<slider :value="score" @change="sliderChange" max="100" min="0" show-value style="width: 60%" />
<u-input :border="border" :type="type1" @input="changeNumber" maxlength="100" placeholder="输入分数" v-model="score" />
</view>
<view class="flex flex-col justify-center mt-5">
<u-button @click="submit" size="medium" type="primary">提交</u-button>
<u-button @click="$emit('closeScore')" class="mt-2" size="medium">取消</u-button>
</view>
</view>
</template>
<script setup>
import { reactive, watchEffect } from 'vue';
const data = reactive({
remark: '',
type: 'textarea',
border: true,
height: 100,
autoHeight: true,
wordNum: 0,
score: 0,
type1: 'number',
});
const emit = defineEmits(['submit']);
watchEffect(() => {
if(remark) {
data.wordNum = remark.value.length;
}
if(score) {
data.score1 = score.value;
}
});
// 提交交付物
function submit() {
emit('submit', this.remark, this.score);
}
function sliderChange(e) {
data.score = e.detail.value;
}
function changeNumber(e) {
if (e > 100) {
data.score = 100;
}
}
</script>
<style></style>