inc_ViewCar.php 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775
  1. <section>
  2. <div class="owner--information--wrap">
  3. <div class="col-12 title--wrapper d-flex align-items-center justify-content-between">
  4. <h2>소유주 정보</h2>
  5. <div class="bidding--count">
  6. <? if($ds_status_proc == "E0"){ ?>
  7. <span>입찰 마감 시간 : </span>
  8. <span><?=$time_limit_tender?></span>
  9. <? } ?>
  10. </div>
  11. </div>
  12. <div class="sch--modules--wrap">
  13. <div class="form--group user--info">
  14. <input type="text" placeholder="소유주명" value="<?=$nm_name?>" />
  15. </div>
  16. <div class="form--group car--numb">
  17. <input type="text" placeholder="차량 번호" value="<?=$nm_number?>" />
  18. </div>
  19. <!--<div class="form--group phone--numb">
  20. <input type="text" placeholder="휴대전화 번호" value="<?/*=$nm_hp_sale*/?>" />
  21. </div>-->
  22. <!-- <button>차량 조회<i class="sch--ic"></i></button> -->
  23. </div>
  24. </div>
  25. </section>
  26. <section>
  27. <div class="car--info--wrap">
  28. <h2>차량 정보 입력</h2>
  29. <div class="form--wrap">
  30. <div class="form--groups">
  31. <h2>제조사</h2>
  32. <div class="form--group">
  33. <select name="" id="" disabled>
  34. <option value="<?=$cd_brand?>"><?=$nm_brand?></option>
  35. </select>
  36. </div>
  37. </div>
  38. <div class="form--groups">
  39. <h2>모델</h2>
  40. <div class="form--group">
  41. <select name="" id="" disabled>
  42. <option value="<?=$cd_model?>"><?=$nm_model?></option>
  43. </select>
  44. </div>
  45. </div>
  46. <?php if($is_staff == "Y") { ?>
  47. <div class="form--groups">
  48. <h2>Trade-in</h2>
  49. <div class="form--group">
  50. <select id="ds_tradein" name="ds_tradein"></select>
  51. </div>
  52. </div>
  53. <?php } ?>
  54. <div class="form--groups">
  55. <h2>변속기</h2>
  56. <div class="form--group">
  57. <select id="ds_transmission" name="ds_transmission"></select>
  58. </div>
  59. </div>
  60. <div class="form--groups">
  61. <h2>연식 (최초 등록일)</h2>
  62. <div class="form--group ty2">
  63. <select name="nm_regdate_yyyy" id="nm_regdate_yyyy" style="max-width:134px;">
  64. <?php
  65. $cur_year = date("Y");
  66. $cur_year = (int)$cur_year;
  67. // echo $cur_year;
  68. // exit;
  69. for($i=1990; $i<=$cur_year; $i++){
  70. ?>
  71. <option value="<?=$i?>" <? if($i == $nm_regdate_yyyy){ ?>selected<? } ?>><?=$i?></option>
  72. <?php
  73. }
  74. ?>
  75. </select>
  76. <label for="nm_regdate_yyyy" class="ml10">년</label>
  77. <select name="nm_regdate_mm" id="nm_regdate_mm" style="margin-left:8px;width:70px;">
  78. <?php
  79. for($i=1; $i<=12; $i++){
  80. ?>
  81. <option value="<?=($i<10)?"0".$i:$i?>" <? if($i == $nm_regdate_mm){ ?>selected<? } ?>><?=($i<10)?"0".$i:$i?></option>
  82. <?php
  83. }
  84. ?>
  85. </select>
  86. <label for="" class="ml10">월</label>
  87. </div>
  88. </div>
  89. <div class="form--groups">
  90. <h2>형식 년도</h2>
  91. <div class="form--group ty2">
  92. <select id="ds_year" name="ds_year"></select>
  93. <label for="" class="ml10">년</label>
  94. </div>
  95. </div>
  96. </div>
  97. <div class="form--wrap">
  98. <div class="form--groups">
  99. <h2>배기량</h2>
  100. <div class="form--group ty2">
  101. <input type="text" placeholder="배기량을 입력해주세요" value="<?=$nm_cc?>">
  102. <label for="" class="ml10">cc</label>
  103. </div>
  104. </div>
  105. <div class="form--groups">
  106. <h2>연료</h2>
  107. <div class="form--group">
  108. <input type="text" placeholder="연료를 입력해주세요" value="<?=$ds_oil?>">
  109. <!-- <select name="" id="">
  110. <option value="">선택</option>
  111. </select> -->
  112. </div>
  113. </div>
  114. <div class="form--groups">
  115. <h2>색상</h2>
  116. <div class="form--group ty2">
  117. <input type="text" placeholder="색상을 입력해주세요" value="<?=$nm_color?>">
  118. </div>
  119. </div>
  120. <div class="form--groups">
  121. <h2>주행거리</h2>
  122. <div class="form--group ty2">
  123. <input type="text" placeholder="주행거리를 입력해주세요" value="<?=number_format($nm_mileage)?>">
  124. <label for="" class="ml10">km</label>
  125. </div>
  126. </div>
  127. </div>
  128. <div class="form--wrap">
  129. <div class="form--groups">
  130. <h2>사고 유무</h2>
  131. <div class="form--group">
  132. <select id="ds_accident" name="ds_accident"></select>
  133. </div>
  134. </div>
  135. <div class="form--groups">
  136. <h2>판매 희망 지역</h2>
  137. <div class="form--group">
  138. <select name="ds_area" id="ds_area">
  139. <option value="">판매희망 선택하세요</option>
  140. </select>
  141. </div>
  142. </div>
  143. <div class="form--groups">
  144. <h2>사업자 유,무</h2>
  145. <div class="form--group">
  146. <select name="ds_business_num" id="ds_business_num">
  147. <option value="">사업자 유,무를 선택하세요</option>
  148. </select>
  149. </div>
  150. </div>
  151. <div class="form--groups">
  152. <h2>추가 옵션 및 특이사 항</h2>
  153. <div class="form--group">
  154. <input type="text" placeholder="추가 옵션 및 특이사항을 입력해주세요" value="<?=$nm_cont_pac?>">
  155. </div>
  156. </div>
  157. </div>
  158. <div class="form--wrap">
  159. <div class="form--groups">
  160. <h2>희망 AAP SA</h2>
  161. <div class="form--group">
  162. <input type="text" value="<?=$aap_nm_name?>">
  163. </div>
  164. </div>
  165. <div class="form--groups">
  166. <h2>판매 시기</h2>
  167. <div class="form--group">
  168. <select name="ds_sale_period" id="ds_sale_period"></select>
  169. </div>
  170. </div>
  171. <div class="form--groups">
  172. <h2>옵션정보</h2>
  173. <div class="form--group">
  174. <button type='button' class="btn btn-outline-primary sch--btnz" style="height:53px; width:100%;" id="btn_car_option">옵션보기<i class="sch--ic"></i></button>
  175. </div>
  176. </div>
  177. <!-- <div class="form--groups">
  178. <h2>반려사유</h2>
  179. <div class="form--group">
  180. <input type="text" value="차량정보 미흡" disabled>
  181. </div>
  182. </div> -->
  183. <?php if($is_staff == "Y") { ?>
  184. <div class="form--groups">
  185. <h2>구매방식</h2>
  186. <div class="form--group">
  187. <select name="ds_buy_method" id="ds_buy_method"></select>
  188. </div>
  189. </div>
  190. <div class="form--groups">
  191. <h2>경매시간</h2>
  192. <div class="form--group">
  193. <select name="ds_auction_time" id="ds_auction_time"></select>
  194. </div>
  195. </div>
  196. <?php } ?>
  197. <div class="form--groups">
  198. <h2>사고부위 체크(판금,교환등)</h2>
  199. <div class="form--group">
  200. <input type="text" name="ds_accident_check" id="ds_accident_check" value="<?=$ds_accident_check?>" placeholder="사고부위를 입력해주세요">
  201. </div>
  202. </div>
  203. <div class="form--groups">
  204. <h2>데미지 체크(수리가 필요한곳 기재)</h2>
  205. <div class="form--group">
  206. <input type="text" name="ds_damage_check" id="ds_damage_check" value="<?=$ds_damage_check?>" placeholder="수리가 필요한곳을 입력해주세요">
  207. </div>
  208. </div>
  209. </div>
  210. <div class="form--wrap">
  211. <!-- <div class="form--groups">
  212. <h2>수리부위</h2>
  213. <div class="form--group align-items-center d-flex fixed--positon" style=" width:100%;">
  214. <button class="btn btn-outline-primary" style="width:50%;height:53px;">외판</button>
  215. <button class="btn btn-outline-primary ml20" style="width:50%;height:53px;">주요골격</button>
  216. </div>
  217. </div> -->
  218. <div class="form--groups" style="">
  219. <h2>관리자 코멘트</h2>
  220. <div class="form--group">
  221. <input type="text" value="<?=$nm_guide?>">
  222. </div>
  223. </div>
  224. </div>
  225. </div>
  226. </section>
  227. <?php
  228. $car_history_sql = "SELECT * FROM car_history_master WHERE cd_car_history = '$cd_car_history' AND ds_delind = 'N' AND ds_type = 'user' LIMIT 1 ";
  229. // echo $car_history_sql;
  230. $car_history_res = mysql_query($car_history_sql);
  231. $car_history_col = mysql_fetch_array($car_history_res);
  232. ?>
  233. <!-- 사고이력 -->
  234. <section class="spacer--top mt-5">
  235. <div class="car--info--wrap">
  236. <div class="title--wrapper d-flex align-items-center justify-content-between">
  237. <h2>사고 이력 정보</h2>
  238. <!-- <button class="excid--btn btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal2">사고이력 정보 보기</button> -->
  239. <button type="button" class="excid--btn btn btn-primary" _data-bs-toggle="modal" _data-bs-target="#exampleModal2" id="btn_accident_view">사고이력 정보 보기</button>
  240. </div>
  241. <div class="table--mobile--wrap">
  242. <table class="mt25">
  243. <tbody>
  244. <tr>
  245. <th>차량번호 변경</th>
  246. <td><?=number_format($car_history_col['r201'])?> 회</td>
  247. </tr>
  248. <tr>
  249. <th>소유자 변경</th>
  250. <td><?=number_format($car_history_col['r204'])?> 회</td>
  251. </tr>
  252. <tr>
  253. <th>자동차 보험 특수 사고</th>
  254. <td>잔손 : <?=number_format($car_history_col['405'])?>회 / 침수전(분)손 : <?=number_format($car_history_col['407'])?>회 / 도난 : <?=number_format($car_history_col['r409'])?>회</td>
  255. </tr>
  256. <tr>
  257. <th>보험 사고 (내차 피해)</th>
  258. <td><?=number_format($car_history_col['r401'])?>회 (<?=number_format($car_history_col['r402'])?>원)</td>
  259. </tr>
  260. <tr>
  261. <th>보험 사고 (타차 가해)</th>
  262. <td><?=number_format($car_history_col['r403'])?>회 (<?=number_format($car_history_col['r404'])?>원)</td>
  263. </tr>
  264. </tbody>
  265. </table>
  266. </div>
  267. </div>
  268. </section>
  269. <!-- 추가사진 (필수사진) -->
  270. <section class="spacer--top mt-5 pt30">
  271. <div class="options--wrapper">
  272. <h2>차량사진<span class="astc--text">(필수사진)</span></h2>
  273. <div class="pic--add--wrap mob--view--type">
  274. <?php
  275. $nm_file_front = getCarBasicThumbImage($cd_car, $nm_file_front, '차량전면', false, 'car_basic');
  276. preg_match_all("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i", $nm_file_front, $matches);
  277. $nm_file_front_href = $matches[1][0];
  278. $nm_file_back = getCarBasicThumbImage($cd_car, $nm_file_back, '차량후면', false, 'car_basic');
  279. preg_match_all("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i", $nm_file_back, $matches);
  280. $nm_file_back_href = $matches[1][0];
  281. $nm_file_side1 = getCarBasicThumbImage($cd_car, $nm_file_side1, '운전석 측면', false, 'car_basic');
  282. preg_match_all("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i", $nm_file_side1, $matches);
  283. $nm_file_side1_href = $matches[1][0];
  284. $nm_file_side2 = getCarBasicThumbImage($cd_car, $nm_file_side2, '조수석 측면', false, 'car_basic');
  285. preg_match_all("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i", $nm_file_side2, $matches);
  286. $nm_file_side2_href = $matches[1][0];
  287. $nm_file_dashboard = getCarBasicThumbImage($cd_car, $nm_file_dashboard, '계기판', false, 'car_basic');
  288. preg_match_all("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i", $nm_file_dashboard, $matches);
  289. $nm_file_dashboard_href = $matches[1][0];
  290. ?>
  291. <div class="add--box">
  292. <div class="thumb--wrap">
  293. <div class="thumb car--01">
  294. <a href="<?=$nm_file_front_href?>" data-lightbox="image-1" data-title="차량 전면">
  295. <?=$nm_file_front?>
  296. </a>
  297. </div>
  298. </div>
  299. <div class="desc">차량 전면</div>
  300. </div>
  301. <div class="add--box">
  302. <div class="thumb--wrap">
  303. <div class="thumb car--01">
  304. <a href="<?=$nm_file_back_href?>" data-lightbox="image-1" data-title="차량 후면">
  305. <?=$nm_file_back?>
  306. </a>
  307. </div>
  308. </div>
  309. <div class="desc">차량 후면</div>
  310. </div>
  311. <div class="add--box">
  312. <div class="thumb--wrap">
  313. <div class="thumb car--01">
  314. <a href="<?=$nm_file_side1_href?>" data-lightbox="image-1" data-title="운전석 측면">
  315. <?=$nm_file_side1?>
  316. </a>
  317. </div>
  318. </div>
  319. <div class="desc">운전석 측면</div>
  320. </div>
  321. <div class="add--box">
  322. <div class="thumb--wrap">
  323. <div class="thumb car--01">
  324. <a href="<?=$nm_file_side2_href?>" data-lightbox="image-1" data-title="조수석 측면">
  325. <?=$nm_file_side2?>
  326. </a>
  327. </div>
  328. </div>
  329. <div class="desc">조수석 측면</div>
  330. </div>
  331. <div class="add--box">
  332. <div class="thumb--wrap">
  333. <div class="thumb car--01">
  334. <a href="<?=$nm_file_dashboard_href?>" data-lightbox="image-1" data-title="계기판">
  335. <?=$nm_file_dashboard?>
  336. </a>
  337. </div>
  338. </div>
  339. <div class="desc">계기판</div>
  340. </div>
  341. </div>
  342. </div>
  343. </section>
  344. <!-- 차량사진 (추가사진) -->
  345. <section class="mt-5 pt30">
  346. <div class="options--wrapper">
  347. <h2>차량사진<span class="astc--text">(추가사진)</span></h2>
  348. <div class="pic--add--wrap mob--view--type">
  349. <?php
  350. if(!empty($cd_car)) {
  351. $sql = "SELECT *
  352. FROM car_file
  353. WHERE cd_car = '$cd_car'
  354. AND ds_delind='N'
  355. ORDER BY no_sort ASC, cd_car ASC ";
  356. // echo $sql;
  357. $r = mysql_query($sql, $connect);
  358. $i=1;
  359. while($imgs = mysql_fetch_assoc($r)) {
  360. $img_tag = getCarAddtionalImage($cd_car, $imgs['nm_file'], '추가사진'.$i, true, 'car_additional');
  361. // 정규식을 이용해서 img 태그 전체 / src 값만 추출하기
  362. preg_match_all("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i", $img_tag, $matches);
  363. // img 태그 전체 추출하기
  364. // print_r($matches[0]);
  365. // src 값만 추출하기
  366. // print_r($matches[1]);
  367. // $car_additional_img = UPLOAD_PATH_CAR.$imgs['cd_car']."_detail/".$imgs['nm_file'];
  368. ?>
  369. <div class="add--box">
  370. <div class="thumb--wrap">
  371. <div class="thumb car--01">
  372. <!-- <a href="<?=$matches[1][0]?>" data-lightbox="image-2" data-title="추가사진<?=$i?>"> -->
  373. <?=$img_tag?>
  374. <!-- </a> -->
  375. </div>
  376. </div>
  377. </div>
  378. <?php
  379. $i++;
  380. }
  381. }
  382. ?>
  383. </div>
  384. </div>
  385. </section>
  386. <!-- 차량설명 -->
  387. <section class="mt-5 pt30">
  388. <div class="options--wrapper">
  389. <h2>차량 설명하기</h2>
  390. <div class="editor--wrapper ty2">
  391. <div class="editor--inner col-12">
  392. <textarea rows="10" style="width:100%; padding:20px;" class="form-control"><?=$nm_desc?></textarea>
  393. </div>
  394. </div>
  395. </div>
  396. </section>
  397. <!-- 레이어 팝업 -->
  398. <?php include("../../common/inc/inc_layer_popup_m.php") ?>
  399. <!--
  400. 썸네일 클릭시 표현될 레이아웃
  401. display: flex; 로 활성화
  402. -->
  403. <div class="gallery--wrappers" style="display: none">
  404. <div class="fotorama" data-nav="thumbs">
  405. <a href="/design/staff/assets/img/samp.png" data-caption="차량 전면"><img src="/design/staff/assets/img/samp.png"></a>
  406. <a href="/design/staff/assets/img/samp.png" data-caption="차량 후면"><img src="/design/staff/assets/img/samp.png"></a>
  407. <a href="/design/staff/assets/img/samp.png" data-caption="운전석 측면"><img src="/design/staff/assets/img/samp.png"></a>
  408. <a href="/design/staff/assets/img/samp.png" data-caption="조수석 측면"><img src="/design/staff/assets/img/samp.png"></a>
  409. <a href="/design/staff/assets/img/samp.png" data-caption="계기판"><img src="/design/staff/assets/img/samp.png"></a>
  410. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진1"><img src="/design/staff/assets/img/samp.png"></a>
  411. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진2"><img src="/design/staff/assets/img/samp.png"></a>
  412. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진3"><img src="/design/staff/assets/img/samp.png"></a>
  413. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진4"><img src="/design/staff/assets/img/samp.png"></a>
  414. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진5"><img src="/design/staff/assets/img/samp.png"></a>
  415. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진6"><img src="/design/staff/assets/img/samp.png"></a>
  416. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진7"><img src="/design/staff/assets/img/samp.png"></a>
  417. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진8"><img src="/design/staff/assets/img/samp.png"></a>
  418. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진9"><img src="/design/staff/assets/img/samp.png"></a>
  419. <a href="/design/staff/assets/img/samp.png" data-caption="추가사진10"><img src="/design/staff/assets/img/samp.png"></a>
  420. </div>
  421. </div>
  422. <link href="/design/staff/assets/css/lightbox.css" rel="stylesheet" />
  423. <script src="/design/staff/assets/js/lightbox.js"></script>
  424. <style>
  425. .car_option_popup{
  426. width:100%;
  427. max-width:1200px;
  428. margin:0 auto;
  429. }
  430. .car_option_popup > h2{
  431. font-weight: 700;
  432. font-size: 18px;
  433. line-height: 100%;
  434. letter-spacing: -0.02em;
  435. color: #222222;
  436. }
  437. .car_option_popup > h2 .astc--text{
  438. font-weight: 700;
  439. font-size: 18px;
  440. letter-spacing: -0.02em;
  441. color: #1E75FF;
  442. }
  443. .car_option_popup > h2 .astc--text.ty2{
  444. color: #909EB5;
  445. }
  446. .car_option_popup .options--list{
  447. width:100%;
  448. border-top:1px solid #888;
  449. margin-top:20px;
  450. padding-top:40px;
  451. }
  452. .car_option_popup .options--list > h2{
  453. font-weight: 500;
  454. font-size: 14px;
  455. line-height: 100%;
  456. letter-spacing: -0.02em;
  457. color: #111111;
  458. }
  459. .car_option_popup .options--list > ul{
  460. display: flex;
  461. align-items: center;
  462. margin-top:30px;
  463. margin-bottom:50px;
  464. }
  465. .car_option_popup .options--list > ul >li{
  466. width:calc(100% / 4);
  467. }
  468. input[type="checkbox"] + label{
  469. font-weight: 350;
  470. font-size: 14px;
  471. line-height: 100%;
  472. color: #333333;
  473. display: flex;
  474. align-items:center;
  475. cursor: pointer;
  476. }
  477. input[type="checkbox"] + label:before{
  478. content:'';
  479. display: block;
  480. width:16px;
  481. height:16px;
  482. background:url(/design/staff/assets/img/check_off.svg) no-repeat center;
  483. margin-right:12px;
  484. }
  485. input[type="checkbox"]:checked + label:before{
  486. background:url(/design/staff/assets/img/check_on.svg) no-repeat center;
  487. }
  488. .car_option_popup .pic--add--wrap{
  489. display: flex;
  490. align-items: center;
  491. justify-content:space-between;
  492. width:100%;
  493. border-top:1px solid #888;
  494. margin-top:20px;
  495. padding-top:40px;
  496. }
  497. .car_option_popup .pic--add--wrap.bd-0{
  498. border:0px;
  499. padding-top:0px;
  500. }
  501. .car_option_popup .pic--add--wrap .add--box{
  502. width: 224px;
  503. height: 224px;
  504. display: flex;
  505. align-items: center;
  506. justify-content:center;
  507. flex-direction: column;
  508. background: #FFFFFF;
  509. border: 1px solid #EEEEEE;
  510. box-shadow: 0px 5px 5px rgba(239, 240, 241, 0.5);
  511. border-radius: 20px;
  512. }
  513. .car_option_popup .pic--add--wrap .add--box .thumb{
  514. width: 80px;
  515. height: 80px;
  516. border-radius: 80px;
  517. background: #F7F7F9;
  518. position: relative;
  519. }
  520. .car_option_popup .pic--add--wrap.view--type .add--box .thumb{
  521. width:200px;
  522. height:140px;
  523. border-radius:0px;
  524. margin:0 auto;
  525. overflow:hidden;
  526. background: transparent!important;
  527. }
  528. .car_option_popup .pic--add--wrap.view--type .add--box .thumb img{
  529. position: absolute;
  530. top:50%;
  531. left:50%;
  532. transform: translate(-50%, -50%);
  533. max-height:140px;
  534. max-width:200px;
  535. object-fit: cover;
  536. }
  537. .car_option_popup .pic--add--wrap.view--type .add--box.car--dashboard{
  538. position: relative;
  539. }
  540. .car_option_popup .pic--add--wrap.view--type .add--box.car--dashboard .thumb{
  541. height:204px;
  542. width:204px;
  543. position:absolute;
  544. top:50%;
  545. left:50%;
  546. transform: translate(-50%, -50%);
  547. }
  548. .car_option_popup .pic--add--wrap.view--type .add--box.car--dashboard .thumb img{
  549. width:100%;
  550. height:100%;
  551. max-width:204px;
  552. max-height:204px;
  553. }
  554. .car_option_popup .pic--add--wrap.view--type .add--box.car--dashboard .desc{
  555. z-index: 2;
  556. position: absolute;
  557. bottom:20px;
  558. }
  559. .car_option_popup .pic--add--wrap .add--box .thumb .add--btn{
  560. width: 26px;
  561. height: 26px;
  562. border-radius:26px;
  563. border: 1px solid #EDEFF1;
  564. box-shadow: 0px 2px 2px #DDE1E8;
  565. background:#fff url(../img/add_ic.svg) no-repeat center;
  566. position: absolute;
  567. top:0px;
  568. right:0px;
  569. cursor: pointer;
  570. }
  571. .car_option_popup .pic--add--wrap .add--box .thumb.car--01{ background:#f7f7f9 url(/design/staff/assets/img/car_pic01.svg) no-repeat center;}
  572. .car_option_popup .pic--add--wrap .add--box .thumb.car--02{ background:#f7f7f9 url(/design/staff/assets/img/car_pic02.svg) no-repeat center;}
  573. .car_option_popup .pic--add--wrap .add--box .thumb.car--03{ background:#f7f7f9 url(/design/staff/assets/img/car_pic03.svg) no-repeat center;}
  574. .car_option_popup .pic--add--wrap .add--box .thumb.car--04{ background:#f7f7f9 url(/design/staff/assets/img/car_pic04.svg) no-repeat center;}
  575. .car_option_popup .pic--add--wrap .add--box .thumb.car--05{ background:#f7f7f9 url(/design/staff/assets/img/car_pic05.svg) no-repeat center;}
  576. .car_option_popup .pic--add--wrap .add--box .desc{
  577. font-weight: 350;
  578. font-size: 15px;
  579. line-height: 100%;
  580. text-align: center;
  581. letter-spacing: -0.02em;
  582. color: #000000;
  583. margin-top:10px;
  584. }
  585. .car_option_popup .pic--add--wrap.view--type .add--box .desc{
  586. background: #F3F5F8;
  587. border-radius: 50px;
  588. height:35px;
  589. display:inline-flex;
  590. align-items: center;
  591. padding:0 20px;
  592. font-weight: 350;
  593. font-size: 13px;
  594. text-align: center;
  595. letter-spacing: -0.02em;
  596. color: #000000;
  597. }
  598. .car_option_popup .pic--add--wrap .addition--box .thumb{
  599. background:#f7f7f9 url(../img/pic_ic.svg) no-repeat center;
  600. }
  601. .car_option_popup .pic--add--wrap .addition--box .add--btn{
  602. font-weight: 500;
  603. font-size: 12px;
  604. text-align: center;
  605. letter-spacing: -0.03em;
  606. color: #1E75FF;
  607. width: 100px;
  608. height: 34px;
  609. display: flex;
  610. align-items: center;
  611. justify-content: center;
  612. border: 1px solid rgba(30, 117, 255, 0.3);
  613. border-radius: 50px;
  614. cursor: pointer;
  615. }
  616. </style>
  617. <script>
  618. lightbox.option({
  619. 'resizeDuration': 200,
  620. 'wrapAround': true
  621. });
  622. $(function() {
  623. //input, select disabled 요청 2023-07-14
  624. $(".car--info--wrap select, .car--info--wrap input").prop("disabled", true);
  625. // $("#historyModal").modal("show");
  626. setCodeSelect("areacode","nm_hp1", "","","<?=$nm_hp_sale1?>","선택","");
  627. setCodeSelect("listcode","ds_area", "member_master","ds_area","<?=$ds_area_sale?>","선택하세요","");
  628. setCodeSelect("listcode","ds_business_num", "car_master","ds_business_num","<?=$ds_business_num?>","사업자 유,무를 선택하세요","");
  629. setCodeSelect("listcode","ds_sale_period", "sale_master","ds_sale_period","<?=$ds_sale_period?>","판매시기를 선택하세요","");
  630. setCodeSelect("listcode","ds_transmission", "car_master","ds_transmission","<?=$ds_transmission?>","선택하세요","");
  631. setCodeSelect("listcode","ds_year", "car_master","ds_year","<?=$ds_year?>","선택하세요","");
  632. setCodeSelect("listcode","ds_accident", "car_master","ds_accident","<?=$ds_accident?>","선택","");
  633. setCodeSelect("listcode","ds_tradein", "sale_master","ds_tradein","<?=$ds_tradein?>","선택하세요","");
  634. setCodeSelect("listcode","ds_buy_method", "sale_master","ds_buy_method","<?=$ds_buy_method?>","선택하세요","");
  635. setCodeSelect("listcode","ds_auction_time", "sale_master","ds_auction_time","<?=$ds_auction_time?>","선택하세요","");
  636. //차량이력정보 보기 팝업
  637. $("#btn_accident_view").on("click", function() {
  638. var custom_opts = {
  639. title : '',
  640. btn_close_show : false,
  641. }
  642. $.get("/sell/car_info_car_history_view.php", { mode: 'view', cd_car_history: "<?=$cd_car_history?>", device : 'm'},function(data) {
  643. $("#history_scr_cont").html(data);
  644. $("#historyModal").modal("show");
  645. // viewLayerPopup('car_history');
  646. });
  647. });
  648. $(".car_history_popup .close").on("click", function() {
  649. closeLayerPopup('car_history');
  650. });
  651. //차량이력정보 보기 팝업
  652. $("#btn_car_option").on("click", function() {
  653. var custom_opts = {
  654. title : '',
  655. btn_close_show : false,
  656. }
  657. $.get("/sell/car_option_view.php", { mode: 'view', cd_sale: <?=$cd_sale?>},function(data) {
  658. $("#car_option_cont").html(data);
  659. $("#carOptionModal").modal("show");
  660. });
  661. });
  662. $(".car_option_popup .close").on("click", function() {
  663. closeLayerPopup('car_option');
  664. });
  665. })
  666. </script>