﻿// 发起砍价页面 - 底部弹窗样式
const { useState, useEffect } = React;

function BargainCreatePage() {
  var h = React.createElement;
function svgArrL(c){return h('svg',{width:20,height:20,viewBox:'0 0 24 24',fill:'none',stroke:c||'#334155',strokeWidth:1.875,strokeLinecap:'round',strokeLinejoin:'round'},h('path',{d:'M15 18l-6-6 6-6'}));}

  var pp = NK.Store.get("pageParams") || {};
  var pid = pp.id;
  var _product = useState(null); var product = _product[0], setProduct = _product[1];
  var _loading = useState(true); var loading = _loading[0], setLoading = _loading[1];
  var _offer = useState(''); var offer = _offer[0], setOffer = _offer[1];
  var _msg = useState('很喜欢这个号，您看这个价格方便出吗？'); var msg = _msg[0], setMsg = _msg[1];
  var _submitting = useState(false); var submitting = _submitting[0], setSubmitting = _submitting[1];
  var _error = useState(''); var error = _error[0], setError = _error[1];
  var _toast = useState(''); var toast = _toast[0], setToast = _toast[1];
  var _quickIdx = useState(0); var quickIdx = _quickIdx[0], setQuickIdx = _quickIdx[1];

  var quickMessages = [
    '很喜欢这个号，您看这个价格方便出吗？',
    '朋友，价格跟预期有差距，能砍点价不？',
    '诚心想买，如果这个价格可以我就直接拍下。',
    '预算有限，您看还能再优惠一点吗？'
  ];

  useEffect(function(){
    if (!pid) { setLoading(false); return; }
    NK.Api.Accounts.detail(pid).then(function(r){
      if (r && r.code === 0) setProduct(r.data); else setError('商品不存在');
    }).catch(function(){ setError('加载失败'); }).finally(function(){ setLoading(false); });
  }, [pid]);

  React.useEffect(function(){
    if (!toast) return;
    var t = setTimeout(function(){ setToast(''); }, 2000);
    return function(){ clearTimeout(t); };
  }, [toast]);

  // Not logged in
  if (!NK.Store.isLoggedIn()) {
    return h("div",{className:"detail-page"},
      h("div",{className:"back-header"}, h("div",{className:"bbtn",onClick:function(){NK.Store.back("home");}},svgArrL()), h("div",{className:"btitle"},"发起砍价")),
      h("div",{className:"empty-state",style:{paddingTop:80}}, h("div",{style:{fontSize:48}},"🔒"), h("div",null,"请先登录"), h("div",{style:{color:"#1677ff",marginTop:12,cursor:"pointer"},onClick:function(){NK.Store.navigate("login");}},"去登录"))
    );
  }

  // Loading
  if (loading) return h("div",{style:{position:"fixed",top:0,left:0,right:0,bottom:0,background:"rgba(0,0,0,0.4)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:100}},
    h("div",{style:{color:"#fff",fontSize:16}},"加载中...")
  );

  // Product not found
  if (!product) return h("div",{style:{position:"fixed",top:0,left:0,right:0,bottom:0,background:"rgba(0,0,0,0.4)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:100}},
    h("div",{style:{background:"#fff",borderRadius:16,padding:32,textAlign:"center"}},
      h("div",{style:{fontSize:15,color:"#333",marginBottom:16}},error || "商品不存在"),
      h("button",{onClick:function(){NK.Store.back("detail",{id:pid});},style:{padding:"10px 32px",borderRadius:8,border:"none",background:"#1677ff",color:"#fff",fontSize:14,cursor:"pointer"}},"返回")
    )
  );

  var coverImg = (product.coverImages && product.coverImages[0] && product.coverImages[0].image_url) || '';
  var originalPrice = Number(product.price);
  var sliderMin = Math.floor(originalPrice * 0.7);
  var sliderMax = Math.floor(originalPrice) - 1;
  if (sliderMax <= sliderMin) sliderMin = Math.max(1, sliderMax - 10);
  var snapThreshold = Math.max(1, Math.floor(originalPrice * 0.005));
  var snapPoints = [
    {v:Math.floor(originalPrice*0.75),l:"7.5\u6298",c:"#ff4d4f"},
    {v:Math.floor(originalPrice*0.8) ,l:"8\u6298",c:"#fa8c16"},
    {v:Math.floor(originalPrice*0.85),l:"8.5\u6298",c:"#fadb14"},
    {v:Math.floor(originalPrice*0.9) ,l:"9\u6298",c:"#73d13d"},
    {v:Math.floor(originalPrice*0.95),l:"9.5\u6298",c:"#52c41a"}
  ];
  function snapPrice(val){
    for (var i = 0; i < snapPoints.length; i++) {
      if (Math.abs(val - snapPoints[i].v) <= snapThreshold) return snapPoints[i].v;
    }
    return val;
  }
  var offerNum = parseInt(offer) || 0;
  var offerPct = originalPrice > 0 ? (offerNum / originalPrice * 100) : 0;

  function getPriceHint(){
    if (!offer || isNaN(offerNum) || offerNum <= 0) return '';
    if (offerPct >= 90) return '当前出价较合理哦～';
    if (offerPct >= 80) return '这个价格卖家可能会考虑';
    return '当前出价偏低，建议适当提高';
  }

  function submit(){
    setError('');
    var price = parseFloat(offer);
    if (isNaN(price) || price <= 0 || price >= originalPrice) {
      setError('请输入低于原价的有效砍价金额'); return;
    }
    setSubmitting(true);
    NK.Api.Bargains.create({ accountId: product.id, offerPrice: price, message: msg }).then(function(r){
      if (r && r.code === 0) {
        NK.Store.navigate("bargainSession", { id: r.data.id }, { replace: true });
      } else {
        setError((r && r.message) || '发起失败');
      }
    }).catch(function(){ setError('网络错误'); }).finally(function(){ setSubmitting(false); });
  }

  function closeSheet(){
    NK.Store.back("detail",{id:pid});
  }

  function cycleQuickText(){
    var next = (quickIdx + 1) % quickMessages.length;
    setQuickIdx(next);
    setMsg(quickMessages[next]);
  }

  var hint = getPriceHint();
  var hintColor = offerPct >= 90 ? "#52c41a" : (offerPct >= 80 ? "#fa8c16" : "#ff7875");

  return h("div",{style:{position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:100,display:"flex",flexDirection:"column",justifyContent:"flex-end"}},
    // Overlay
    h("div",{onClick:closeSheet,style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:"rgba(0,0,0,0.42)"}}),

    // Bottom sheet
    h("div",{style:{position:"relative",background:"#fff",borderRadius:"24px 24px 0 0",maxHeight:"92vh",overflowY:"auto",padding:"0 0 20px",boxShadow:"0 -8px 30px rgba(0,0,0,0.15)"}},

      // Title bar
      h("div",{style:{padding:"20px 20px 8px",display:"flex",alignItems:"flex-start",justifyContent:"space-between"}},
        h("div",null,
          h("div",{style:{fontSize:26,fontWeight:700,color:"#5c3d2e"}},"发起砍价"),
          h("div",{style:{fontSize:12,color:"#b8956a",marginTop:4}},"砍价成功后，买卖双方可继续协商")
        ),
        h("div",{onClick:closeSheet,style:{width:32,height:32,borderRadius:"50%",background:"#f0f0f0",display:"flex",alignItems:"center",justifyContent:"center",fontSize:18,color:"#999",cursor:"pointer",flexShrink:0}},"×")
      ),

      // Product card - compact
      h("div",{style:{margin:"8px 20px",padding:"12px",background:"#fafaf5",borderRadius:14,display:"flex",gap:10,alignItems:"center"}},
        coverImg ? h("img",{src:coverImg,style:{width:48,height:48,borderRadius:10,objectFit:"cover",flexShrink:0},onError:function(e){e.target.style.display="none"}}) : h("div",{style:{width:48,height:48,borderRadius:10,background:"#f0f0f0",display:"flex",alignItems:"center",justifyContent:"center",color:"#bbb",fontSize:20,flexShrink:0}},"☆"),
        h("div",{style:{flex:1,minWidth:0}},
          h("div",{style:{fontSize:13,fontWeight:600,color:"#333",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},product.title),
          h("div",{style:{fontSize:11,color:"#999",marginTop:2}},product.server || ''),
          h("div",{style:{fontSize:14,fontWeight:700,color:"#ff4d4f",marginTop:2}},"原价 ¥" + originalPrice.toFixed(2))
        )
      ),

      // Rules tip
      h("div",{style:{margin:"0 20px 8px",padding:"10px 12px",background:"#fffbe6",borderRadius:10,fontSize:12,color:"#8c6d00",lineHeight:1.6}},
        "砍价应由买卖双方合理议价、友好协商。若卖家同意或买家接受还价后，请在规定时间内完成支付，超时将失效。"
      ),

      // Price display area
      h("div",{style:{margin:"8px 20px",padding:"16px",background:"#fff",borderRadius:16,border:"1px solid #f0e8d8"}},
        // Original price
        h("div",{style:{fontSize:12,color:"#999",marginBottom:6}},"原价 ¥" + originalPrice.toFixed(2)),

        // Big price display
        h("div",{style:{display:"flex",alignItems:"baseline",justifyContent:"center",padding:"12px 0"}},
          h("span",{style:{fontSize:28,fontWeight:700,color:offer?"#333":"#ccc",marginRight:4}},"¥"),
          h("input",{type:"text",inputMode:"numeric",pattern:"[0-9]*",placeholder:"请输入砍价金额",value:offer,

            style:{width:offer?String(offer.length*28+20)+"px":"180px",minWidth:"140px",border:"none",outline:"none",fontSize:offer?48:20,fontWeight:700,color:offer?"#333":"#ccc",textAlign:"center",background:"transparent",padding:0},
            onChange:function(e){
              var v = e.target.value;
              if (v === "") { setOffer(""); return; }
              var n = parseInt(v);
              if (!isNaN(n)) setOffer(String(n));
            }
          })
        ),

        // Price hint
        hint && h("div",{style:{textAlign:"center",fontSize:12,color:hintColor,marginBottom:8}},hint),

        // Slider
        h("div",{style:{padding:"0 4px"}},
          h("input",{type:"range",min:sliderMin,max:sliderMax,step:1,value:offerNum || sliderMin,
            onChange:function(e){
              var val = parseInt(e.target.value);
              setOffer(String(snapPrice(val)));
            },
            style:{width:"100%",height:6,WebkitAppearance:"none",appearance:"none",background:"linear-gradient(90deg, #ff4d4f 0%, #fadb14 50%, #52c41a 100%)",borderRadius:3,outline:"none",cursor:"pointer"}
          }),
          h("div",{style:{position:"relative",height:12,margin:"2px 0 2px"}},
            (function(){
              function dotPos(val){ var rangeTotal = sliderMax - sliderMin || 1; return Math.max(0, Math.min(100, ((val - sliderMin) / rangeTotal) * 100)); }
              function dotEl(val,label,color){
                var pos = dotPos(val);
                return h("div",{style:{position:"absolute",left:pos+"%",top:"50%",transform:"translate(-50%,-50%)",fontSize:10,color:color,fontWeight:600,whiteSpace:"nowrap"}},label);
              }
              var els = [];
              snapPoints.forEach(function(sp){
                if (sp.v >= sliderMin && sp.v <= sliderMax) els.push(dotEl(sp.v, sp.l, sp.c));
              });
              return els;
            })()
          ),
          h("div",{style:{display:"flex",justifyContent:"space-between",fontSize:10,color:"#bbb",marginTop:2}},
            h("span",null,"¥" + sliderMin),
            h("span",null,"¥" + sliderMax)
          ),
        ),
      ),
      // Message area (read-only, preset only)
      h("div",{style:{margin:"8px 20px",padding:"14px",background:"#fff",borderRadius:14,border:"1px solid #f0e8d8"}},
        h("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:8}},
          h("div",{style:{fontSize:13,fontWeight:600,color:"#5c3d2e"}},"💬 给卖家留言"),
          h("div",{onClick:cycleQuickText,style:{fontSize:11,color:"#1677ff",cursor:"pointer",userSelect:"none"}},"换一个")
        ),
        h("div",{style:{width:"100%",borderRadius:10,background:"#f8f6f0",padding:12,fontSize:13,color:"#333",minHeight:48,lineHeight:1.6,boxSizing:"border-box",wordBreak:"break-word"}},msg || "点击“换一个”选择留言"),
        
      ),

      // Error
      error && h("div",{style:{color:"#ff4d4f",fontSize:12,textAlign:"center",margin:"4px 20px"}},error),

      // Submit button
      h("div",{style:{padding:"12px 20px 0"}},
        h("button",{onClick:submit,disabled:submitting,
          style:{width:"100%",padding:"15px",borderRadius:10,border:"none",background:submitting?"#f5c89a":"linear-gradient(135deg, #ff8c42, #f7a94e)",color:"#fff",fontSize:17,fontWeight:700,cursor:submitting?"not-allowed":"pointer",letterSpacing:1}
        }, submitting ? "发起中..." : "立即发起")
      )
    ),

    // Toast
    toast && h("div",{style:{position:"fixed",top:60,left:"50%",transform:"translateX(-50%)",background:"rgba(0,0,0,0.75)",color:"#fff",padding:"10px 24px",borderRadius:20,fontSize:14,zIndex:9999}},toast)
  );
}

window.NK = window.NK || {};
NK.BargainCreatePage = BargainCreatePage;
