sample.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220
  1. // // import * as Three from "three";
  2. // import Three from "three";
  3. // // import { OctahedronGeometry } from "three";
  4. // import path from "path";
  5. // import { OrbitControls } from "three-orbitcontrols-ts";
  6. //import router from "./router.vue";
  7. import i18n from "../i18n.js";
  8. import router from "../router.js";
  9. // import ElementPlus from 'element-plus';
  10. // import 'element-plus/dist/index.css';
  11. // import 'animate.css';
  12. //console.log(createApp);
  13. //console.log(i18n);
  14. console.log(router);
  15. const app=createApp({
  16. template:'#app',
  17. // template:`<div v-html='info'>template</div>`,
  18. components:{
  19. Home,
  20. },
  21. data(){
  22. return{
  23. info:`<span style='color:red; font-size:30px'>hello vue template</span>`,
  24. number:0,
  25. locale:null,
  26. books:[
  27. {username:"Linux从入门到精通",nickname:"night-cherry",password:"peking press",descrption:"123"},
  28. ],
  29. }
  30. },
  31. methods:{
  32. interface_web(){
  33. console.log("---------tomcat server----------");
  34. console.log("this.tomcat_res : "+this.tomcat_res);
  35. console.log("------this.books : "+this.books);
  36. const _books=this.books;
  37. let _tomcat_res=this.tomcat_res;
  38. // console.log("------this : "+this);
  39. const request = new XMLHttpRequest();
  40. request.onload=function(){
  41. console.log("--------parse tomcat server string--------");
  42. const res=JSON.parse(request.responseText);
  43. _tomcat_res=res[0].usename;
  44. console.log("res:"+res);
  45. console.log("res[0].usename :"+res[0].usename);
  46. console.log("res[0].nickname :"+res[0].nickname);
  47. console.log("res[0].password :"+res[0].password);
  48. console.log("res[0].description :"+res[0].description);
  49. console.log("res[1]:"+res[1]);
  50. console.log("res[1][\"usename\"] :"+res[1]["usename"]);
  51. console.log("res[1][\"nickname\"] :"+res[1]["nickname"]);
  52. console.log("res[1].password :"+res[1].password);
  53. console.log("res[1].description :"+res[1].description);
  54. console.log("this.tomcat_res : "+this.tomcat_res);
  55. alert("this.tomcat_res : "+_tomcat_res);
  56. console.log("------ _books : "+_books);
  57. // console.log("------this.books : "+this.books);
  58. try{
  59. for(const item of res){
  60. console.log(item);
  61. _books.push(item);
  62. }
  63. // _books.concat(res);
  64. }catch(e){
  65. console.log("the way == _books.push(res[0]) is wrong!!!");
  66. try{
  67. _books.push(res[0]);
  68. }catch(e){
  69. console.log("the way == _books.push(res[0]) is wrong!!!");
  70. }
  71. }finally{
  72. console.log("--object array operation done--");
  73. }
  74. // console.log("------books : "+books);
  75. // console.log("------this : "+this);
  76. console.log("this.tomcat_res : "+_tomcat_res);
  77. };
  78. request.open("POST","http://ancientapes.cc:8080/maven/book_quick");
  79. request.send("test tomcat");
  80. }
  81. },
  82. setup(){
  83. // console.log("Threejs modele");
  84. // // const scene=new Three.Scene();
  85. // // const camera=new Three.PerspectiveCamera();
  86. // // const odemetry=new OctahedronGeometry();
  87. // // document.body.append(new Element(`<h1>index.js</h1>`))
  88. // var canvas=document.getElementById("canvas");
  89. // canvas.width=window.innerWidth;
  90. // canvas.heigt=window.innerHeight;
  91. // var gl=canvas.getContext("webgl");
  92. // gl.viewport(0,0,canvas.width,canvas.heigt);
  93. // console.log("Three",Three);
  94. // const scene=new Three.Scene();
  95. // const camera=new Three.PerspectiveCamera(
  96. // 75,
  97. // window.innerWidth/window.innerHeight,
  98. // 0.1,
  99. // 1000
  100. // );
  101. // camera.position.set(0,0,10);
  102. // scene.add(camera);
  103. // const geometry = new Three.BoxGeometry( 1, 3, 2 );
  104. // const material = new Three.MeshBasicMaterial( {color: 0xffffff} );
  105. // const cube = new Three.Mesh( geometry, material );
  106. // scene.add( cube );
  107. // console.log("cube",cube);
  108. // console.log("cube.position",cube.position);
  109. // const geometry_buffer=new Three.BufferGeometry();
  110. // const vertices=new Float32Array([
  111. // -1.0,-1.0,1.0,
  112. // 1.0,-1.0,1.0,
  113. // 1.0,1.0,1.0,
  114. // 1.0,1.0,1.0
  115. // -1.0,1.0,1.0,
  116. // -1.0,-1.0,1.0
  117. // ]);
  118. // geometry_buffer.setAttribute("position",new Three.BufferAttribute(vertices,3));
  119. // const material_buffer=new Three.MeshBasicMaterial({color: 0xffff00});
  120. // const geometry_buffer_mesh=new Three.Mesh(geometry_buffer,material_buffer);
  121. // scene.add(geometry_buffer_mesh);
  122. // geometry_buffer_mesh.position.set(-10,-2,0);
  123. // // geometry_buffer_mesh.position.x=-10;
  124. // // geometry_buffer_mesh.position.y=-2;
  125. // const cube_geometry=new Three.BoxGeometry(2,2,2);
  126. // const textureloader=new Three.TextureLoader();
  127. // path.resolve(path.dirname.toString());
  128. // console.log("path",path);
  129. // const texture_object=textureloader.load("../media/texture/shazi.png");
  130. // const textureLoader = new Three.TextureLoader();
  131. // const textureFlare0 = textureLoader.load( "../media//texture/envolope.jpg" );
  132. // console.log("textureFlare0",texture_object);
  133. // const basic_material=new Three.MeshBasicMaterial({
  134. // // color:0xf012f0,
  135. // map:texture_object,
  136. // });
  137. // const cube_geometry_object=new Three.Mesh(cube_geometry,basic_material);
  138. // scene.add(cube_geometry_object);
  139. // cube_geometry_object.position.set(8,-3,0);
  140. // const renderer=new Three.WebGLRenderer();
  141. // renderer.setSize(window.innerWidth*0.95,window.innerHeight*0.95);
  142. // window.addEventListener("resize",(EventTarget)=>{
  143. // console.log("resize_______________");
  144. // camera.aspect=window.innerWidth*0.95,window.innerHeight*0.95;
  145. // camera.updateProjectionMatrix();
  146. // renderer.setSize(window.innerWidth*0.95,window.innerHeight*0.95);
  147. // renderer.setPixelRatio(window.devicePixelRatio);
  148. // });
  149. // const controls=new OrbitControls(camera,renderer.domElement);
  150. // controls.enableDamping=true;
  151. // // renderer.render(scene,camera);
  152. // let rare_positionx= cube.position.x-2;
  153. // let rare_positiony= cube.position.y-2;
  154. // let step=0.02, range=400,mark=0;
  155. // function render_each_second(){
  156. // // renderer.render(scene,camera);
  157. // controls.update();
  158. // if(mark<= range){
  159. // cube.position.x+=step;
  160. // cube.position.y+=step;
  161. // cube.rotateZ(0.02);
  162. // cube.rotateY(0.015);
  163. // cube_geometry_object.rotateX(0.01);
  164. // cube_geometry_object.rotateY(0.01);
  165. // cube_geometry_object.rotateZ(0.01);
  166. // geometry_buffer_mesh.rotateY(0.05);
  167. // mark=mark + 1;
  168. // }else{
  169. // // cube.position.x=(step*range);
  170. // cube.position.x=(rare_positionx);
  171. // cube.position.y=(rare_positiony);
  172. // mark=0;
  173. // }
  174. // // (times < n)?cube.position.x+=times:cube.position.x=rare_position;
  175. // // console.log("cube.position",cube.position);
  176. // renderer.render(scene,camera);
  177. // requestAnimationFrame(render_each_second);
  178. // };
  179. // render_each_second();
  180. // console.log("renderer",renderer);
  181. // document.body.appendChild(renderer.domElement);
  182. // // import {OrbitControls} from 'three';//three/examples/jsm/controls/OrbitControls
  183. // // import { OrbitControls } from "three/addons/controls/OrbitControls.js";
  184. // // import { OrbitControls } from "three-orbitcontrols-ts";
  185. // // const controls=new Three.OrbitControls(camera,renderer.domElement);
  186. // // import { OrbitControls } from 'three-orbitcontrols-ts';
  187. // // const controls=new Three.OrbitControls(camera,renderer.domElement);
  188. // // const controls=new OrbitControls(camera,renderer.domElement);
  189. // // setTimeout(() => {
  190. // // console.log("cube.position",cube.position);
  191. // // cube.position.set(10,1000,500);
  192. // // console.log("cube.position",cube.position);
  193. // // }, 1500);
  194. }
  195. }).use(i18n).use(router).mount("#app");
  196. //Vue.createApp(app).mount("#app");