internaltogether.vue 28 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931
  1. <template>
  2. <div class="together_one_box">
  3. <div class="u-zy-tit u-zy-tit2">
  4. <div class="w1200">
  5. <div class="tit" id="case-choose-btn">
  6. <div class="fr choose-div">
  7. <span class="choose-ico" @click="callouts"></span>
  8. <div class="choose-rect dis_none" v-show="callout">
  9. <h4>教材选择</h4>
  10. <ul class="clearfix">
  11. <li>
  12. <label class="name">学段: </label>
  13. <p class="li-r case">
  14. <a href="javascript:;" onclick="choosePeriod('xx',this)" class="on">小学</a>
  15. <a href="javascript:;" onclick="choosePeriod('cz',this)">初中</a>
  16. <a href="javascript:;" onclick="choosePeriod('pg',this)">高中</a>
  17. </p>
  18. </li>
  19. <li>
  20. <label class="name">学科: </label>
  21. <Select v-model="model1" style="width:150px;float:left">
  22. <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
  23. </Select>
  24. </li>
  25. <li>
  26. <label class="name">版本: </label>
  27. <Select v-model="model2" style="width:150px;float:left">
  28. <Option v-for="items in cityList2" :value="items.value" :key="items.value">{{ items.label }}</Option>
  29. </Select>
  30. </li>
  31. </ul>
  32. <p class="t_c mgtb20"><a href="javascript:;" onclick="refreshProductList()" class="u-white-btn">确定</a></p>
  33. </div>
  34. </div>
  35. 小学语文<span class="mglr10">●</span>
  36. <em style="color:#555">
  37. 人教部编版...
  38. </em>
  39. </div>
  40. </div>
  41. </div>
  42. <div class="together_content_start">
  43. <div class="together_content">
  44. <div class="left_box">
  45. <p class="title_name">一年级上册</p>
  46. <div class="ztree_box">
  47. <Tree :data="data1"></Tree>
  48. </div>
  49. </div>
  50. <div class="right_box">
  51. <div class="right_header">
  52. <div class="site-nyCase-rect">
  53. <dl class="nyCase-dl clearfix">
  54. <dt class="nyCase-tit c888">类型:</dt>
  55. <dd class="nyCase-c">
  56. <p class="nyCase-c-a">
  57. <a href="javascript:resClassQuery('');" class="on">全部</a>
  58. <a href="javascript:resClassQuery('jl01');">教案</a>
  59. <a href="javascript:resClassQuery('jl02');">课件</a>
  60. <a href="javascript:resClassQuery('jl04');">习题</a>
  61. <a href="javascript:resClassQuery('jl06');">素材</a>
  62. <a href="javascript:resClassQuery('jl12');">试卷</a>
  63. <a href="javascript:resClassQuery('jl25');">微课</a>
  64. <a href="javascript:resClassQuery('jl13');">其他</a>
  65. </p>
  66. </dd>
  67. </dl>
  68. <dl class="nyCase-dl clearfix">
  69. <dt class="nyCase-tit c888">格式:</dt>
  70. <dd class="nyCase-c">
  71. <p class="nyCase-c-a">
  72. <a href="javascript:;" class="on" onclick="javascript:selectFormatDto('');">全部</a>
  73. <a href="javascript:;" onclick="javascript:selectFormatDto('FMT01');">文档</a>
  74. <a href="javascript:;" onclick="javascript:selectFormatDto('FMT02');">图片</a>
  75. <a href="javascript:;" onclick="javascript:selectFormatDto('FMT03');">音频</a>
  76. <a href="javascript:;" onclick="javascript:selectFormatDto('FMT04');">视频</a>
  77. <a href="javascript:;" onclick="javascript:selectFormatDto('FMT05');">动画</a>
  78. <a href="javascript:;" onclick="javascript:selectFormatDto('FMT06');">其他</a>
  79. <a href="javascript:;" onclick="javascript:selectFormatDto('FMT07');">压缩包</a>
  80. </p>
  81. </dd>
  82. </dl>
  83. <dl class="nyCase-dl clearfix">
  84. <dt class="nyCase-tit c888">来源:</dt>
  85. <dd class="nyCase-c">
  86. <p class="nyCase-c-a">
  87. <a href="javascript:;" class="on" onclick="javascript:selectOwnerRes('');">全部</a>
  88. <a href="javascript:;" onclick="javascript:selectOwnerRes('2');">社会企业</a>
  89. <a href="javascript:;" onclick="javascript:selectOwnerRes('3');">教育单位</a>
  90. <a href="javascript:;" onclick="javascript:selectOwnerRes('4');">个人共享</a>
  91. </p>
  92. </dd>
  93. </dl>
  94. </div>
  95. </div>
  96. <div class="together_resource">
  97. <div class="resource_left">
  98. <div class="resource_left_header">
  99. <p class="resource_title">
  100. <a href="javascript:orderQuery('createTime');" class="on new-upload">最新上传<i></i></a>
  101. <a href="javascript:orderQuery('downCount');" class="new-down">最多下载<i></i></a>
  102. <a href="javascript:orderQuery('marks');" class="new-score">评分最高<i></i></a>
  103. </p>
  104. </div>
  105. <div class="resource_list">
  106. <div class="rank-row" v-for="itemy in listdata">
  107. <a id="dl_PD844627256447598592" target="_blank" href="" class="row-photo">
  108. <img :src="itemy.img" width="66" height="66" alt="">
  109. <i class="z-new-ico"></i>
  110. </a>
  111. <div class="row-r-rect clearfix">
  112. <div class="row-r-col2">
  113. <h4>
  114. <a style="display:inline-block;width:450px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:21px;" target="_blank" href="" :title="itemy.title">{{itemy.title}}</a>
  115. </h4>
  116. <p class="title">
  117. <strong class="c888">简介:</strong>
  118. <a style="display:inline-block;width:540px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:21px;" target="_blank" href="">{{itemy.intro}}</a>
  119. </p>
  120. <p class="info">
  121. <span>
  122. <em class="c888">上传时间:</em>{{itemy.time}}
  123. </span>
  124. <span>
  125. <em class="c888">大小:</em>
  126. {{itemy.size}}
  127. </span>
  128. <span><em class="c888">浏览:</em>{{itemy.browse}}</span>
  129. <span><em class="c888">收藏:</em>{{itemy.enshrine}}</span>
  130. <span><em class="c888">下载:</em>{{itemy.upload}}</span>
  131. </p>
  132. </div>
  133. <div class="row-r-col3">
  134. <p class="site_grade"><span class="star"><i style="width:00.0%"></i></span><span class="cfeba1b mgl5" style="color:#feba1b">0.0</span></p>
  135. </div>
  136. </div>
  137. <p class="from">
  138. <i></i>贡献者:
  139. {{itemy.author}}
  140. </p>
  141. </div>
  142. </div>
  143. <div class="pagebtn"><Page :total="100" /></div>
  144. </div>
  145. <div class="resource_right">
  146. <div class="item-recZy">
  147. <h3><strong>推荐资源</strong></h3>
  148. <ul class="clearfix" id="recRes"><li class="first">
  149. <h4 class="name">
  150. <i class="orange">1</i>
  151. <a target="_blank" title="音频:《小蜗牛》课文朗读.mp3" href="">音频:《小蜗牛》课文...</a>
  152. </h4>
  153. <div class="rect">
  154. <img class="photo" src="http://css.huijiaoyun.com/tianyu_edu/area/edu4.0/images/index0331/zy_home/rec_zyImg.png" width="66" height="66">
  155. <div class="baseInfo">
  156. <p><strong>9025</strong>次浏览</p><p><strong>13</strong>次下载</p>
  157. </div></div></li><li>
  158. <h4 class="name"><i class="orange">2</i><a target="_blank" title="图片:雪景.jpg" href="">图片:雪景.jpg</a></h4><div class="rect"><div class="baseInfo"><p><strong>8288</strong>次浏览</p><p><strong>3</strong>次下载</p></div></div></li><li><h4 class="name"><i class="orange">3</i><a target="_blank" title="视频:蜗牛.mp4" href="">视频:蜗牛.mp4</a></h4><div class="rect"><div class="baseInfo"><p><strong>7655</strong>次浏览</p><p><strong>25</strong>次下载</p></div></div></li><li><h4 class="name"><i class="gray">4</i><a target="_blank" title="视频:小蜗牛.mp4" href="">视频:小蜗牛.mp4</a></h4><div class="rect"><div class="baseInfo"><p><strong>7610</strong>次浏览</p><p><strong>2</strong>次下载</p></div></div></li><li><h4 class="name"><i class="gray">5</i><a target="_blank" title="文档1:《小蜗牛》同步练习.doc" href="">文档1:《小蜗牛》同...</a></h4><div class="rect"><div class="baseInfo"><p><strong>7420</strong>次浏览</p><p><strong>1</strong>次下载</p></div></div></li><li><h4 class="name"><i class="gray">6</i><a target="_blank" title="视频:儿歌《蜗牛与黄鹂鸟》.mp4" href="">视频:儿歌《蜗牛与黄...</a></h4><div class="rect"><div class="baseInfo"><p><strong>7067</strong>次浏览</p><p><strong>2</strong>次下载</p></div></div></li></ul>
  159. </div>
  160. </div>
  161. </div>
  162. </div>
  163. </div>
  164. </div>
  165. </div>
  166. </template>
  167. <script>
  168. export default {
  169. data() {
  170. return {
  171. cityList: [
  172. {
  173. value: '语文',
  174. label: '语文'
  175. },
  176. {
  177. value: '数学',
  178. label: '数学'
  179. },
  180. {
  181. value: '英语',
  182. label: '英语'
  183. },
  184. {
  185. value: '品德与生活',
  186. label: '品德与生活'
  187. },
  188. {
  189. value: '品德与社会',
  190. label: '品德与社会'
  191. },
  192. {
  193. value: '体育',
  194. label: '体育'
  195. },
  196. {
  197. value: '道德与法治',
  198. label: '道德与法治'
  199. },
  200. {
  201. value: '科学',
  202. label: '科学'
  203. },
  204. {
  205. value: '音乐',
  206. label: '音乐'
  207. }
  208. ],
  209. cityList2: [
  210. {
  211. value: '人教部编版(新)',
  212. label: '人教部编版(新)'
  213. },
  214. {
  215. value: '延边教育出版社',
  216. label: '延边教育出版社'
  217. },
  218. {
  219. value: '人教课标版',
  220. label: '人教课标版'
  221. },
  222. {
  223. value: '北师大课标版',
  224. label: '北师大课标版'
  225. },
  226. {
  227. value: '鄂教课标版',
  228. label: '鄂教课标版'
  229. },
  230. {
  231. value: '教科课标版',
  232. label: '教科课标版'
  233. },
  234. {
  235. value: '教科课标版(新)',
  236. label: '教科课标版(新)'
  237. },
  238. {
  239. value: '西师大课标版',
  240. label: '西师大课标版'
  241. },
  242. {
  243. value: '语文社课标版',
  244. label: '语文社课标版'
  245. }
  246. ],
  247. model1: '',
  248. model2: '',
  249. callout: false,
  250. data1: [
  251. {
  252. title: '我上学了',
  253. expand: true,
  254. children: [
  255. {
  256. title: '识字',
  257. expand: false,
  258. children: [
  259. {
  260. title: '1 天地人'
  261. },
  262. {
  263. title: '2 金木水火土'
  264. },
  265. {
  266. title: '3 口耳目'
  267. },
  268. {
  269. title: '4 日月水火'
  270. },
  271. {
  272. title: '5 对韵歌'
  273. },
  274. {
  275. title: '口语交际:我说你做'
  276. },
  277. {
  278. title: '语文园地一'
  279. },
  280. {
  281. title: '快乐读书吧'
  282. },
  283. ]
  284. },
  285. {
  286. title: '汉语拼音',
  287. expand: false,
  288. children: [
  289. {
  290. title: '1 a o e'
  291. },
  292. {
  293. title: '2 i u ü y w '
  294. },
  295. {
  296. title: '3 b p m f '
  297. },
  298. {
  299. title: '4 d t n l '
  300. },
  301. {
  302. title: '5 g k h '
  303. },
  304. {
  305. title: '6 j q x '
  306. },
  307. {
  308. title: '7 z c s'
  309. },
  310. {
  311. title: '8 zh ch sh r'
  312. },
  313. {
  314. title: '语文园地二 '
  315. },
  316. {
  317. title: '9 ai ei ui'
  318. },
  319. {
  320. title: '10 ao ou iu'
  321. },
  322. {
  323. title: '11 ie üe er'
  324. },
  325. {
  326. title: '12 an en in un ün'
  327. },
  328. {
  329. title: '13 ang eng ing ong'
  330. },
  331. {
  332. title: '语文园地三'
  333. },
  334. ]
  335. },
  336. {
  337. title: '课文',
  338. expand: false,
  339. children: [
  340. {
  341. title: '1 秋天'
  342. },
  343. {
  344. title: '2 小小的船'
  345. },
  346. {
  347. title: '3 江南'
  348. },
  349. {
  350. title: '4 四季'
  351. },
  352. {
  353. title: '口语交际:我们做朋友'
  354. },
  355. ],
  356. },
  357. {
  358. title: '识字',
  359. expand: false,
  360. children: [
  361. {
  362. title: '6 画'
  363. },
  364. {
  365. title: '7 大小多少'
  366. },
  367. {
  368. title: '8 小书包'
  369. },
  370. {
  371. title: '9 日月明'
  372. },
  373. {
  374. title: '10 升国旗'
  375. },
  376. {
  377. title: '语文园地五'
  378. },
  379. ],
  380. },
  381. {
  382. title: '课文',
  383. expand: false,
  384. children: [
  385. {
  386. title: '5 影子'
  387. },
  388. {
  389. title: '6 比尾巴'
  390. },
  391. {
  392. title: '7 青蛙写诗'
  393. },
  394. {
  395. title: '口语交际:用多大的声音'
  396. },
  397. {
  398. title: '语文园地六'
  399. },
  400. {
  401. title: '9 明天要远足'
  402. },
  403. {
  404. title: '10 大还是小'
  405. },
  406. {
  407. title: '11 项链'
  408. },
  409. {
  410. title: '12 雪地里的小画家'
  411. },
  412. {
  413. title: '13 乌鸦喝水'
  414. },
  415. {
  416. title: '14 小蜗牛'
  417. },
  418. ],
  419. },
  420. {
  421. title: '识字表',
  422. expand: false,
  423. },
  424. {
  425. title: '写字表',
  426. expand: false,
  427. },
  428. {
  429. title: '常用笔画名称表',
  430. expand: false,
  431. },
  432. {
  433. title: '常用偏旁名称表',
  434. expand: false,
  435. },
  436. ]
  437. }
  438. ],
  439. listdata: [
  440. { "id": 1, "img": require("../../assets/image/resource/document_01.jpg"), "title": '《2金木水火土》 教学设计.docx', "intro": '点击查看更多《2金木水火土》 教学设计.docx精彩内容', "time": '2019-03-15', "size": '65KB', 'browse': '109', "enshrine": '5', "upload": '0', "author": '任冲' },
  441. { "id": 2, "img": require("../../assets/image/resource/document_02.jpg"), "title": '《小蜗牛》同步练习.doc', "intro": '点击查看更多《小蜗牛》同步练习精彩内容', "time": '2018-11-06', "size": '91KB', 'browse': '89', "enshrine": '0', "upload": '0', "author": '任冲' },
  442. { "id": 3, "img": require("../../assets/image/resource/document_03.jpg"), "title": '音频:《对韵歌》课文朗读.mp3', "intro": '点击查看更多音频:《对韵歌》课文朗读.mp3精彩内容', "time": '2019-02-21', "size": '99KB', 'browse': '30', "enshrine": '0', "upload": '0', "author": '王瞿' },
  443. { "id": 4, "img": require("../../assets/image/resource/document_04.jpg"), "title": '视频:柳绿桃红.flv', "intro": '点击查看更多视频:柳绿桃红.flv精彩内容', "time": '2019-02-22', "size": '102.3MB', 'browse': '103', "enshrine": '10', "upload": '5', "author": '李佳' },
  444. { "id": 5, "img": require("../../assets/image/resource/document_04.jpg"), "title": '视频:山清水秀的自然风光.mp4', "intro": '点击查看更多视频:山清水秀的自然风光.mp4精彩内容', "time": '2018-12-09', "size": '58MB', 'browse': '206', "enshrine": '10', "upload": '2', "author": '李佳' },
  445. { "id": 6, "img": require("../../assets/image/resource/document_04.jpg"), "title": '视频:云、雨、雪的形成.mp4', "intro": '点击查看更多视频:云、雨、雪的形成.mp4精彩内容', "time": '2018-08-16', "size": '85KB', 'browse': '109', "enshrine": '73', "upload": '40', "author": '任冲' },
  446. { "id": 7, "img": require("../../assets/image/resource/document_02.jpg"), "title": '文档:《对韵歌》拓展学习.ppt', "intro": '点击查看更多文档:《对韵歌》拓展学习.ppt精彩内容', "time": '2018-09-15', "size": '65KB', 'browse': '109', "enshrine": '5', "upload": '0', "author": '任冲' },
  447. { "id": 8, "img": require("../../assets/image/resource/document_01.jpg"), "title": '《2金木水火土》 教学设计.docx', "intro": '点击查看更多《2金木水火土》 教学设计.docx精彩内容', "time": '2019-03-15', "size": '65KB', 'browse': '109', "enshrine": '5', "upload": '0', "author": '任冲' },
  448. ],
  449. }
  450. },
  451. methods: {
  452. callouts() {
  453. this.callout = !this.callout //取反
  454. }
  455. }
  456. }
  457. </script>
  458. <style scoped>
  459. .together {
  460. width:100%;
  461. }
  462. .together_content_start {
  463. width:1200px;
  464. margin:0 auto;
  465. }
  466. .together_content {
  467. width: 1200px;
  468. height: auto;
  469. float:left;
  470. margin:0 auto;
  471. padding-bottom:30px;
  472. }
  473. .left_box {
  474. width:210px;
  475. display:inline-block;
  476. float:left;
  477. }
  478. .ztree_box {
  479. width: 210px;
  480. border: 0px;
  481. background: #fff;
  482. margin-top: 0px;
  483. padding: 10px 10px;
  484. height: 360px;
  485. overflow-y: auto;
  486. overflow-x: auto;
  487. border: 1px solid #e3e3e3;
  488. }
  489. .right_box {
  490. width: 977px;
  491. float:left;
  492. }
  493. .together_resource {
  494. width:100%;
  495. }
  496. .resource_left {
  497. width: 722px;
  498. float: left;
  499. margin-top: 20px;
  500. margin-left: 10px;
  501. }
  502. .resource_left_header {
  503. height: 47px;
  504. line-height: 47px;
  505. width: 100%;
  506. border: 1px solid #f3f3f3;
  507. background: #fff;
  508. }
  509. .resource_title a {
  510. padding: 0 30px;
  511. display: inline-block;
  512. font-size: 14px;
  513. color: #7d98a9;
  514. }
  515. .resource_title {
  516. float:left;
  517. }
  518. .resource_title a.on, .resource_title a:hover {
  519. background: #56bdff;
  520. color: #fff;
  521. text-decoration: none;
  522. }
  523. .resource_title a i {
  524. width: 10px;
  525. height: 14px;
  526. display: inline-block;
  527. background: url(../../assets/image/resource/arrow_top.png) 0 -26px no-repeat;
  528. margin-left: 5px;
  529. vertical-align: middle;
  530. }
  531. .resource_list {
  532. overflow: hidden;
  533. zoom: 1;
  534. margin-top: 5px;
  535. }
  536. .rank-row {
  537. height: auto !important;
  538. height: 100px;
  539. min-height: 100px;
  540. padding: 20px 35px;
  541. position: relative;
  542. z-index: 0;
  543. background: #fff;
  544. border: #eee solid 1px;
  545. z-index: 0;
  546. margin-bottom: 5px;
  547. }
  548. .row-photo {
  549. width: 66px;
  550. height: 66px;
  551. position: absolute;
  552. left: 35px;
  553. }
  554. .row-r-rect {
  555. margin-left: 95px;
  556. margin-top: -2px;
  557. height: 68px;
  558. position: relative;
  559. }
  560. .row-r-col2 {
  561. color: #222;
  562. line-height: 21px;
  563. }
  564. .row-r-col2 h4 {
  565. font-size: 16px;
  566. font-weight: normal;
  567. color: #222;
  568. }
  569. .row-r-col2 .title {
  570. color: #555;
  571. position: relative;
  572. padding-left: 40px;
  573. margin-top: 5px;
  574. }
  575. .row-r-col2 .title strong {
  576. position: absolute;
  577. top: 0;
  578. left: 0;
  579. font-weight: normal;
  580. }
  581. .row-r-col2 .info span {
  582. margin-right: 25px;
  583. color: #888;
  584. }
  585. .c888, a.c888 {
  586. color: #888;
  587. font-style: normal;
  588. }
  589. .row-r-col3 {
  590. width: 230px;
  591. text-align: right;
  592. position: absolute;
  593. top: -6px;
  594. right: 0;
  595. }
  596. .site_grade {
  597. vertical-align: middle;
  598. display: inline-block;
  599. margin-top: 8px;
  600. }
  601. .site_grade .star {
  602. background: url(../../assets/image/resource/qjf_star.gif) repeat;
  603. width: 70px;
  604. height: 12px;
  605. position: relative;
  606. display: inline-block;
  607. overflow: hidden;
  608. }
  609. .site_grade .star i {
  610. background: url(../../assets/image/resource/qjf_star_r.gif) repeat;
  611. display: inline-block;
  612. height: 12px;
  613. overflow: hidden;
  614. position: absolute;
  615. left: 0;
  616. top: 0;
  617. }
  618. .from {
  619. background: url(../../assets/image/resource/user.gif) no-repeat left center;
  620. padding-left: 20px;
  621. line-height: 26px;
  622. margin-top: 10px;
  623. color: #888;
  624. }
  625. .pagebtn {
  626. width:100%;
  627. margin:0 auto;
  628. padding:0% 25%;
  629. margin-top:5%;
  630. }
  631. .resource_right {
  632. float: right;
  633. width: 240px;
  634. margin-top: 20px;
  635. }
  636. .item-recZy {
  637. border: #eee solid 1px;
  638. background: #fff;
  639. }
  640. .item-recZy h3 {
  641. height: 47px;
  642. border-bottom: #eee solid 1px;
  643. padding: 0 10px;
  644. }
  645. .item-recZy h3 strong {
  646. font-weight: normal;
  647. font-size: 20px;
  648. color: #288add;
  649. line-height: 47px;
  650. border-bottom: #288add solid 1px;
  651. display: inline-block;
  652. padding: 0 5px;
  653. }
  654. .item-recZy ul {
  655. padding: 0 15px;
  656. display: block;
  657. }
  658. .item-recZy li.first {
  659. padding: 7px 0;
  660. }
  661. .item-recZy li {
  662. padding: 30px 0;
  663. }
  664. .item-recZy .name {
  665. color: #3d95d5;
  666. line-height: 1.8em;
  667. }
  668. .item-recZy .name i {
  669. display: inline-block;
  670. width: 32px;
  671. height: 32px;
  672. border-radius: 16px;
  673. text-align: center;
  674. line-height: 32px;
  675. font-size: 20px;
  676. color: #fff;
  677. background: #ff7f39;
  678. font-weight: normal;
  679. margin: 0 10px 0 0;
  680. vertical-align: middle;
  681. background: #ff7f39;
  682. font-style: normal;
  683. }
  684. .u-zy-tit .choose-rect li .case a {
  685. float: left;
  686. padding: 0 11px;
  687. margin-right: 10px;
  688. line-height: 26px;
  689. color: #747474;
  690. border-radius: 5px;
  691. }
  692. a, a:visited {
  693. text-decoration: none;
  694. }
  695. .on{
  696. color: #fff;
  697. background: #9d9d9d;
  698. }
  699. .item-recZy .name a {
  700. font-size: 14px;
  701. font-weight: normal;
  702. color: #555;
  703. }
  704. .item-recZy .first .rect {
  705. height: 80px;
  706. background: #fafafa;
  707. margin-top: 10px;
  708. }
  709. .item-recZy .first .photo {
  710. float: left;
  711. width: 66px;
  712. height: 66px;
  713. padding: 7px 8px;
  714. background: #f0f0f0;
  715. margin-right: -90px;
  716. }
  717. .item-recZy .first .baseInfo {
  718. padding-top: 8px;
  719. margin-left: 90px;
  720. }
  721. .item-recZy .baseInfo p {
  722. float: left;
  723. width: 100px;
  724. margin-right: 4px;
  725. margin-top: 8px;
  726. }
  727. .item-recZy .baseInfo strong {
  728. font-weight: normal;
  729. font-size: 14px;
  730. color: #1d9bdc;
  731. margin-right: 5px;
  732. }
  733. .title_name {
  734. width: 100%;
  735. font-size: 14px;
  736. color: #fff;
  737. padding-left: 25px;
  738. line-height: 45px;
  739. font-weight: normal;
  740. cursor: pointer;
  741. background-color: #3d95d5;
  742. }
  743. .u-zy-tit2 {
  744. width: 100%;
  745. min-width: 1200px;
  746. }
  747. .u-zy-tit {
  748. height: 64px;
  749. line-height: 64px;
  750. }
  751. .u-zy-tit .tit {
  752. font-size: 24px;
  753. color: #7f7f7f;
  754. font-weight: normal;
  755. float: left;
  756. cursor: pointer;
  757. color: #555;
  758. }
  759. .u-zy-tit .choose-div {
  760. position: relative;
  761. font-size: 12px;
  762. z-index: 11;
  763. }
  764. .u-zy-tit2 .tit span {
  765. color: #555;
  766. }
  767. .u-zy-tit .tit span {
  768. font-size: 12px;
  769. color: #7f7f7f;
  770. vertical-align: middle;
  771. }
  772. .u-zy-tit2 .choose-ico {
  773. background: url(../../assets/image/resource/choose_icon.png) no-repeat;
  774. }
  775. .u-zy-tit .choose-ico {
  776. display: block;
  777. width: 16px;
  778. height: 16px;
  779. margin: 25px 0 0 10px;
  780. transition: transform .5s ease-in;
  781. }
  782. .u-zy-tit .choose-rect {
  783. position: absolute;
  784. width: 260px;
  785. padding: 0 20px;
  786. background: #fff;
  787. border: #dedede solid 1px;
  788. border-radius: 5px;
  789. margin-left: -80px;
  790. margin-top: 8px;
  791. }
  792. .u-zy-tit .choose-rect h4 {
  793. font-size: 20px;
  794. line-height: 50px;
  795. border-bottom: #dedede solid 1px;
  796. color: #555;
  797. font-weight: normal;
  798. padding: 0 10px;
  799. }
  800. .u-zy-tit .choose-rect li {
  801. clear: both;
  802. padding-top: 20px;
  803. }
  804. .u-zy-tit .choose-rect li label.name {
  805. float: left;
  806. width: 45px;
  807. text-align: right;
  808. line-height: 26px;
  809. margin-right: 10px;
  810. color: #7f7f7f;
  811. }
  812. label {
  813. vertical-align: middle;
  814. }
  815. .u-zy-tit .choose-rect li .case a {
  816. float: left;
  817. padding: 0 11px;
  818. margin-right: 5px;
  819. line-height: 26px;
  820. color: #747474;
  821. border-radius: 5px;
  822. color: #fff;
  823. background: #9d9d9d;
  824. }
  825. .mgtb20 {
  826. margin-top: 20px;
  827. margin-bottom: 20px;
  828. }
  829. .t_c {
  830. text-align: center;
  831. }
  832. .u-white-btn {
  833. background: #fff;
  834. border: #56b8fd solid 1px;
  835. width: 98px;
  836. height: 30px;
  837. text-align: center;
  838. line-height: 30px;
  839. font-size: 14px;
  840. color: #56b8fd;
  841. display: inline-block;
  842. }
  843. .u-zy-tit2 .tit span {
  844. color: #555;
  845. }
  846. .u-zy-tit .tit span {
  847. font-size: 12px;
  848. color: #7f7f7f;
  849. vertical-align: middle;
  850. width: 158px;
  851. z-index: 3;
  852. }
  853. .u-zy-tit2 .tit em {
  854. color: #555;
  855. }
  856. .u-zy-tit .tit em {
  857. color: #55a3de;
  858. font-size: 20px;
  859. font-style: normal;
  860. }
  861. ol, ul, li {
  862. list-style: none;
  863. }
  864. .site-nyCase-rect {
  865. border: #e4e4e4 solid 1px;
  866. overflow: hidden;
  867. zoom: 1;
  868. padding: 8px 15px 9px 15px;
  869. background: #fff;
  870. margin-left:10px;
  871. }
  872. .site-nyCase-rect .nyCase-dl {
  873. padding: 4px 0;
  874. }
  875. .site-nyCase-rect .nyCase-tit {
  876. width: 52px;
  877. float: left;
  878. text-align: center;
  879. margin-right: -52px;
  880. line-height: 34px;
  881. font-size: 14px;
  882. color: #888;
  883. }
  884. .site-nyCase-rect .nyCase-c {
  885. margin-left: 76px;
  886. overflow: hidden;
  887. zoom: 1;
  888. }
  889. .site-nyCase-rect .nyCase-c-a {
  890. float: left;
  891. margin-right: 100px;
  892. }
  893. .site-nyCase-rect .nyCase-c a.on {
  894. padding: 0 9px;
  895. line-height: 24px;
  896. border: #9d9d9d solid 1px;
  897. background: #9d9d9d;
  898. border-radius: 3px;
  899. color: #fff;
  900. }
  901. .site-nyCase-rect .nyCase-c-a a {
  902. float: left;
  903. padding: 0 10px;
  904. line-height: 26px;
  905. color: #222;
  906. text-decoration: none;
  907. margin: 4px 6px 4px 0;
  908. white-space: nowrap;
  909. }
  910. </style>