import{M as b,a as y}from"./footer-Bug7gal9.js";import{c as f}from"./mqttClient-CH6awePY.js";import{S as p,a as h}from"./sweetalert2-Q8-u7Xo8.js";import{_ as S,m as x,q as T,c as n,a as _,b as e,r as g,g as v,F as w,d as I,o as i,t as c}from"./app-108dWUaR.js";const R={name:"RealtimeDetection",components:{ManageSidebar:y,ManageFooter:b},data(){return{logs:[],loading:!1,autoRefreshInterval:null}},computed:{...T(["user","authToken","refreshToken"])},methods:{...x(["logout","setAuthToken","setRefreshToken"]),refreshLogs(){this.loading=!0,f.end(!0,()=>{f.reconnect()})},startAutoRefresh(){this.autoRefreshInterval=setInterval(()=>{this.logs.length>50&&(this.logs=this.logs.slice(0,50))},1e3)},stopAutoRefresh(){clearInterval(this.autoRefreshInterval)},isJsonString(s){try{return JSON.parse(s),!0}catch{return!1}},async handleTokenRefresh(){try{const s=this.refreshToken;if(!s)throw new Error("No refresh token available");const t=await h.post("/api/refresh-token",{refresh_token:s}),{token:r,refresh_token:a}=t.data;return this.setAuthToken(r),this.setRefreshToken(a),this.setAxiosDefaults(r),console.log("Token refreshed successfully."),r}catch(s){console.error("Error refreshing token:",s),p.fire("Error","Session expired. Please log in again.","error"),this.logout()}},setupAxiosInterceptors(){h.interceptors.response.use(s=>s,async s=>{const{config:t,response:r}=s;if(r&&r.status===401&&!t._retry){t._retry=!0;const a=await this.handleTokenRefresh();if(a)return t.headers.Authorization=`Bearer ${a}`,h(t)}return Promise.reject(s)})},logout(){this.$store.dispatch("logout"),this.clearSession()},clearSession(){sessionStorage.removeItem("authToken"),sessionStorage.removeItem("refreshToken"),sessionStorage.removeItem("user"),localStorage.removeItem("authToken"),localStorage.removeItem("refreshToken"),localStorage.removeItem("user")},setAxiosDefaults(s){h.defaults.headers.common.Authorization=`Bearer ${s}`},showErrorAlert(s){p.fire({icon:"error",title:s,toast:!0,position:"top-end",showConfirmButton:!1,timer:3e3})}},mounted(){this.startAutoRefresh(),!this.user||!this.authToken?p.fire({icon:"error",title:"Error",text:"You do not have access. Please log in first.",toast:!0,position:"top-end",showConfirmButton:!1,timer:3e3}).then(()=>{this.logout()}):f.on("message",(s,t)=>{const r=t.toString();if(!this.isJsonString(r)){console.warn(`Invalid JSON message: ${r}`);return}try{const a=JSON.parse(r),l=/^viseron\/binary_sensor\/camera_(\d+)_object_detected\/state$/,d=s.match(l);if(d){const u=d[1],m=a.attributes.objects.map(o=>({created_at:new Date().toLocaleString("id-ID",{timeZone:"Asia/Jakarta"}),name:o.label,camera:`Camera ${u}`,cameraLabel:a.attributes.name,confidence:o.confidence*100,details:`Width: ${o.rel_width}, Height: ${o.rel_height}, X1: ${o.rel_x1}, Y1: ${o.rel_y1}, X2: ${o.rel_x2}, Y2: ${o.rel_y2}`}));this.logs=[...m,...this.logs.slice(0,49)]}}catch(a){console.error("Failed to parse message as JSON:",a)}}),this.setupAxiosInterceptors()},beforeDestroy(){this.stopAutoRefresh()}},A={class:"page-wrapper"},D={class:"page-header d-print-none"},L={class:"container-fluid"},N={class:"row g-2 align-items-center"},$={class:"col-auto"},B=["disabled"],C={key:0},J={key:1},E={class:"page-body"},M={class:"container-fluid"},O={class:"card"},F={class:"card-body"},P={key:0,class:"text-center my-5"},V={key:1},Y={class:"table-responsive"},z={class:"table table-hover table-borderd"},W={style:{"min-width":"160px"}},X={style:{"min-width":"250px"}},q={style:{"min-width":"400px"}},G={style:{"min-width":"500px"}};function H(s,t,r,a,l,d){const u=g("manage-sidebar"),m=g("manage-footer");return i(),n("div",null,[_(u),e("div",A,[e("div",D,[e("div",L,[e("div",N,[t[3]||(t[3]=e("div",{class:"col"},[e("div",{class:"page-pretitle"},"Manage"),e("h2",{class:"page-title"},"Realtime Detection Logs (MQTT)")],-1)),e("div",$,[e("button",{class:"btn btn-primary",onClick:t[0]||(t[0]=(...o)=>d.refreshLogs&&d.refreshLogs(...o)),disabled:l.loading},[l.loading?(i(),n("span",C,t[1]||(t[1]=[e("i",{class:"fa fa-spinner fa-spin me-2"},null,-1),v(" Refreshing... ")]))):(i(),n("span",J,t[2]||(t[2]=[e("i",{class:"fa fa-refresh me-2"},null,-1),v(" Refresh ")])))],8,B)])])])]),e("div",E,[e("div",M,[e("div",O,[e("div",F,[l.loading?(i(),n("div",P,t[4]||(t[4]=[e("i",{class:"fa fa-spinner fa-spin fa-3x"},null,-1),e("p",{class:"mt-4"},"Loading data, please wait...",-1)]))):(i(),n("div",V,[e("div",Y,[e("table",z,[t[5]||(t[5]=e("thead",null,[e("tr",null,[e("th",null,"#"),e("th",null,"Datetime (WIB)"),e("th",null,"Label / Name / Subject"),e("th",null,"Camera Number"),e("th",null,"Camera Label"),e("th",null,"Object Details")])],-1)),e("tbody",null,[(i(!0),n(w,null,I(l.logs,(o,k)=>(i(),n("tr",{key:o.id},[e("td",null,c(k+1),1),e("td",W,c(o.created_at),1),e("td",X,c(o.name),1),e("td",null,c(o.camera),1),e("td",q,c(o.cameraLabel),1),e("td",G,c(o.details),1)]))),128))])])])]))])])])]),_(m)])])}const j=S(R,[["render",H],["__scopeId","data-v-2976db33"]]);export{j as default};
