# fluent-cart/1.3.20/assets/chunks/ProductVariationSelector.js

FluentCart A New Era of eCommerce – Faster, Lighter, and Simpler, version 1.3.20. 2 lines.

- Page: https://pluginprobe.com/plugins/fluent-cart/1.3.20/code/assets/chunks/ProductVariationSelector.js
- Raw: https://pluginprobe.com/plugins/fluent-cart/1.3.20/raw/assets/chunks/ProductVariationSelector.js
- Modified: 2026-04-21T13:59:48+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/fluent-cart/1.3.20/code/assets/chunks/ProductVariationSelector.js#L10-L20`.

```javascript
import{h as x,v as w,K as B,i as N,e as d,d as f,a as y,t as c,w as m,n as S,r as I,o as i,f as v,b as u,F as _,c as b,p as E,g as C}from"./vue.esm-bundler.js?ver=1.3.20";import{_ as T}from"./DynamicIcon.js?ver=1.3.20";import{o as U}from"./vue-router.js?ver=1.3.20";import{t as g}from"./Translator.js?ver=1.3.20";import{U as A}from"./Utils.js?ver=1.3.20";import{_ as P}from"./_plugin-vue_export-helper.js?ver=1.3.20";const F={class:"fct-save-bar-inner"},L={class:"fct-save-bar-left"},j={class:"title"},D={class:"fct-save-bar-right"},M={class:"fct-btn-group"},q={key:0,class:"cmd"},Z={__name:"SaveBar",props:{isActive:String,saveButtonText:{type:String,default:g("Save")},discardButtonText:{type:String,default:g("Discard")},loading:{type:Boolean,default:!1},loadingText:{type:String,default:g("Saving")},showCmndIcon:{type:Boolean,default:!1},unSaveChangesText:{type:String,default:g("Unsaved Changes")}},emits:["discard","save"],setup(e,{emit:l}){const o=e,s=x(!1),t=x("");w(()=>o.isActive,(r,k)=>{t.value=r});const a=l,p=()=>{t.value="",a("discard")},V=()=>{t.value="",a("save")},n=r=>{t.value&&t.value!==""?(r.preventDefault(),s.value=!0,setTimeout(()=>{s.value=!1},2e3),r.returnValue=""):s.value=!1};return U((r,k,h)=>{t.value&&t.value!==""?(s.value=!0,setTimeout(()=>{s.value=!1},1e3),h(!1)):(h(),s.value=!1)}),B(()=>{window.removeEventListener("beforeunload",n)}),N(()=>{window.addEventListener("beforeunload",n)}),(r,k)=>{const h=I("el-button");return i(),d("div",{class:S(`fct-save-bar ${e.isActive??""} ${s.value?"shake-unsave-changes":""}`)},[f("div",F,[f("div",L,[y(T,{name:"AlertIcon"}),f("h4",j,c(e.unSaveChangesText),1)]),f("div",D,[f("div",M,[y(h,{onClick:p,type:"info",soft:""},{default:m(()=>[v(c(e.discardButtonText),1)]),_:1}),y(h,{type:"primary",onClick:V,loading:e.loading},{default:m(()=>[e.showCmndIcon&&!e.loading?(i(),d("span",q,"⌘s")):u("",!0),e.loading?(i(),d(_,{key:1},[v(c(e.loadingText),1)],64)):u("",!0),e.loading?u("",!0):(i(),d(_,{key:2},[v(c(e.saveButtonText),1)],64))]),_:1},8,["loading"])])])])],2)}}},z={name:"ProductVariationSelector",props:{modelValue:{type:[Array,String,Number],default:()=>[]},is_multiple:{type:Boolean,default:!0},popoverClass:{type:String,default:""},scopes:{type:Array,default:()=>[]}},emits:["update:modelValue","visible-change"],computed:{Utils(){return A},selectedFormattedItems(){let e=this.selectedVariationIds;if(this.is_multiple||(e=[],this.selectedVariationIds&&e.push(this.selectedVariationIds)),!e||!(e!=null&&e.length))return null;let l={},o={};this.products.forEach(t=>{l[t.label]=t.children,t.children.forEach(a=>{o[a.value]={productName:t.label,variationName:a.label}})});let s={};return e.forEach(t=>{if(o[t]){let a=o[t];s[a.productName]||(s[a.productName]=[]),s[a.productName].push(a.variationName)}else s.Unknown||(s.Unknown=[]),s.Unknown.push(t)}),Object.keys(s).forEach(t=>{var a;s[t].length===((a=l[t])==null?void 0:a.length)&&(s[t]=[])}),s}},watch:{selectedVariationIds(e){this.$emit("update:modelValue",e)},modelValue(e){this.selectedVariationIds=e}},data(){return{products:[],selectedVariationIds:this.modelValue,loading:!1}},methods:{onVisibleChange(e){this.$emit("visible-change",e)},searchProducts(e=""){this.loading=!0;const l={search:e,include_ids:this.is_multiple?this.selectedVariationIds:[this.selectedVariationIds]};this.scopes.length&&(l.scopes=this.scopes),this.$get("products/search-product-variant-options",l).then(o=>{this.products=o.products}).catch(o=>{console.error("error -> ",o)}).finally(()=>{this.loading=!1})},filterNodeMethod(e,l){return l}},mounted(){this.is_multiple?Array.isArray(this.selectedVariationIds)||(this.selectedVariationIds=[]):this.selectedVariationIds=this.selectedVariationIds?parseInt(this.selectedVariationIds):null,this.searchProducts()}},K={key:0,class:"flex items-center flex-wrap gap-1.5"},O={key:0},R={key:0,class:"flex items-center flex-wrap gap-1.5"},$={key:0};function G(e,l,o,s,t,a){const p=I("el-tag"),V=I("el-tree-select");return i(),b(V,{modelValue:t.selectedVariationIds,"onUpdate:modelValue":l[0]||(l[0]=n=>t.selectedVariationIds=n),data:t.products,"filter-method":a.Utils.debounce(a.searchProducts),"filter-node-method":a.filterNodeMethod,filterable:"","show-checkbox":"",multiple:o.is_multiple,clearable:"",placeholder:e.$t("Select product"),onVisibleChange:l[1]||(l[1]=n=>{a.onVisibleChange(n)}),"popper-class":o.popoverClass,class:S(t.loading?"is-custom-loading":"")},E({_:2},[o.is_multiple?{name:"tag",fn:m(()=>[a.selectedFormattedItems?(i(),d("div",R,[(i(!0),d(_,null,C(a.selectedFormattedItems,(n,r)=>(i(),b(p,{class:"mr-2"},{default:m(()=>[v(c(r)+" ",1),n.length?(i(),d("span",$," | "+c(n.join(", ")),1)):u("",!0)]),_:2},1024))),256))])):u("",!0)]),key:"1"}:{name:"label",fn:m(()=>[a.selectedFormattedItems?(i(),d("div",K,[(i(!0),d(_,null,C(a.selectedFormattedItems,(n,r)=>(i(),b(p,{class:"mr-2"},{default:m(()=>[v(c(r)+" ",1),n.length?(i(),d("span",O," | "+c(n.join(", ")),1)):u("",!0)]),_:2},1024))),256))])):u("",!0)]),key:"0"}]),1032,["modelValue","data","filter-method","filter-node-method","multiple","placeholder","popper-class","class"])}const ee=P(z,[["render",G]]);export{ee as P,Z as _};

```