show_search_pic.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta content="医学影像智能解译系统" http-equiv="keywords">
  6. <meta name="description" content="医学影像智能解译系统">
  7. <meta name="applicable-device" content="pc,mobile">
  8. <meta http-equiv="Cache-Control" content="no-siteapp">
  9. <meta http-equiv="Cache-Control" content="no-transform">
  10. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  11. <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
  12. <title>医学影像智能解译系统</title>
  13. <link rel="stylesheet" href="css/index.css" type="text/css">
  14. <link rel="stylesheet" type="text/css" href="css/children.css">
  15. <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
  16. <script type="text/javascript" src="js/jquery.min.js"></script>
  17. <script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>
  18. <script type="text/javascript" src="js/jquery.imgbox.pack.js"></script>
  19. <script type="text/javascript" src="js/public.js"></script>
  20. <!-- 菜单js等-->
  21. <script type="text/javascript" src="js/qrcode.min.js"></script>
  22. <!-- 时间选择js -->
  23. <script type="text/javascript" src="js/laydate.js"></script>
  24. <script type="text/javascript" src="js/show_search_pic1.js"></script>
  25. <link rel="stylesheet" href="css/imgbox.css">
  26. <script language="javascript" type="text/javascript">
  27. if(sessionStorage!=undefined)
  28. {
  29. if(sessionStorage.getItem("username")!=null)
  30. {
  31. $("#needlogin").remove();
  32. var $span= $("<span>用户名:"+sessionStorage.getItem("username")+"</span>");
  33. $("#needloginparent").append($span);
  34. }
  35. else
  36. window.location.href="login.html";
  37. }
  38. </script>
  39. <script>
  40. function changepic() {
  41. //alert(document.getElementById('file').value);
  42. if(document.getElementById('file').value!="")
  43. {
  44. var reads= new FileReader();
  45. f=document.getElementById('file').files[0];
  46. reads.readAsDataURL(f);
  47. reads.onload=function (e) {
  48. document.getElementById('img').src=this.result;
  49. document.getElementById('img_a').href=this.result;
  50. };
  51. document.getElementById('showimg').style.display="block";
  52. document.getElementById('img').style.display="block";
  53. }
  54. else
  55. {
  56. document.getElementById('showimg').style.display="none";
  57. document.getElementById('img').style.display="none";
  58. }
  59. document.getElementById("lesion_class").style.display="none";
  60. document.getElementById("lesion_introduce").style.display="none";
  61. document.getElementById("show_3d").style.display="none";
  62. document.getElementById("legend").style.display="none";
  63. $("tbody").empty();
  64. }
  65. </script>
  66. </head>
  67. <body>
  68. <!--加载框-->
  69. <div id="loadingDiv">
  70. <img src="images/loading.gif" style="margin-top:400px;margin-left:700px;">
  71. </div>
  72. <!--nav-->
  73. <div class="nav">
  74. <div class="nav-container">
  75. <div class="nav-top">
  76. <div class="body-container">
  77. <span class="tip">您好,欢迎来到智能医学影像理解研究中心</span>
  78. <div id="needloginparent" class="l">
  79. <a id="needlogin" href="login.html" target="_self">登录</a>
  80. </div>
  81. <div id="logoutparent" class="l" style="padding-left: 10px;">
  82. <a id="needlogout" href="loginout.html" target="_self">退出</a>
  83. </div>
  84. </div>
  85. </div>
  86. <div class="nav-bottom">
  87. <div class="body-container">
  88. <div class="logo-container">
  89. <img class="logo" src="images/ipiu.jpg">
  90. <div class="word">
  91. <div class="name">智能医学影像理解研究中心</div>
  92. <div class="name-es">Intelligent Medical Image Understand Research Center(IMIU)</div>
  93. </div>
  94. </div>
  95. <div class="side-container">
  96. <ul>
  97. <li> <a href="index.html">首 页</a> </li>
  98. <li> <a href="Laboratory_members.html">研究中心成员</a> </li>
  99. <li > <a href="research_findings1.html">研究成果</a> </li>
  100. <li> <a id="a_datamanage" href="data_manage.html">医学数据管理</a> </li>
  101. <li class="active"> <a id="a_show" href="show_search_text.html">医学影像智能解译系统</a> </li>
  102. </ul>
  103. </div>
  104. </div>
  105. </div>
  106. </div>
  107. </div>
  108. <div class="researchFinding">
  109. <div class="banner common-banner">
  110. <div class="title wid_main">
  111. <h3>医学影像智能解译系统</h3>
  112. <p>Intelligent medical image interpretation system</p>
  113. </div>
  114. </div>
  115. <div class="researchFinding-container">
  116. <div class="researchFinding-content">
  117. <div class="researchFinding-handle">
  118. <div class="title">展示列表</div>
  119. <ul>
  120. <li><a href="image_crop.html">图像切分</a></li>
  121. <li><a href="show_search_text.html">文字检索系统</a></li>
  122. <li class="active"><a href="show_search_pic.html">图像检索系统</a></li>
  123. <li><a href="Image_binary_segmentation.html">二维医学图像分割</a></li>
  124. <li><a href="image_3D_segmentation.html">三维医学图像分割</a></li>
  125. </ul>
  126. <!-- 联系信息 -->
  127. <div class="contact">
  128. <div id="qrcode"></div>
  129. <p class="tip">扫码即可上传手机图像进行智能切分!</p>
  130. <script type="text/javascript">
  131. var qrcode = new QRCode(document.getElementById("qrcode"), {
  132. width : 320,
  133. height : 320
  134. });
  135. function makeCode () {
  136. qrcode.makeCode("https://imiu.xidian.edu.cn/image_crop.html");
  137. }
  138. makeCode();
  139. </script>
  140. </div>
  141. </div>
  142. <div class="info">
  143. <div class="info-head-conatiner">
  144. <span>图像检索系统</span>
  145. </div>
  146. <div class="zy_public_box">
  147. <div class="zy_public_list">
  148. <form class="link_more">
  149. <div class="file-box">
  150. <input type="file" name="file" id="file" onchange="changepic(this)" accept="image/png, image/jpeg, image/gif, image/jpg" style="width: 200px;border: 0px;margin-left: 0px;margin-bottom: 0px;font-size: 15px;background-size: contain;background-repeat: no-repeat;background-position: center center;text-indent:0px">
  151. </div>
  152. <div class="box dib vm">
  153. <span>器官:</span>
  154. <select id="select_organ" name="select">
  155. <option value="1" selected>肝脏</option>
  156. <option value="2"></option>
  157. </select>
  158. </div>
  159. <div class="box dib vm">
  160. <button id="findByOrgan" type="button">器官检索</button>
  161. <button id="findByLesion" type="button">病变检索</button>
  162. </div>
  163. </form>
  164. <form class="zy_content" id="showimg" style="display:none">
  165. <div class="zy_left_con">
  166. <a class="list_images" id="img_a" href="images/mao1.jpg" style="height: 0px;margin-left: 0px"> <img src="images/mao1.jpg" id="img" width="200" height="200"> </a>
  167. </div>
  168. </form>
  169. <form class="link_more" id="legend" style="display:none">
  170. <div class="box dib vm">
  171. <span style="margin-left: 5px;">肝癌:</span>
  172. <img style="width:20px;height:5px;background:#FF0000">
  173. <span style="margin-left: 5px;">肝囊肿:</span>
  174. <img style="width:20px;height:5px;background:#00BB00">
  175. <span style="margin-left: 5px;">肝血管瘤:</span>
  176. <img style="width:20px;height:5px;background:#005AB5">
  177. </div>
  178. </form>
  179. <form class="link_more" id="lesion_class" style="display:none">
  180. <div class="box dib vm">
  181. <span id="lesion_organ" style="color: #005389;margin-left: 5px;">病变类型:</span>
  182. <span id="name">肝囊肿</span>
  183. </div>
  184. </form>
  185. <form class="link_more" id="lesion_introduce" style="display:none">
  186. <span id="introduce" style="margin-left: 5px;color: #005389;">病变介绍:</span>
  187. <text id="introduce_content">
  188. 肝囊肿是临床常见的肝脏良性疾病,分为寄生虫性和非寄生虫性肝囊肿。后者又可分为先天性、创伤性、炎症性和肿瘤性囊肿,其中先天性肝囊肿临床最为多见。多数患者无任何症状,仅在做B超检查或腹部手术时发现,预后一般较好。
  189. </text>
  190. </form>
  191. <form class="link_more" id="show_3d" style="display:none">
  192. <button id="show_3d_image" type="button" style="margin-left:0px">查看相似三维图像</button>
  193. </form>
  194. <!-- 行政许可列表 -->
  195. <div class="zy_public-tip">说明:选择文件,并结合关键词,将根据图库进行相似影像检索</div>
  196. <h3 class="zy_table_list1-title">相似影像</h3>
  197. <table class="zy_table_list1">
  198. <tbody id="mytbody">
  199. </tbody>
  200. </table>
  201. <!-- 通用分页 -->
  202. <div class="fanye">
  203. <span id="datanum">共0条</span>
  204. <span id="pagenum">共0页</span>
  205. <button id="gotofirst">首页</button>
  206. <button id="gotopre">上一页</button>
  207. <button id="gotonext">下一页</button>
  208. <button id="gotolast">尾页</button>
  209. <p> <span>转到第<input type="text" id="selectnumber" value="0"></span> <input type="button" id="gopage_number" value="确定"> </p>
  210. </div>
  211. <!-- 通用分页end -->
  212. </div>
  213. </div>
  214. </div>
  215. </div>
  216. <!-- 底部 -->
  217. <div class="footerbox bg">
  218. <div class="wid_main fix">
  219. <div class="l">
  220. <a href="index.html" target="blank" class="dib vm"><img src="images/ipiu.jpg" width="85" height="85"></a>
  221. </div>
  222. <div class="l txt">
  223. <p>版权所有:西安电子科技大学智能医学影像理解研究中心&nbsp;&nbsp;&nbsp;地址:西安电子科技大学人工智能学院</p>
  224. <p>西安电子科技大学智能医学影像理解研究中心建设和维护 </p>
  225. </div>
  226. </div>
  227. </div>
  228. <!-- 返回顶部 -->
  229. <div class="side_box">
  230. <ul>
  231. <li class="sidetop"> <span></span> </li>
  232. </ul>
  233. </div>
  234. </div>
  235. <!-- 重要新闻展示不滚动 -->
  236. <style>
  237. .banner{
  238. width: 100%;
  239. height: 248px;
  240. background-color: #005389;
  241. background-image: url(./images/version2/medicalImage/bg.png);
  242. background-repeat: no-repeat;
  243. background-size: 100% 100%;
  244. }
  245. .researchFinding{
  246. width: 100%;
  247. position: relative;
  248. }
  249. .researchFinding-container{
  250. width: 100%;
  251. position: absolute;
  252. top: 248px;
  253. z-index: 999;
  254. background-image: url(./images/version2/Laboratory_members/bg.png);
  255. background-size: 100% 100%;
  256. background-repeat: no-repeat;
  257. }
  258. .researchFinding-content{
  259. width: 1200px;
  260. min-height: 500px;
  261. background-color: #fff;
  262. margin: -100px auto 0;
  263. box-shadow: 0 0 2px rgba(0,0,0,0.1);
  264. border-radius: 4px;
  265. display: flex;
  266. justify-content: flex-start;
  267. padding: 40px 20px 100px 40px;
  268. box-sizing: border-box;
  269. }
  270. .researchFinding-content .researchFinding-handle{
  271. width: 240px;
  272. height: 700px;
  273. background-color: #005389;
  274. color: #fff;
  275. padding-left: 20px;
  276. margin-right: 57px;
  277. }
  278. .researchFinding-content .researchFinding-handle .title{
  279. font-size: 28px;
  280. line-height: 26px;
  281. color: #fff;
  282. font-weight: bold;
  283. padding: 32px 0;
  284. text-indent: 20px;
  285. }
  286. .researchFinding-content .researchFinding-handle ul>li{
  287. width: 221px;
  288. height: 64px;
  289. line-height: 64px;
  290. background-color: #fff;
  291. padding-left: 20px;
  292. position: relative;
  293. }
  294. .researchFinding-content .researchFinding-handle ul li::after{
  295. content: "";
  296. display: none;
  297. width: 15px;
  298. height: 100%;
  299. position: absolute;
  300. left: -8px;
  301. top: 0;
  302. background-image: url(./images/version2/Laboratory_members/rectangle.png);
  303. background-size: 100% 100%;
  304. background-repeat: no-repeat;
  305. }
  306. .researchFinding-content .researchFinding-handle ul>li a{
  307. color: #333;
  308. font-size: 18px;
  309. }
  310. .researchFinding-content .researchFinding-handle ul>li.active{
  311. background-color: #E0620D;
  312. }
  313. .researchFinding-content .researchFinding-handle ul>li.active a{
  314. color: #fff;
  315. }
  316. .researchFinding-content .researchFinding-handle ul>li.active::after{
  317. display: block;
  318. }
  319. .researchFinding-content .researchFinding-handle .contact .title{
  320. padding: 48px 0 30px 0;
  321. line-height: 1;
  322. font-size: 26px;
  323. }
  324. .researchFinding-content .researchFinding-handle .contact #qrcode{
  325. display: block;
  326. width: 142px;
  327. height: 142px;
  328. padding: 10px;
  329. background-color: #fff;
  330. margin: 30px auto 10px;
  331. }
  332. .researchFinding-content .researchFinding-handle .contact #qrcode img{
  333. display: block;
  334. width: 142px;
  335. height: 142px;
  336. }
  337. .researchFinding-content .researchFinding-handle .contact .tip{
  338. display: block;
  339. width: 160px;
  340. color: #E0620D;
  341. font-size: 16px;
  342. line-height: 24px;
  343. padding: 12px 0 24px 0;
  344. text-align: center;
  345. margin: 0 auto;
  346. }
  347. .researchFinding-content .info{
  348. max-height: 970px;
  349. overflow-y: auto;
  350. overflow-x: hidden;
  351. flex: 1;
  352. }
  353. .zy_table_list1-title{
  354. font-weight: 700;
  355. font-size: 20px;
  356. line-height: 22px;
  357. padding: 10px 0;
  358. }
  359. #findByLesion{
  360. border:1px dashed #005389;
  361. background: rgba(0, 83, 137, 0.06);
  362. color: #005389;
  363. }
  364. .file-box{
  365. padding-bottom: 10px;
  366. }
  367. </style>
  368. </body>
  369. </html>