2 lines
3.1 KiB
JavaScript
2 lines
3.1 KiB
JavaScript
import{_ as z,i as C,o as i,c as _,a as t,b as s,w as c,q as D,F as M,j as B,s as N,p as j,r as v,d as n,v as q,x as F,u as R,g as y,t as r,e as S,y as U}from"./index-CZe38Ow-.js";import{r as $}from"./request-DftRczcY.js";const E={class:"vehicles-page"},I={class:"filter-bar"},L={class:"vehicle-list"},A=["onClick"],G={class:"vehicle-img"},H={class:"vehicle-info"},J={class:"tags"},K={class:"price-row"},O={class:"price"},Q={class:"deposit"},W={class:"vehicle-arrow"},X={__name:"Vehicles",setup(Y){const b=R(),u=v(!1),m=v([]),d=v(""),p=v(""),V=l=>{const a=l.purchasePrice||3e3;return Math.round(a/100)},f=F(()=>m.value.filter(l=>{const a=!d.value||l.batteryType===d.value,o=!p.value||l.status===p.value;return a&&o})),w=async()=>{u.value=!0;try{const l=await $.get("/vehicles");l.success&&(m.value=l.data)}catch{m.value=[{_id:"1",model:"黑骑士",color:"黑色",batteryType:"锂电池",purchasePrice:3500,status:"空闲"},{_id:"2",model:"黑骑士",color:"白色",batteryType:"锂电池",purchasePrice:3500,status:"空闲"},{_id:"3",model:"电动车",color:"蓝色",batteryType:"铅酸电池",purchasePrice:2800,status:"空闲"},{_id:"4",model:"高端豪车",color:"红色",batteryType:"锂电池",purchasePrice:8e3,status:"空闲"},{_id:"5",model:"普通标准套餐",color:"绿色",batteryType:"铅酸电池",purchasePrice:2500,status:"在租"}]}finally{u.value=!1}},P=l=>{b.push(`/vehicle/${l}`)};return C(()=>{w()}),(l,a)=>{const o=n("el-option"),g=n("el-select"),h=n("el-tag"),T=n("el-icon"),x=n("el-empty"),k=q("loading");return i(),_("div",E,[a[3]||(a[3]=t("div",{class:"page-header"},[t("h2",null,"选择车型"),t("p",null,"浏览全部可用车辆")],-1)),t("div",I,[s(g,{modelValue:d.value,"onUpdate:modelValue":a[0]||(a[0]=e=>d.value=e),placeholder:"电池类型",size:"small",style:{width:"100px"}},{default:c(()=>[s(o,{label:"全部",value:""}),s(o,{label:"锂电池",value:"锂电池"}),s(o,{label:"铅酸电池",value:"铅酸电池"})]),_:1},8,["modelValue"]),s(g,{modelValue:p.value,"onUpdate:modelValue":a[1]||(a[1]=e=>p.value=e),placeholder:"状态",size:"small",style:{width:"100px"}},{default:c(()=>[s(o,{label:"全部",value:""}),s(o,{label:"空闲",value:"空闲"}),s(o,{label:"在租",value:"在租"})]),_:1},8,["modelValue"])]),D((i(),_("div",L,[(i(!0),_(M,null,B(f.value,e=>(i(),_("div",{key:e._id,class:"vehicle-card",onClick:Z=>P(e._id)},[t("div",G,[a[2]||(a[2]=t("span",{class:"emoji"},"🛵",-1)),s(h,{type:e.status==="空闲"?"success":"warning",class:"status-tag",size:"small"},{default:c(()=>[y(r(e.status),1)]),_:2},1032,["type"])]),t("div",H,[t("h4",null,r(e.model),1),t("div",J,[s(h,{size:"small",type:"info"},{default:c(()=>[y(r(e.color),1)]),_:2},1024),s(h,{size:"small",type:"info"},{default:c(()=>[y(r(e.batteryType),1)]),_:2},1024)]),t("div",K,[t("span",O,"¥"+r(V(e))+"/天",1),t("span",Q,"押金: ¥"+r(e.purchasePrice?Math.round(e.purchasePrice*.1):200),1)])]),t("div",W,[s(T,null,{default:c(()=>[s(S(U))]),_:1})])],8,A))),128)),!u.value&&f.value.length===0?(i(),N(x,{key:0,description:"暂无车辆"})):j("",!0)])),[[k,u.value]])])}}},se=z(X,[["__scopeId","data-v-5ef92e98"]]);export{se as default};
|