Comença a funcionar el panell del codi seleccionat amb canvis en temps real sobre la bd

imports/ui/Codis.jsx

@@ -27,6 +27,8 @@ export const Codis = () => {
      const [esEditor, setEsEditor] = useState(false);
      const userId = Meteor.userId();
 
+     const [codiSeleccionat, setCodiSeleccionat] = useState(null);
+     
      useEffect(() => {
           (async () => {
                const comprovaAdmin = await Roles.userIsInRoleAsync(userId, ["admin"]);
@@ -65,6 +67,7 @@ export const Codis = () => {
      //      );
      // };
      // const [ambitGeneral, setAmbitGeneral] = useState(ambitSeleccionat === "GENERAL");
+     const codiDoc = useTracker("codiDoc", () => CodisCollection.findOneAsync(codiSeleccionat?._id));
 
      const SelectorDeRol = () => {
 
@@ -114,12 +117,14 @@ export const Codis = () => {
           const [codiGenerat, setCodiGenerat] = useState(generaCodi()?.toUpperCase());
 
           
+          
           return <div style={{
                display: `inline-block`,
                border: `1px solid #6666`,
                padding: `.5rem`,
                borderRadius: `.3em`,
-               backgroundColor: `lightcyan`
+               backgroundColor: `lightcyan`,
+               outline: `${codiSeleccionat?._id ? '5px solid black' : 'none'}`
           }}>
           
           {ambitSeleccionat && <h1>{ambitSeleccionat?.value}</h1>}
@@ -148,7 +153,7 @@ export const Codis = () => {
                               padding: `0 .2em`,
                               margin: `1rem auto`,
                          }}
-                    >{codiGenerat}</span>
+                    >{codiSeleccionat ? codiSeleccionat?.codi : codiGenerat}</span>
                </div>
                <br />
 
@@ -244,7 +249,18 @@ export const Codis = () => {
                               color: `red`
                          }}
                     >Activació absoluta: </label>
-                    <input type="checkbox" name='activ_abs' />
+                    <input
+                         type="checkbox"
+                         name='activ_abs'
+                         defaultChecked={codiDoc?.act_abs === "on"}
+                         onChange={ev => {
+                              ev.preventDefault();
+                              ev.stopPropagation();
+
+                              Meteor.callAsync('modActivacioAbsolutaCodi', codiDoc);
+                         }}
+                    
+                    />
                     
                     <br />
 
@@ -294,7 +310,7 @@ export const Codis = () => {
           lastWeek = new Date(today.getFullYear(), today.getMonth(), today.getDate() - 7)
      ;
 
-     console.log("codis: ", codis);
+     // console.log("codis: ", codis);
 
           
      return <Suspense fallback={<>Carregant...</>} >
@@ -331,7 +347,14 @@ export const Codis = () => {
                          padding: `4px`,
                          listStyle: `none`,
                          backgroundColor: `${'lightgreen' || 'lightcoral'}`,
-                         position: `relative`
+                         position: `relative`,
+                         outline: `${codiSeleccionat?._id === cod._id ? '3px solid black' : 'none'}`
+                    }}
+                    onClick={ev => {
+                         ev.preventDefault();
+                         ev.stopPropagation();
+
+                         setCodiSeleccionat(codiSeleccionat?._id === cod._id ? null : cod);
                     }}
                >
                     <span
@@ -352,7 +375,7 @@ export const Codis = () => {
 
                               Meteor.callAsync('modActivacioAbsolutaCodi', cod);
                          }}
-                    ></span>
+                    />
                          {cod.codi}
                          {/* {esEditor && <button onClick={() => {setAmbitSeleccionat({value: cod, label: cod})}}>Edita</button>} */}
                </li>)