uv-ui/lib/components/stepper/stepper.cjs

基于vue3的移动端组件库

"use strict";const e=require("vue"),d=require("../icon/index.cjs"),p=require("../../utils/form.cjs");require("./stepper.vue_vue_type_style_index_0_lang.cjs");const b={class:"uv-stepper"},h=["onClick"],x=["disabled","value"],y=["onClick"],g={name:"UvStepper"},N=Object.assign(g,{props:{modelValue:{type:Number},max:{type:Number},min:{type:Number,default:1},step:{type:Number,default:1},integer:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},disableInput:{type:Boolean,default:!1},inputWidth:{type:String,default:"28px"},size:{type:Number,default:28}},emits:["update:modelValue","add","sub","change"],setup(a,{emit:n}){const l=a,{props:c,validateBlurOrChange:o}=e.inject("form-item",{}),t=e.ref(l.modelValue||1);e.watch(()=>l.modelValue,i=>{t.value=i}),e.watch(t,i=>{n("update:modelValue",i),n("change",i),c&&o("change")});function r(){l.min&&t.value<=l.min||l.disabled||(t.value=t.value-l.step,n("add",t.value))}function m(){l.max&&t.value>=l.max||l.disabled||(t.value=Number(t.value+l.step),n("add",t.value))}function v(i){const{value:u}=i.target,s=p.formatNumber(String(u),!l.integer);console.log(s),i.target.value=s,t.value=Number(s)}function f(i){l.min&&t.value<=l.min?(i.target.value=l.min,t.value=Number(l.min)):l.max&&t.value>=l.max&&(i.target.value=l.max,t.value=Number(l.max))}return(i,u)=>(e.openBlock(),e.createElementBlock("div",b,[e.createElementVNode("div",{class:e.normalizeClass(["uv-stepper-minus",a.min===t.value||a.disabled?"uv-stepper-disabled":""]),style:e.normalizeStyle({width:a.size+"px",height:a.size+"px"}),onClick:e.withModifiers(r,["stop"])},[e.createVNode(e.unref(d),{class:"uv-stepper-icon",size:"20",name:"minus",color:a.min===t.value||a.disabled?"#c8c9cc":"#323233"},null,8,["color"])],14,h),e.createElementVNode("div",{onClick:u[0]||(u[0]=e.withModifiers(()=>{},["stop"])),class:"uv-stepper-input",style:e.normalizeStyle({width:a.inputWidth,height:a.size+"px"})},[e.createElementVNode("input",{style:e.normalizeStyle({color:a.disabled?"#d0c9cc":"#323233"}),disabled:a.disableInput||a.disabled,onInput:v,onBlur:f,value:t.value},null,44,x)],4),e.createElementVNode("div",{class:e.normalizeClass(["uv-stepper-add",a.max===t.value||a.disabled?"uv-stepper-disabled":""]),style:e.normalizeStyle({width:a.size+"px",height:a.size+"px"}),onClick:e.withModifiers(m,["stop"])},[e.createVNode(e.unref(d),{class:"uv-stepper-icon",size:"20",name:"add",color:a.max===t.value||a.disabled?"#c8c9cc":"#323233"},null,8,["color"])],14,y)]))}});module.exports=N;