issue #11 Done amenity quantity control pop ui.

This commit is contained in:
Paul Kim
2024-03-15 17:43:02 +09:00
parent 08ad96e59b
commit d805f4bb44
5 changed files with 1079 additions and 99 deletions

View File

@@ -187,6 +187,43 @@
<div class="slider">
<div class="owl-carousel owl-theme" id="lst_ctgsel"></div>
</div>
<div class="cart">
<div>
<div class="menu">
<div>
<div id="title"></div>
<div id="control">
<div id="thumb"></div>
<div>
<div id="quantity"></div>
<div>
<div id="icon_up"></div>
<div id="number"></div>
<div id="icon_down"></div>
</div>
</div>
<div>
<div id="amount"></div>
<div id="total"></div>
</div>
</div>
<div id="description">
<div id="name"></div>
<div id="details"></div>
</div>
</div>
</div>
<div class="items">
<div id="title"></div>
<div id="table"></div>
<div id="amount">
<div id="total"></div>
<div id="value"></div>
</div>
</div>
</div>
</div>
<div class="order"></div>
<div class="use_guide"></div>
</div>
<div class="roomservice">

View File

@@ -82,13 +82,12 @@ HotelTV.api = (function() {
*/
function __apifxn_get_api_url(api_type) {
var dic_api_url = {
/* Setting & Contents */
"get_translation": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/translation",
"get_device_settings": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/setting",
"get_site_info": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/info",
"get_guest_info": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/guest",
"get_opening_ctz": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/opening",
"get_amenity_ctz": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amentity",
"get_roomservice_ctz": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/roomService",
"get_widget_ctz": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/widget",
"get_program_ctz": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/program",
"get_epg_info": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/epg",
@@ -97,13 +96,18 @@ HotelTV.api = (function() {
"get_services": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/services",
"get_news": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/news",
"get_message": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/messages",
/* Requests */
/* Amenity&Room Service: get/request/sotck */
"get_ctz_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amentity",
"get_stock_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amenity/stock",
"get_carts_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amenity/carts",
"put_carts_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amenity/carts",
"update_carts_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amenity/carts",
"delete_carts_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amenity/carts",
"get_order_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amenity/orders",
"put_order_amenity": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/amenity/orders",
"get_ctz_roomservice": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/roomService",
"get_stock_roomservice": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/roomService/stock",
"get_carts_roomservice": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/roomService/carts",
"put_carts_roomservice": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/roomService/carts",
"update_carts_roomservice": __apifxn_get_base_url() + "/api/" + _api_ver + "/assets/" + _dev_familly + "/" + _serial_num + "/requests/roomService/carts",
@@ -117,7 +121,6 @@ HotelTV.api = (function() {
/*
"get_emergency": __apifxn_get_base_url() + "/api/" + _api_ver + "/settops/" + _serial_num + "/emergency",
"set_message_status": __apifxn_get_base_url() + "/api/" + _api_ver + "/settops/" + _serial_num + "/messages",
"set_device_opmode": __apifxn_get_base_url() + "/api/" + _api_ver + "/settops/" + _serial_num + "/bbdoors/opmode",
*/
}
@@ -334,7 +337,7 @@ HotelTV.api = (function() {
GetAmenityCtz: function() {
return new Promise((resolve, reject) => {
let sz_api_url = __apifxn_get_api_url("get_amenity_ctz");
let sz_api_url = __apifxn_get_api_url("get_ctz_amenity");
__apifxn_CallCmsApi("GET", sz_api_url, "GetAmenityCtz", null).then(_result => {
//console.log(`Success::>${_result.data}`);
resolve(JSON.parse(_result.data));
@@ -347,7 +350,7 @@ HotelTV.api = (function() {
GetRoomServiceCtz: function() {
return new Promise((resolve, reject) => {
let sz_api_url = __apifxn_get_api_url("get_roomservice_ctz");
let sz_api_url = __apifxn_get_api_url("get_ctz_roomservice");
__apifxn_CallCmsApi("GET", sz_api_url, "GetRoomServiceCtz", null).then(_result => {
//console.log(`Success::>${_result.data}`);
resolve(JSON.parse(_result.data));
@@ -466,9 +469,33 @@ HotelTV.api = (function() {
});
},
/**
* HotelTV API ::> get amenity stock info
* @param {string} _item_id
* @param {number} _quantity
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
GetAmenityStocks: function(_item_id, _quantity) {
return new Promise((resolve, reject) => {
let sz_api_url = __apifxn_get_api_url("get_stock_amenity")+ "/" + _item_id + "?quantity=" + _quantity;
__apifxn_CallCmsApi("GET", sz_api_url, "GetAmenityStocks", null).then(_result => {
//console.log(`Success::>${_result.data}`);
resolve(JSON.parse(_result.data));
}).catch(_error => {
console.error(`Failure::>${_error.reason}`);
reject(_error.reason);
});
});
},
/**
* HotelTV API ::> get amenity carts info
* @param {dictionary} _item_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _item_id
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
GetAmenityCarts: function(_item_id) {
return new Promise((resolve, reject) => {
@@ -485,7 +512,11 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> put amenity carts info
* @param {dictionary} _item_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _item_id
* @param {number} _quantity
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
PutAmenityCarts: function(_item_id, _quantity) {
return new Promise((resolve, reject) => {
@@ -502,7 +533,11 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> update amenity carts info
* @param {dictionary} _cart_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _cart_id
* @param {number} _quantity
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
UpdateAmenityCarts: function(_cart_id, _quantity) {
return new Promise((resolve, reject) => {
@@ -519,7 +554,10 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> delete amenity carts info
* @param {dictionary} _cart_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _cart_id
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
DeleteAmenityCarts: function(_cart_id) {
return new Promise((resolve, reject) => {
@@ -536,7 +574,10 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> get amenity order info
* @param {dictionary} _item_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _cart_id
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
GetAmenityOrders: function(_item_id) {
return new Promise((resolve, reject) => {
@@ -552,12 +593,36 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> order amenity
* @param {dictionary} _cart_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _cart_id
* @returns
* null: if _cart_id isn't null it will return specified info with _cart_id
* {dictionary}
*/
PutAmenityOrders: function(_cart_item) {
PutAmenityOrders: function(_cart_id) {
return new Promise((resolve, reject) => {
let sz_api_url = __apifxn_get_api_url("put_order_amenity");
__apifxn_CallCmsApi("POST", `${sz_api_url}`, "PutAmenityOrders", _cart_item).then(_result => {
__apifxn_CallCmsApi("POST", `${sz_api_url}`, "PutAmenityOrders", _cart_id).then(_result => {
//console.log(`Success::>${_result.data}`);
resolve(JSON.parse(_result.data));
}).catch(_error => {
console.error(`Failure::>${_error.reason}`);
reject(_error.reason);
});
});
},
/**
* HotelTV API ::> get roomservice stock info
* @param {string} _item_id
* @param {number} _quantity
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
GetRoomserviceStocks: function(_item_id, _quantity) {
return new Promise((resolve, reject) => {
let sz_api_url = __apifxn_get_api_url("get_stock_roomservice")+ "/" + _item_id + "?quantity=" + _quantity;
__apifxn_CallCmsApi("GET", sz_api_url, "GetRoomserviceStocks", null).then(_result => {
//console.log(`Success::>${_result.data}`);
resolve(JSON.parse(_result.data));
}).catch(_error => {
@@ -569,7 +634,10 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> get room service carts info
* @param {dictionary} _item_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _item_id
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
GetRoomserviceCarts: function(_item_id) {
return new Promise((resolve, reject) => {
@@ -586,7 +654,11 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> put room service carts info
* @param {dictionary} _item_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _item_id
* @param {number} _quantity
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
PutRoomserviceCarts: function(_item_id, _quantity) {
return new Promise((resolve, reject) => {
@@ -603,7 +675,11 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> update room service carts info
* @param {dictionary} _cart_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _item_id
* @param {number} _quantity
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
UpdateRoomserviceCarts: function(_cart_id, _quantity) {
return new Promise((resolve, reject) => {
@@ -620,7 +696,10 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> delete room service carts info
* @param {dictionary} _cart_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _cart_id
* @returns
* null: if _cart_id isn't null it will return specified info with _cart_id
* {dictionary}
*/
DeleteRoomserviceCarts: function(_cart_id) {
return new Promise((resolve, reject) => {
@@ -637,7 +716,10 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> get room service order info
* @param {dictionary} _item_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _item_id
* @returns
* null: if _item_id isn't null it will return specified info with _item_id
* {dictionary}
*/
GetRoomserviceOrders: function(_item_id) {
return new Promise((resolve, reject) => {
@@ -653,12 +735,15 @@ HotelTV.api = (function() {
/**
* HotelTV API ::> order room service
* @param {dictionary} _cart_id if _item_id isn't null it will return specified info with _item_id
* @param {string} _cart_id
* @returns
* null: if _cart_id isn't null it will return specified info with _cart_id
* {dictionary}
*/
PutRoomserviceOrders: function(_cart_item) {
PutRoomserviceOrders: function(_cart_id) {
return new Promise((resolve, reject) => {
let sz_api_url = __apifxn_get_api_url("put_order_roomservice");
__apifxn_CallCmsApi("POST", `${sz_api_url}`, "PutRoomserviceOrders", _cart_item).then(_result => {
__apifxn_CallCmsApi("POST", `${sz_api_url}`, "PutRoomserviceOrders", _cart_id).then(_result => {
//console.log(`Success::>${_result.data}`);
resolve(JSON.parse(_result.data));
}).catch(_error => {
@@ -668,7 +753,7 @@ HotelTV.api = (function() {
});
},
ReportEvent: function(_arrary_event) {
ReportEvent: function(_arrary_event, _type=null) {
let _json_event = {
"events": [],
};
@@ -677,6 +762,7 @@ HotelTV.api = (function() {
_json_event.events.push({
"power": _arrary_event[_evtidx].power,
"location": _arrary_event[_evtidx].location,
'type': _type,
"timestamp": Date.now()
})
}

View File

@@ -522,6 +522,7 @@ HotelTV.ui_appfull = (function() {
'prev': 1,
},
"items": {},
"stock": {},
}
};
}
@@ -574,23 +575,431 @@ HotelTV.ui_appfull = (function() {
}
}
/**
* HotelTV UI[AppFull] Wrapper Function::> Draw amenity feature
*/
function __uifxn_AppFull_DrawAmUserGuide(_action) {
let _state = HotelTV.state;
let _trTbl = HotelTV.translation;
let _opening = HotelTV.opening;
let _aminfo_top = _opening.amenity;
let _aminfo_ctgy = _aminfo_top.menu;
let _elAmPupRoot = $('.popup .amenity');
let _elAmUGRoot = _elAmPupRoot.children('.use_guide');
let __status_am_specific = null;
try{
// 어메니티 정보 오브젝트
_aminfo_top = _opening.amenity;
_aminfo_ctgy = _aminfo_top.menu;
__status_am_specific = _state.hotkey.mm[_aminfo_top.button].status;
let __amctgyIdx = __status_am_specific.category_sel.cur;
let __amctgyItemStatus = __status_am_specific.items[_aminfo_ctgy[__amctgyIdx].name];
if ( _action=="destroy" ){
if ( _elAmUGRoot.children().length ){
_elAmUGRoot.children().remove();
}
return;
}
switch(_state.menu.stage.cur)
{
case "amenity_ctgy_sel": {
}break;
}
switch ( _action )
{
case "enter": {
} break;
}
}catch(_err){
console.log(`Fail to draw::> ${_err}`);
}
}
/**
* HotelTV UI[AppFull] Wrapper Function::> Draw amenity item selection cart ui
*/
function __uifxn_AppFull_DrawAmItemSeletionCart(_action) {
let _state = HotelTV.state;
let _trTbl = HotelTV.translation;
let _opening = HotelTV.opening;
let _carts = HotelTV.carts.amenity;
let _order = HotelTV.orders.amenity;
let _aminfo_top = _opening.amenity;
let _aminfo_ctgy = _aminfo_top.menu;
let _elAmPupRoot = $('.popup .amenity');
let _elAmCtgyBg = _elAmPupRoot.children('.bg').find('#lst_ctgbg');
let _elAmCtgyBgFocus = _elAmCtgyBg.find('.owl-item.active.center');
let _elAmCtgyBgMenuItemWin = _elAmCtgyBgFocus.find('.am_item_sel_win');
let _elAmCtgyBgMenuItemCartWin = _elAmCtgyBgFocus.find('.am_item_sel_cart_win');
let _elAmCtgyBgMenuItemCartWinLeft = _elAmCtgyBgMenuItemCartWin.children('.winleft');
let _elAmCtgyBgMenuItemCartWinRight = _elAmCtgyBgMenuItemCartWin.children('.winright');
let __status_am_specific = null;
const __ifxn_estimateAmCartAmount = function(_item_idx) {
}
const __ifxn_removeAmSelectedItemCartWinElement = function() {
// Remove All element under winright div
if ( _elAmCtgyBgMenuItemCartWinLeft.children().length ){
_elAmCtgyBgMenuItemCartWinLeft.children().remove();
}
if ( _elAmCtgyBgMenuItemCartWinRight.children().length ){
_elAmCtgyBgMenuItemCartWinRight.children().remove();
}
}
const __ifxn_updateAmCartRecTable = function() {
try{
let _elAmCtgyBgMenuItemCartLstRecTbl = _elAmCtgyBgMenuItemCartWinRight.children('.cart_table').find('.tbl_record');
if ( _elAmCtgyBgMenuItemCartLstRecTbl.length )
{
// Remove all record under tbl_record
_elAmCtgyBgMenuItemCartLstRecTbl.children().remove();
// {
// let _elTBody_ItmesRec = document.createElement('tbody');
// _elTBody_ItmesRec.setAttribute("id", "record");
// for (let _j = 1; _j <= _objAm_ctgyItem.length; _j++) {
// let _objChkAvail=null;
// let _objItem = _objAm_ctgyItem[_j];
// var _elTr_ItmesRec = document.createElement('tr');
// var _elDiv_ItmesRec = document.createElement('div');
// _elDiv_ItmesRec.className = "cartItem";
// var _elDiv_ItmesRecName = document.createElement('div');
// _elDiv_ItmesRecName.setAttribute("id", "title");
// _elDiv_ItmesRecName.textContent = _objItem.title[_state.lang];
// _elDiv_ItmesRec.appendChild(_elDiv_ItmesRecName);
// var _elDiv_ItmesRecPrice = document.createElement('div');
// _elDiv_ItmesRecPrice.setAttribute("id", "quantity");
// _elDiv_ItmesRecPrice.textContent = _objItem.quantity[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _aminfo_top.currency[_state.lang];
// _elDiv_ItmesRec.appendChild(_elDiv_ItmesRecPrice);
// var _elDiv_ItmesRecStatus = document.createElement('div');
// _elDiv_ItmesRecStatus.setAttribute("id", "amount");
// _objChkAvail = __uifxn_Utils_CheckAmItemAvailable(_objItem.schedule);
// if(_objChkAvail.result==true){
// _elDiv_ItmesRecStatus.textContent = _trTbl.ui.amenity.title.orderable[_state.lang];
// }else{
// _elDiv_ItmesRec.classList.add("unavailable");
// if ( _objChkAvail.avail_dtime=="unorderable" ){
// _elDiv_ItmesRecStatus.textContent = _trTbl.ui.amenity.title.unorderable[_state.lang];
// }else{
// _elDiv_ItmesRecStatus.textContent = _objChkAvail.avail_dtime;
// }
// }
// _elDiv_ItmesRec.appendChild(_elDiv_ItmesRecStatus);
// _elTr_ItmesRec.appendChild(_elDiv_ItmesRec);
// _elTBody_ItmesRec.appendChild(_elTr_ItmesRec);
// }
// _elAmCtgyBgMenuItemCartLstRecTbl.appendChild(_elTBody_ItmesRec);
// }
}
} catch ( _err ){
console.log(`Fail to update::> ${_err}`);
}
}
/**
* 주어진 _item_idx 아이탬의 수량 및 금액을 갱신
* @param {string} _item_idx
* @param {string} _action
*/
const __ifxn_updateAmSelectedItemCartWin = async function(_item_idx, _action) {
let __api_resp_stock = null;
let __selected_item_amount_quantity = 0;
let __selected_item_amount_subTotal = 0;
let __item_info = _aminfo_ctgy[__status_am_specific.category_sel.cur].items[_item_idx+1];
let _elDiv_QuntCtrlFrmQuantityValue = _elAmCtgyBgMenuItemCartWinLeft.children('.control').children('.quantity').find('#value_quantity');
let _elDiv_QuntCtrlFrmAmountValue = _elAmCtgyBgMenuItemCartWinLeft.children('.control').children('.quantity').find('#value_amount');
const ___ifxn_checkCartItemExist = function(_object, _itemID) {
for (__j = 1; __j <= _object.length; __j++) {
if (_object[__j].itemId == _itemID) {
return true;
}
}
return false;
}
/**
* cart 오브젝트에서 해당 item id에 해당하는 수량을 반환.
* 찾지 못하면 1개(디퐅트)를 반환
* @param {object} _object
* @param {string} _itemID
* @returns
*/
const ___ifxn_getCartItemQuantity = function(_object, _itemID) {
for (__j = 1; __j <= _object.length; __j++) {
if ( _object[__j].id != null ){
if ( _object[__j].itemId == _itemID ) {
return _object[__j].quantity;
}
}
}
return 1;
}
const ___ifxn_updateSubTotalAmount = async function(_itemID, _quantityNum) {
let __api_resp = await HotelTV.api.GetAmenityStocks(_itemID, _quantityNum);
if ( __api_resp==null ){
console.log("error");
__selected_item_amount_subTotal = "Error";
} else {
__selected_item_amount_subTotal = __api_resp['amount'][_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _aminfo_top.currency[_state.lang];
}
if ( _elDiv_QuntCtrlFrmAmountValue.length ){
_elDiv_QuntCtrlFrmAmountValue.text(__selected_item_amount_subTotal);
}
}
// 개수 및 산정 로직
// i) 현재 카트내에 해당 item id에 해당하는 개수르 구함.
// ii) stock API로 총 비용을 산정
if ( _action=="build" ){
__selected_item_amount_quantity = ___ifxn_getCartItemQuantity(_carts.items, __item_info.id);
__status_am_specific.stock[__item_info.id] = {"req_quantity": __selected_item_amount_quantity};
___ifxn_updateSubTotalAmount(__item_info.id, __selected_item_amount_quantity);
} else if ( _action=="plus" ){
__status_am_specific.stock[__item_info.id].req_quantity += 1;
___ifxn_updateSubTotalAmount(__item_info.id, __status_am_specific.stock[__item_info.id].req_quantity);
} else if ( _action=="minus" ){
if ( __status_am_specific.stock[__item_info.id].req_quantity>1 ){
__status_am_specific.stock[__item_info.id].req_quantity -= 1;
___ifxn_updateSubTotalAmount(__item_info.id, __status_am_specific.stock[__item_info.id].req_quantity);
}
}
// 개수 및 금액 출력
if ( _elDiv_QuntCtrlFrmQuantityValue.length ){
_elDiv_QuntCtrlFrmQuantityValue.text(__status_am_specific.stock[__item_info.id].req_quantity);
}
}
const __ifxn_buildAmSelectedItemCartWin = function(_item_idx) {
let _sz_styleOpt = null;
let __item_info = _aminfo_ctgy[__status_am_specific.category_sel.cur].items[_item_idx+1];
const __iCbfxn_buildAmSelectedItemWin = function() {
// 상품 상세 설명페이지 구성
__ifxn_removeAmSelectedItemCartWinElement();
// Quantity Window
{
//// Quantity Window Title
let _elDiv_QuntWinTitle = document.createElement('div');
_elDiv_QuntWinTitle.className = "title";
_elDiv_QuntWinTitle.textContent = _trTbl.ui.amenity.title.selected_menu_quantity[_state.lang].toUpperCase();
_elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntWinTitle);
//// Quantity control Frame
var _elDiv_QuntCtrlFrm = document.createElement('div');
_elDiv_QuntCtrlFrm.className = "control";
_elDiv_QuntCtrlFrm.innerHTML = `<div id="img_thumbnail" style="background-image: url(${__item_info.thumbnail.files[_state.lang].download});"></div>`;
var _elDiv_QuntCtrlFrmQuantity = document.createElement('div');
_elDiv_QuntCtrlFrmQuantity.className = "quantity";
_elDiv_QuntCtrlFrmQuantity.innerHTML = `<div id="lable_quantity">${_trTbl.ui.amenity.title.quantity[_state.lang].toUpperCase()}</div>`;
_elDiv_QuntCtrlFrmQuantity.innerHTML += `<div id="value_quantity"></div>`;
_elDiv_QuntCtrlFrmQuantity.innerHTML += `<div id="lable_amount">${_trTbl.ui.amenity.title.amount[_state.lang].toUpperCase()}</div>`;
_elDiv_QuntCtrlFrmQuantity.innerHTML += `<div id="value_amount"></div>`;
_elDiv_QuntCtrlFrm.append(_elDiv_QuntCtrlFrmQuantity);
_elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntCtrlFrm);
//// Item description
var _elDiv_QuntItemDesc = document.createElement('div');
_elDiv_QuntItemDesc.className = "description";
_elDiv_QuntItemDesc.innerHTML = `<div id="title">${__item_info.title[_state.lang]}</div><div id="details">${__item_info.description[_state.lang]}</div>`;
_elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntItemDesc);
//// Buttons
var _elDiv_QuntBtnFrm = document.createElement('div');
_elDiv_QuntBtnFrm.className = "buttons";
_elDiv_QuntBtnFrm.innerHTML = `<div id="btn_addtocart">${_trTbl.ui.amenity.title.add_to_cart[_state.lang].toUpperCase()}</div>`;
_elDiv_QuntBtnFrm.innerHTML += `<div id="btn_ordernow">${_trTbl.ui.amenity.title.order_now[_state.lang].toUpperCase()}</div>`;
_elDiv_QuntBtnFrm.innerHTML += `<div id="btn_back">${_trTbl.ui.amenity.title.back[_state.lang].toUpperCase()}</div>`;
_elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntBtnFrm);
}
// CART Window
{
//// Cart Window Title
let _elDiv_CartWinTitle = document.createElement('div');
_elDiv_CartWinTitle.className = "title";
_elDiv_CartWinTitle.textContent = _trTbl.ui.amenity.title.cartslist[_state.lang].toUpperCase();
_elAmCtgyBgMenuItemCartWinRight.append(_elDiv_CartWinTitle);
//// Cart item table
let _elDiv_CartWinTable = document.createElement('div');
_elDiv_CartWinTable.className = "cart_table";
{
////// ADD Table Header
var _elTbl_ItemsHdr = document.createElement('table');
_elTbl_ItemsHdr.className = "tbl_header";
let _elTBody_ItmesHdr = document.createElement('tbody');
{
_elTBody_ItmesHdr.setAttribute("id", "hdr");
var _elTr_ItmesHdr = document.createElement('tr');
var _elTh_ItmesHdr_Title = document.createElement('th');
_elTh_ItmesHdr_Title.setAttribute("id", "title");
_elTh_ItmesHdr_Title.textContent = _trTbl.ui.amenity.title.item[_state.lang];
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Title);
var _elTh_ItmesHdr_Amount = document.createElement('th');
_elTh_ItmesHdr_Amount.setAttribute("id", "quantity");
_elTh_ItmesHdr_Amount.textContent = _trTbl.ui.amenity.title.quantity[_state.lang];
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Amount);
var _elTh_ItmesHdr_Status = document.createElement('th');
_elTh_ItmesHdr_Status.setAttribute("id", "amount");
//toUppderCase()
_elTh_ItmesHdr_Status.textContent = _trTbl.ui.amenity.title.amount[_state.lang];
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Status);
_elTBody_ItmesHdr.appendChild(_elTr_ItmesHdr);
}
_elTbl_ItemsHdr.appendChild(_elTBody_ItmesHdr);
_elDiv_CartWinTable.appendChild(_elTbl_ItemsHdr);
////// Append item list record
var _elTbl_ItemsRec = document.createElement('table');
_elTbl_ItemsRec.className = "tbl_record";
_elDiv_CartWinTable.appendChild(_elTbl_ItemsRec);
//////// update cart table record
__ifxn_updateAmCartRecTable();
}
_elAmCtgyBgMenuItemCartWinRight.append(_elDiv_CartWinTable);
//// Quantity Window Title
let _elDiv_CartWinSummary = document.createElement('div');
_elDiv_CartWinSummary.className = "summary";
//_elDiv_CartWinSummary.textContent = _trTbl.ui.amenity.title.sum[_state.lang];
_elAmCtgyBgMenuItemCartWinRight.append(_elDiv_CartWinSummary);
}
}
_elAmCtgyBgMenuItemWin.fadeOut(200, function() {
__iCbfxn_buildAmSelectedItemWin();
_elAmCtgyBgMenuItemCartWin.fadeIn(500, function() {
_elAmCtgyBgMenuItemCartWinLeft.find('#btn_back').addClass('focus');
__ifxn_updateAmSelectedItemCartWin(_item_idx, "build");
HotelTV.api.ReportEvent([
{
'power': true,
'location':{
// TODO: 통계 데이터 파라미터 확인해
'conId':__item_info.id
}
}], "indirect");
});
});
}
const __ifxn_removeAmSelectedItemCartWin = function(_item_idx) {
// Remove All element under winleft&winright div
_elAmCtgyBgMenuItemCartWin.fadeOut(200, function() {
__ifxn_removeAmSelectedItemCartWinElement();
if ( _elAmCtgyBgMenuItemWin.css('display') == "none") {
_elAmCtgyBgMenuItemWin.fadeIn(500, function() {
});
}
});
}
try{
// 어메니티 정보 오브젝트
_aminfo_top = _opening.amenity;
_aminfo_ctgy = _aminfo_top.menu;
__status_am_specific = _state.hotkey.mm[_aminfo_top.button].status;
let __amctgyIdx = __status_am_specific.category_sel.cur;
let __amctgyItemStatus = __status_am_specific.items[_aminfo_ctgy[__amctgyIdx].name];
switch ( _action )
{
case "cart": {
__ifxn_buildAmSelectedItemCartWin(__amctgyItemStatus.idx);
} break;
case "left": {
let _str_curBtnID = _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').attr('id');
if ( _str_curBtnID=='btn_back' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_ordernow').addClass('focus');
} else if ( _str_curBtnID=='btn_ordernow' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_addtocart').addClass('focus');
}
} break;
case "right": {
let _str_curBtnID = _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').attr('id');
if ( _str_curBtnID=='btn_addtocart' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_ordernow').addClass('focus');
} else if ( _str_curBtnID=='btn_ordernow' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_back').addClass('focus');
}
} break;
case "quantity_plus": {
__ifxn_updateAmSelectedItemCartWin(__amctgyItemStatus.idx, "plus");
} break;
case "quantity_minus": {
__ifxn_updateAmSelectedItemCartWin(__amctgyItemStatus.idx, "minus");
} break;
case "return": {
__ifxn_removeAmSelectedItemCartWin();
} break;
}
}catch(_err){
console.log(`Fail to draw::> ${_err}`);
}
}
/**
* HotelTV UI[AppFull] Wrapper Function::> Draw amenity item selection ui
*/
function __uifxn_AppFull_DrawAmItemSeletion(_action) {
let _state = HotelTV.state;
let __status_am_specific = null;
let _trTbl = HotelTV.translation;
let _opening = HotelTV.opening;
let _order = HotelTV.orders.amenity;
let _aminfo_top = _opening.amenity;
let _aminfo_ctgy = _aminfo_top.menu;
// let _elMainRoot = $('.main');
// let _elMainMenu = _elMainRoot.children('.mm');
let _elAmPupRoot = $('.popup .amenity');
let _elAmCtgyBg = _elAmPupRoot.children('.bg').find('#lst_ctgbg');
let _elAmCtgyBgFocus = _elAmCtgyBg.find('.owl-item.active.center');
let _elAmCtgyBgMenuItemWin = _elAmCtgyBgFocus.find('.am_item_sel_win')
let _elAmCtgyBgMenuItemWin = _elAmCtgyBgFocus.find('.am_item_sel_win');
let __status_am_specific = null;
const __ifxn_updateAmItemDesc = function(_item_idx) {
@@ -599,12 +1008,7 @@ HotelTV.ui_appfull = (function() {
// Remove All element under winright div
let _elDivWinRight = _elAmCtgyBgMenuItemWin.find('.winright');
if ( _elDivWinRight.css('display') != "none") {
_elDivWinRight.fadeOut(200, function() {
if ( _elDivWinRight.children().length ){
_elDivWinRight.children().remove();
}
const __iCbfxn_updateAmItemDesc = function() {
//상품 상세 설명페이지 구성
////썸네일
let _elDiv_ItmesThumb = document.createElement('div');
@@ -633,8 +1037,14 @@ HotelTV.ui_appfull = (function() {
//winright에 썸네일과 상세설명 추가
_elDivWinRight.append(_elDiv_ItmesThumb);
_elDivWinRight.append(_elDiv_ItmesDetails);
}
if ( _elDivWinRight.css('display') != "none") {
_elDivWinRight.fadeOut(200, function() {
if ( _elDivWinRight.children().length ){
_elDivWinRight.children().remove();
}
__iCbfxn_updateAmItemDesc();
_elDivWinRight.fadeIn(500, function() {
});
});
@@ -642,42 +1052,11 @@ HotelTV.ui_appfull = (function() {
if ( _elDivWinRight.children().length ){
_elDivWinRight.children().remove();
}
//상품 상세 설명페이지 구성
////썸네일
let _elDiv_ItmesThumb = document.createElement('div');
_elDiv_ItmesThumb.className = "amItemDescThumb";
//let thuri = __item_info.thumbnail.files[_state.lang].download;
_sz_styleOpt = "background-image: url(" + __item_info.thumbnail.files[_state.lang].download + "); ";
_sz_styleOpt += "background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; ";
_elDiv_ItmesThumb.setAttribute("style", _sz_styleOpt);
////상세설명
let _elDiv_ItmesDetails = document.createElement('div');
_elDiv_ItmesDetails.className = "amItemDescDetails";
var _elDiv_ItmesTitle = document.createElement('div');
_elDiv_ItmesTitle.setAttribute("id", "title");
_elDiv_ItmesTitle.textContent = __item_info.title[_state.lang];
var _elDiv_ItmesDescription = document.createElement('div');
_elDiv_ItmesDescription.setAttribute("id", "description");
_elDiv_ItmesDescription.textContent = __item_info.description[_state.lang];
//_elDiv_ItmesDescription.textContent = __item_info.description[_state.lang].replace(/(?:\r\n|\r|\n)/g, '<br>');
_elDiv_ItmesDetails.appendChild(_elDiv_ItmesTitle);
_elDiv_ItmesDetails.appendChild(_elDiv_ItmesDescription);
//winright에 썸네일과 상세설명 추가
_elDivWinRight.append(_elDiv_ItmesThumb);
_elDivWinRight.append(_elDiv_ItmesDetails);
__iCbfxn_updateAmItemDesc();
_elDivWinRight.fadeIn(500, function() {
});
}
}
const __ifxn_removeAmItemDesc = function(_item_idx) {
@@ -697,9 +1076,7 @@ HotelTV.ui_appfull = (function() {
// 어메니티 정보 오브젝트
_aminfo_top = _opening.amenity;
_aminfo_ctgy = _aminfo_top.menu;
__status_am_specific = _state.hotkey.mm[_aminfo_top.button].status;
let __amctgyIdx = __status_am_specific.category_sel.cur;
let __amctgyItemStatus = __status_am_specific.items[_aminfo_ctgy[__amctgyIdx].name];
@@ -876,10 +1253,11 @@ HotelTV.ui_appfull = (function() {
_elDiv_Ctgy.appendChild(_elDiv_CtgyGradientBottom);
// ITEM LIST TOP-LEVEL ELEMENTS
let _elDiv_ItemWin = document.createElement('div');
_elDiv_ItemWin.className = 'am_item_sel_win';
//// ITEM SELECTION WINDOW
let _elDiv_ItemSelWin = document.createElement('div');
_elDiv_ItemSelWin.className = 'am_item_sel_win';
{
//Window Left side
////// Window Left side
let _elDiv_ItemWinLeft = document.createElement('div');
_elDiv_ItemWinLeft.className = 'winleft';
@@ -889,7 +1267,7 @@ HotelTV.ui_appfull = (function() {
}
else
{
//ADD Table
////// ADD Table Header
var _elTbl_ItemsHdr = document.createElement('table');
_elTbl_ItemsHdr.className = "tbl_header";
@@ -900,17 +1278,17 @@ HotelTV.ui_appfull = (function() {
var _elTr_ItmesHdr = document.createElement('tr');
var _elTh_ItmesHdr_Title = document.createElement('th');
_elTh_ItmesHdr_Title.setAttribute("id", "title");
_elTh_ItmesHdr_Title.textContent = _trTbl.ui.roomservice.title.item[_state.lang];
_elTh_ItmesHdr_Title.textContent = _trTbl.ui.amenity.title.item[_state.lang];
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Title);
var _elTh_ItmesHdr_Amount = document.createElement('th');
_elTh_ItmesHdr_Amount.setAttribute("id", "price");
_elTh_ItmesHdr_Amount.textContent = _trTbl.ui.roomservice.title.amount[_state.lang];
_elTh_ItmesHdr_Amount.textContent = _trTbl.ui.amenity.title.amount[_state.lang];
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Amount);
var _elTh_ItmesHdr_Status = document.createElement('th');
_elTh_ItmesHdr_Status.setAttribute("id", "status");
_elTh_ItmesHdr_Status.textContent = _trTbl.ui.roomservice.title.orderability[_state.lang];
_elTh_ItmesHdr_Status.textContent = _trTbl.ui.amenity.title.orderability[_state.lang];
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Status);
_elTBody_ItmesHdr.appendChild(_elTr_ItmesHdr);
@@ -918,7 +1296,7 @@ HotelTV.ui_appfull = (function() {
_elTbl_ItemsHdr.appendChild(_elTBody_ItmesHdr);
_elDiv_ItemWinLeft.appendChild(_elTbl_ItemsHdr);
// Append item list record
////// Append item list record
var _elTbl_ItemsRec = document.createElement('table');
_elTbl_ItemsRec.className = "tbl_record";
@@ -965,19 +1343,38 @@ HotelTV.ui_appfull = (function() {
}
_elDiv_ItemWinLeft.appendChild(_elTbl_ItemsRec);
}
_elDiv_ItemWin.appendChild(_elDiv_ItemWinLeft);
_elDiv_ItemSelWin.appendChild(_elDiv_ItemWinLeft);
//Window Right side
////// Window Right side
let _elDiv_ItemWinRight = document.createElement('div');
_elDiv_ItemWinRight.className = 'winright';
_elDiv_ItemWin.appendChild(_elDiv_ItemWinRight);
_elDiv_ItemSelWin.appendChild(_elDiv_ItemWinRight);
}
_elDiv_Ctgy.appendChild(_elDiv_ItemWin);
// _elDiv_Ctgy에 추가
_elDiv_Ctgy.appendChild(_elDiv_ItemSelWin);
// Selected Item Cart Window
let _elDiv_SelectedItemWin = document.createElement('div');
_elDiv_SelectedItemWin.className = 'am_item_sel_cart_win';
_elDiv_SelectedItemWin.style.display = 'none';
{
if ( ["ORDER", "CARTS"].includes(_aminfo_ctgy[_idx].name)==false )
{
////// Window Left side
let _elDiv_ItemWinCartLeft = document.createElement('div');
_elDiv_ItemWinCartLeft.className = 'winleft';
_elDiv_SelectedItemWin.appendChild(_elDiv_ItemWinCartLeft);
////// Window Right side
let _elDiv_ItemWinCartRight = document.createElement('div');
_elDiv_ItemWinCartRight.className = 'winright';
_elDiv_SelectedItemWin.appendChild(_elDiv_ItemWinCartRight);
}
}
// _elDiv_Ctgy에 추가
_elDiv_Ctgy.appendChild(_elDiv_SelectedItemWin);
// _elAmCtgyBg에 추가
_elAmCtgyBg.append(_elDiv_Ctgy);
@@ -1045,7 +1442,7 @@ HotelTV.ui_appfull = (function() {
// 카테고리 화면 빌드 및 화면 전환
_state.menu.stage.cur = "amenity_ctgy_item_sel";
__uifxn_AppFull_DrawAmItemSeletion("enter");
__uifxn_AppFull_DrawAmUserGuide();
} else if (event.keyCode == gRmtKey.back) {
// 카테고리 폼의 썸네일 에니메이션용 타이머 제거
if (_hndl_tmrAmenityThumbAni != null) {
@@ -1092,9 +1489,27 @@ HotelTV.ui_appfull = (function() {
} else if (event.keyCode == gRmtKey.down) {
__uifxn_AppFull_DrawAmItemSeletion("down");
} else if (event.keyCode == gRmtKey.back) {
console.log('AMENITY CATEGORY ITEM SEL: KEY::> ' + event.keyCode);
__uifxn_AppFull_DrawAmItemSeletion("exit");
_state.menu.stage.cur = "amenity_ctgy_sel";
} else if (event.keyCode == gRmtKey.enter) {
console.log('AMENITY CATEGORY ITEM SEL: KEY::> ' + event.keyCode);
__uifxn_AppFull_DrawAmItemSeletionCart("cart");
_state.menu.stage.cur = "amenity_ctgy_item_cart";
}
} else if (_state.menu.stage.cur == "amenity_ctgy_item_cart") {
if (event.keyCode == gRmtKey.left) {
__uifxn_AppFull_DrawAmItemSeletionCart("left");
} else if (event.keyCode == gRmtKey.right) {
__uifxn_AppFull_DrawAmItemSeletionCart("right");
} else if (event.keyCode == gRmtKey.up) {
__uifxn_AppFull_DrawAmItemSeletionCart("quantity_plus");
} else if (event.keyCode == gRmtKey.down) {
__uifxn_AppFull_DrawAmItemSeletionCart("quantity_minus");
} else if (event.keyCode == gRmtKey.back) {
__uifxn_AppFull_DrawAmItemSeletionCart("return");
_state.menu.stage.cur = "amenity_ctgy_item_sel";
} else if (event.keyCode == gRmtKey.enter) {
console.log('AMENITY CATEGORY ITEM SEL: KEY::> ' + event.keyCode);
}
} else {
console.log("AMENITY SLIDER KEYEVT: Skip events");
@@ -1102,6 +1517,7 @@ HotelTV.ui_appfull = (function() {
});
//어메니티 카테고리 선택 모드(생성시, 메뉴모드)
_state.menu.stage.cur = "amenity_ctgy_sel";
__uifxn_AppFull_DrawAmUserGuide();
});
})
});
@@ -1168,8 +1584,8 @@ HotelTV.ui_appfull = (function() {
}
// Draw Titile and message
_elRsOderAlertOrderComplete.children("#title").text(_trTbl.ui.roomservice.title.ordercomplete[_state.lang]);
_elRsOderAlertOrderComplete.children("#message").text(_trTbl.ui.roomservice.usage.orderAlertComplete[_state.lang]);
_elRsOderAlertOrderComplete.children("#title").text(_trTbl.ui.amenity.title.ordercomplete[_state.lang]);
_elRsOderAlertOrderComplete.children("#message").text(_trTbl.ui.amenity.usage.orderAlertComplete[_state.lang]);
if (_elRsOderAlertOrderComplete.css('display') == "none") {
_elRsOderAlertOrderComplete.show();

View File

@@ -432,7 +432,7 @@
/********************************************************************************
* AMENITY STYLE [ START HERE] *
********************************************************************************/
/*[AM1. Amenity bg style ] */
/*[AM1. Amenity style ] */
.popup .amenity {
top: 0px;
left: 0px;
@@ -447,6 +447,7 @@
padding: 0;
}
/*[AM1-1. Amenity bg style ] */
.popup .amenity .bg {
position: absolute;
top: 0px;
@@ -465,11 +466,12 @@
padding: 0;
}
/*[AM1-1-1. Amenity bg: owl style ] */
.popup .amenity .bg .owl-carousel .owl-stage .owl-item {
width: 100%;
}
/*[AM1-1-1-1. Amenity bg: owl: top gradient style ] */
.popup .amenity .bg .owl-carousel .owl-stage .top_gradient{
top: 0;
left: 0;
@@ -478,6 +480,7 @@
background: linear-gradient(0deg, rgba(7,8,11,0) 0%, rgba(7,8,11,0.5) 45%, rgba(7,8,11,0.9) 100%);
}
/*[AM1-1-1-2. Amenity bg: owl: bottom gradient style ] */
.popup .amenity .bg .owl-carousel .owl-stage .bottom_gradient{
position: absolute;
left: 0;
@@ -487,7 +490,7 @@
background: linear-gradient(0deg, rgba(7,8,11,0.9) 0%, rgba(7,8,11,0.5) 65%, rgba(7,8,11,0) 100%);
}
/*[AM1-1-1-3. Amenity bg: owl: amenity item sel window ] */
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win {
position: absolute;
left: 21px;
@@ -501,6 +504,7 @@
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win .winleft {
position: relative;
width: 902px;
height: 100%;
margin: 0;
@@ -652,6 +656,7 @@
/**** Amenity Item Description ::> */
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win .winright {
position: relative;
width: 902px;
height: 740px;
margin: 0;
@@ -693,6 +698,7 @@
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win .winright .amItemDescDetails div#description{
height:174px;
line-height: 30px;
font-size: 30px;
white-space: pre-wrap;
@@ -701,10 +707,382 @@
padding: 14px 0px 0px 0px;
}
/*[AM1-1-1-4. Amenity bg: owl: selected item cart style window ] */
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win {
position: absolute;
left: 21px;
top: 207px;
width: 1874px;
height: 740px;
margin: 0;
padding: 0;
/* background: rgba(114,18,22,0.65); */
display: flex;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft {
position: relative;
width: 902px;
height: 100%;
margin: 0;
padding: 0;
background: rgba(14,18,22,0.8);
margin: 0px 10px 0px 25px;
color: rgb(249, 249, 249);
border-top: 5px solid rgba(121,121,121,1);
border-bottom: 5px solid rgba(121,121,121,1);
/* border-top: 6px solid rgba(218,165,32,1);
border-bottom: 6px solid rgba(218,165,32,1); */
/* display: none; */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.title{
height: 54px;
width: 96%;
line-height: 54px;
font-size: 44px;
white-space: pre-wrap;
text-overflow: ellipsis;
overflow: hidden;
border-bottom: 4px solid rgb(235,235,235);
filter: drop-shadow(0 0 5px rgb(0, 0, 0));
margin: 10px 2% 0px 2%;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control{
position: relative;
height: 254px;
width: 96%;
padding: 20px 2% 20px 2%;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control #img_thumbnail{
width: 42%;
height: 228px;
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
float: left;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control>.quantity{
height: 228px;
width: 58%;
display: flex;
float: left;
flex-direction: row;
flex-wrap: wrap;
padding: 0px 30px 0px 30px;
overflow: hidden;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control #lable_quantity{
line-height: 137px;
width: 50%;
height: 60%;
font-size: 38px;
text-align: center;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control #value_quantity{
line-height: 137px;
width: 50%;
height: 60%;
font-size: 52px;
text-align: center;
color: rgba(218,165,32,1.0);
background-image: url(./images/quantity_edit_arrow.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control #lable_amount{
line-height: 91px;
width: 50%;
height: 40%;
font-size: 38px;
text-align: center;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control #value_amount{
line-height: 91px;
width: 50%;
height: 40%;
font-size: 52px;
text-align: center;
color: rgba(218,165,32,1.0);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.description{
height: 316px;
width: 100%;
padding: 20px 2% 20px 2%;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.description>#title{
height: 54px;
width: 100%;
line-height: 54px;
font-size: 44px;
white-space: pre-wrap;
text-overflow: ellipsis;
overflow: hidden;
border-bottom: 4px solid rgb(235,235,235);
filter: drop-shadow(0 0 5px rgb(0, 0, 0));
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.description>#details{
/* height:174px; */
line-height: 30px;
font-size: 30px;
white-space: pre-wrap;
text-overflow: ellipsis;
overflow: hidden;
padding: 14px 0px 0px 0px;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons{
line-height: 65px;
height: 65px;
width: 100%;
display: flex;
float: left;
flex-direction: row;
flex-wrap: nowrap;
padding: 0px 30px 0px 30px;
overflow: hidden;
text-align: center;
font-size: 32px;
color: rgba(51,51,51,1.0);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons>div{
border-radius: 14px;
background-color: rgba(255,255,255,1.0);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons>div.focus{
/*border: 8px solid rgba(218,165,32,1.0); */
/* color: rgba(0,0,0,1); */
/* background-color: rgba(218,165,32,1.0); */
background-color: rgba(173,255,47,1.0);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons #btn_addtocart{
/* border-radius: 14px; */
/* background-color: rgba(255,255,255,1.0); */
margin: 0px 20px 0px 0px;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons #btn_ordernow{
/* border-radius: 14px; */
/* background-color: rgba(255,255,255,1.0); */
margin: 0px 20px 0px 20px;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons #btn_back{
/* border-radius: 14px; */
/* background-color: rgba(255,255,255,1.0); */
margin: 0px 0px 0px 20px;
}
/** Amenity slider style */
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright {
position: relative;
width: 902px;
height: 740px;
margin: 0;
padding: 0;
background: rgba(14,18,22,0.8);
margin: 0px 25px 0px 10px;
color: rgb(249, 249, 249);
border-top: 5px solid rgba(121,121,121,1);
border-bottom: 5px solid rgba(121,121,121,1);
/* border-top: 6px solid rgba(218,165,32,1);
border-bottom: 6px solid rgba(218,165,32,1); */
/* display: none; */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.title{
height: 54px;
width: 96%;
line-height: 54px;
font-size: 44px;
white-space: pre-wrap;
text-overflow: ellipsis;
overflow: hidden;
border-bottom: 4px solid rgb(235,235,235);
filter: drop-shadow(0 0 5px rgb(0, 0, 0));
margin: 10px 2% 0px 2%;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table{
position: relative;
height: 550px;
width: 100%;
padding: 20px 2% 20px 2%;
}
/**** Amenity Category item ::> Table Header */
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header {
width:100%;
line-height: 54px;
font-size: 30px;
text-align: center;
/* margin: 5px 0 15px 0; */
border-bottom: 4px solid rgba(121,121,121,1);
/* border-top: 2px solid rgba(121,121,121,1); */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr {
height: 54px;
max-height: 54px;
background-color: rgba(21, 27, 34, 1);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr>#title {
width: 50%;
float: left;
/* text-align: left; */
padding: 0 0px 0 80px;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr>#quantity {
width: 25%;
float: left;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr>#amount {
width: 25%;
float: left;
padding: 0px 30px 0 0px;
}
/**** Amenity Category item ::> Table Recored */
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record {
/* height: 284px;*/
width:100%;
line-height: 54px;
font-size: 30px;
text-align: center;
/* margin: 5px 0 15px 0; */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody {
/* height: 285px; */
overflow-y: auto;
display: block;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr {
/* height: 52px; */
display: block;
background-color: rgba(36, 45, 57, 1);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr>.cartItem {
height: 52px;
width: 100%;
font-size: 30px;
/* line-height: 54px; */
border-bottom: 2px solid rgb(21, 27, 34);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr>.cartItem.focus {
/* border-bottom: 2px solid rgb(255, 192, 0); */
border-bottom: 2px solid rgb(173, 255, 47);
background: rgba(29,36,47,1.0);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr>.cartItem.unavailable {
/* border-bottom: 2px solid rgb(255, 192, 0); */
background: rgba(21,27,34,1.0);
color: rgb(121, 121, 121);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr>.cartItem.focus.unavailable {
/* border-bottom: 2px solid rgb(255, 192, 0); */
border-bottom: 2px solid rgb(173, 255, 47);
background: rgba(21,27,34,1.0);
color: rgb(121, 121, 121);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr>.cartItem>#title {
width: 50%;
float: left;
padding: 0px 0px 0px 20px;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr>.cartItem>#quantity {
width: 20%;
float: left;
text-align: center;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record tbody tr>.cartItem>#amount {
width: 30%;
float: left;
/* text-align: right; */
padding: 0px 30px 0 0px;
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record ::-webkit-scrollbar {
display: block;
width: 20px;
/* 세로축 스크롤바 길이 */
height: 20px;
/* 가로축 스크롤바 길이 */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record ::-webkit-scrollbar-track {
background-color: rgb(67, 82, 105);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record ::-webkit-scrollbar-track-piece {
background-color: rgb(80, 98, 124);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record ::-webkit-scrollbar-thumb {
border-radius: 8px;
background-color: rgb(51, 63, 80);
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record ::-webkit-scrollbar-button:start {
display: none;
/* background-color: orange; */
/* Top, Left 방향의 이동버튼 */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_record ::-webkit-scrollbar-button:end {
display: none;
/* background-color: orange; */
/* Bottom, Right 방향의 이동버튼 */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.summary{
position: relative;
height: 65px;
width: 96%;
padding: 20px 2% 20px 2%;
/* background: blue; */
}
/********************************************************************************/
/*[AM2. Amenity slider style ] */
.popup .amenity .slider {
position: absolute;
top: 60px;
@@ -821,6 +1199,69 @@
padding: 0;
}
/*[AMx. Amenity cart style ] */
.popup .amenity>div.cart {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 946px;
padding: 0px;
overflow: hidden;
display: none;
background: rgba(0,0,0,0.7);
z-index: 1;
}
.popup .amenity>div.cart>div {
top: 60px;
left: 0px;
width: 100%;
height: 100%;
display: flex;
/* background: rgba(1,1,1,1.0); */
}
.popup .amenity>div.cart .menu {
width: 902px;
height: 876px;
margin: 0px 37px 0px 21px;
display: block;
/* background: rgba(100,1,1,1.0); */
}
.popup .amenity>div.cart .items {
width: 902px;
height: 876px;
margin: 0px 37px 0px 21px;
display: block;
/* background: rgba(100,1,1,1.0); */
}
.popup .amenity>div.cart .menu div#title {
}
.popup .amenity>div.cart .menu div#control {
}
.popup .amenity>div.cart .menu div#control #thumb {
}
.popup .amenity>div.cart .menu div#control #quantity {
}
.popup .amenity>div.cart .menu div#description {
}
/********************************************************************************/
/* AMENITY STYLE [ END ] */
/********************************************************************************/

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB