Moving object on checkbox event

Question

I totally have no clue how to use tween to move the object to an alternate position on the checkbox event. I expect when the checkbox is checked, the object moves to another position. When the checkbox is unchecked, the object returns to the initial position. Just for now, everything works except the checkbox event. Please give advice (or guidelines) if you have any solution or other method to achieve my intention apart from using tween.

ps I'm not an expert in coding and just getting started to three.js, therefore I've highly appreciated the help.

here's the full code

<script>

                let scene, camera, renderer, controls;

                function loadModel(url) {
                    return new Promise(resolve => {
                        new THREE.GLTFLoader().load(url, resolve);
                    });
                }
                function init() {
                    scene = new THREE.Scene();
                    scene.background = new THREE.Color(0xBDBDBD);

                    camera = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight, 1, 5000);
                    camera.rotation.y = 45 / 180 * Math.PI;
                    camera.position.x = 40;
                    camera.position.y = 0;
                    camera.position.z = 40;

                    hlight = new THREE.AmbientLight(0x404040, 1);
                    scene.add(hlight);

                    directionalLight = new THREE.DirectionalLight(0x333333, 1);
                    directionalLight.position.set(2, 1, 0);
                    directionalLight.castShadow = true;
                    scene.add(directionalLight);

                    renderer = new THREE.WebGLRenderer({ antialias: true });
                    renderer.setSize(window.innerWidth, window.innerHeight);
                    document.body.appendChild(renderer.domElement);

                    controls = new THREE.OrbitControls(camera, renderer.domElement);
                    controls.addEventListener('change');

                    let model1, model2, model3;

                    let p1 = loadModel('./combination/BOX1/box1.gltf').then(result => { model1 = result.scene.children[0]; });
                    let p2 = loadModel('./combination/BOX2/box2.gltf').then(result => { model2 = result.scene.children[0]; });
                    let p3 = loadModel('./combination/BOX3/box3.gltf').then(result => { model3 = result.scene.children[0]; });

                    
                    Promise.all([p1, p2, p3]).then(() => {
                        
                        model1.position.set(0, 5, 0);
                        model2.position.set(0, 25, 0);
                        model3.position.set(-1.05, 20, 0.58);

                        scene.add(model1);
                        scene.add(model2);
                        scene.add(model3);

                        animate();
                    });
                }
                function zoom() {
                    var move = document.getElementById('controllr');
                    move.addEventListener('change', (e) => {
                        if (e.currentTarget.checked) {
                            var tween = new TWEEN.Tween(model2.position).to({ x: 0, y: 50, z: 0 }, 4000).start();
                        } else {
                            var tween = new TWEEN.Tween(model2.position).to({ x: 0, y: 25, z: 0 }, 4000).start();
                        }
                    });
                }
                function animate(time) {
                    TWEEN.update(time);
                    renderer.render(scene, camera);
                    requestAnimationFrame(animate);
                }
                init();
                animate();

            </script>