1// article-detail.js 2Vue.component('article-detail',{ 3 template:'\ 4 <div v-if="article" :class="\'article-detail\' + (mobile ? \' ss-article-mobile\' : \'\')">\ 5 <div v-for="block of article.blocks">\ 6 <div v-html="block.client_html"></div>\ 7 </div>\ 8 <div class="staff-contents-block-article-warning">â»ããã°ã®å 容ãååã¹ããã¯ãä¾¡æ ¼çã®æ å ±ã¯æ²è¼æç¹ã®ãã®ã§ãã</div>\ 9 </div>\ 10 ', 11 props: ['article', 'mobile'], 12 mounted(){ 13 this.prefix = document.title.split("ããã°è©³ç´°")[0] 14 this.suffix = document.title.split("ããã°è©³ç´°")[1] 15 document.title = this.prefix + document.getElementsByClassName("article-info--title")[0].innerHTML + this.suffix 16 }, 17});// article-info.js 18Vue.component('article-info',{ 19 template:'\ 20 <div v-if="article" class="article-info">\ 21 <p class="article-info--date">{{ ecblib.staffstart.util.formatDate(article.latest_published_at) }}</p>\ 22 <h1 class="article-info--title">{{ article.title }}</h1>\ 23 <div class="ss-content-area content-area-description">\ 24 <p class="article-description">{{ article.description }}</p>\ 25 </div>\ 26 <br>\ 27 <br>\ 28 <slot></slot>\ 29 <br>\ 30 <br>\ 31 <div v-if="article" :class="\'article-info-staff\' + (mobile ? \'-mobile\' : \'\')">\ 32 <a class="article-info-staff--img" :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + article.user.user_id">\ 33 <img :src="article.user && article.user.image_url ? article.user.image_url : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³" />\ 34 </a>\ 35 <a class="article-info-staff--description" :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + article.user.user_id">\ 36 <p class="article-info-staff--shop">{{ article.shop.name }}</p>\ 37 <p class="article-info-staff--label">{{ article.label.name }}</p>\ 38 <p class="article-info-staff--name">{{ article.user.name }}</p>\ 39 </a>\ 40 </div>\ 41 <div class="article-info-bookmark" v-if="bookmarkid" :class="\'article-info-bookmark\' + (mobile ? \'-mobile\' : \'\')">\ 42 <a data-type="article" :data-code="article.article_id" @click="registBookmark" :class="bookmarkid > 0 ? \'article-info-bookmark-registed\' : \'\'" :key="key">\ 43 <img v-if="bookmarkid > 0" :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue_check.png\'" alt="ãæ°ã«å ¥ã">\ 44 <img v-else :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue.png\'" alt="ãæ°ã«å ¥ã">\ 45 <span>{{ bookmarkid > 0 ? \'ãæ°ã«å ¥ãç»é²æ¸\' : \'ãæ°ã«å ¥ãç»é²\' }}</span>\ 46 </a>\ 47 </div>\ 48 <div v-if="article.tags.length > 0" class="article-detail-keyword">\ 49 <ul class="keyword-tag-list">\ 50 <li v-for="tag in article.tags" :key="tag" class="keyword-tag-item">\ 51 <a :href="ecblib.staffstart.uri.articleList + \'?tag_id=\' + tag.tag_id + \'&tag_name=\' + encodeURI(tag.name) + \'&sort=latest-published\'">{{ tag.name }}</a>\ 52 </li>\ 53 </ul>\ 54 </div>\ 55 </div>\ 56 ', 57 props: ['article', 'mobile'], 58 created: async function() { 59 const result = await ecblib.staffstart.util.StaffStart_GetBookmark('article', this.article.article_id); 60 if(result){ 61 this.dispFlag = true; 62 this.bookmarkid = result; 63 }; 64 }, 65 data: function() { 66 return { 67 dispFlag: undefined, 68 key: 1, 69 bookmarkid: 0, 70 }; 71 }, 72 methods: { 73 registBookmark: async function(e) { 74 var result = await ecblib.staffstart.util.StaffStart_RegistBookmark(e.currentTarget, this.bookmarkid); 75 if(result.result) { 76 this.bookmarkid = result.bookmarkid; 77 this.key = this.key + 1; 78 } 79 }, 80 }, 81}); 82// article-list.js 83Vue.component('article-list', { 84 template: '\ 85 <div :class="\'article-list\' + (detail ? \'__detail\' : \'\')">\ 86 <div class="card-list-frame">\ 87 <p v-if="!init">\ 88 <strong>æ¤ç´¢ä¸...</strong>\ 89 </p>\ 90 <p v-else-if="items.length == 0">\ 91 <strong v-if="notFoundMessage != null">{{notFoundMessage}}</strong>\ 92 <strong v-else>ãæå®ã®æ¡ä»¶ã«ä¸è´ããããã°ãè¦ã¤ããã¾ããã§ããã</strong>\ 93 </p>\ 94 <div v-for="item in items" :key="item.article_id" v-if="item.article_id != excludeId" :class="\'article-item\' + (mobile ? \'-mobile\' : \'\')">\ 95 <div class="article-item--main-img">\ 96 <figure>\ 97 <a :href="ecblib.staffstart.uri.articleDetail + \'?ss_article_id=\' + item.article_id">\ 98 <img :src="item.resized_main_images && item.resized_main_images.m ? item.resized_main_images.m : ecblib.staffstart.uri.sorryImg" alt="ããã°ã®ã¤ã¡ã¼ã¸"/>\ 99 </a>\ 100 </figure>\ 101 </div>\ 102 <div class="article-item--articletitle">\ 103 <a :href="ecblib.staffstart.uri.articleDetail + \'?ss_article_id=\' + item.article_id">\ 104 {{item.title}}\ 105 </a>\ 106 </div>\ 107 <div class="article-item--description">\ 108 <div class="article-item--description--staff-icon">\ 109 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user.user_id">\ 110 <img :src="item.user && item.user.image_url ? item.user.image_url : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³"/>\ 111 </a>\ 112 </div>\ 113 <div class="article-item--info">\ 114 <div class="article-item--info--blandname">{{ item.label.name }}</div>\ 115 <div class="article-item--info--shopname">{{ item.shop.name }}</div>\ 116 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user.user_id">\ 117 <div class="article-item--info--staffname">{{ item.user.name }}</div>\ 118 </a>\ 119 </div>\ 120 </div>\ 121 <div class="article-item--info--releasedate">{{ ecblib.staffstart.util.formatDate(item.latest_published_at) }}</div>\ 122 </div>\ 123 </div>\ 124 <div v-if="hasPagination()" class="see-more-btn-block">\ 125 <button type="button" :class="\'see-more-btn\' + (mobile ? \'-mobile\' : \'\')" @click="addPage()">ãã£ã¨è¦ã</button>\ 126 </div>\ 127 <div v-else-if="hasDetail()" class="seemore">\ 128 <a :href="getLocation()">ãã£ã¨è¦ã</a>\ 129 </div>\
130 </div>\ 131 ', 132 props: ['value', 'condition', 'excludeId', 'itemsPerPage', 'disablePagination', 'notFoundMessage', 'detail', 'mobile', 'disableDetail', 'listType'], 133 data: function() { 134 return { 135 items: [], 136 displayLimit: 20, 137 total: 0, 138 init: false 139 }; 140 }, 141 created: function() { 142 this.setOptions(); 143 this.getArticles(); 144 this.setMeta(); 145 }, 146 mounted(){ 147 this.prefix = document.title.split("ããã°ä¸è¦§")[0] 148 this.suffix = document.title.split("ããã°ä¸è¦§")[1] 149 }, 150 methods: { 151 setOptions: function() { 152 this.displayLimit = this.itemsPerPage || 20; 153 }, 154 getArticles: function () { 155 ecblib.staffstart.util.setCanonical(); 156 const _self = this; 157 const url = ecblib.staffstart.api.url.articleList; 158 159 const condition = JSON.parse(JSON.stringify(this.condition)); 160 if (this.displayLimit > 0) { 161 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 162 condition.count = this.displayLimit * (condition[pageindexKey] || 1) + ( this.excludeId ? 1 : 0); 163 } 164 165 ecblib.staffstart.util.ajaxGet(url, condition, 166 function (data) { 167 const ret = _self._checkAndModifyList_fromExcludeId(data.item); 168 169 _self.items = ret.list; 170 _self.total = data.total - (ret.exist ? 1 : 0); 171 _self.$emit('input', _self.total); 172 _self.init = true; 173 }, 174 function () { 175 _self.items = []; 176 _self.total = 0; 177 _self.$emit('input', 0); 178 _self.init = true; 179 } 180 ); 181 }, 182 setMeta :function(){ 183 if (location.href.indexOf("articlelist.aspx") < 0){ 184 return 185 } 186 187 const condition = JSON.parse(JSON.stringify(this.condition)); 188 var breadAddElement = document.getElementsByClassName("bread-crumb-item-add"); 189 if (breadAddElement.length > 0) { 190 breadAddElement[0].remove(); 191 } 192 193 var contentTitleAddElement = document.getElementsByClassName("content-title-add"); 194 if (contentTitleAddElement.length > 0) { 195 contentTitleAddElement[0].remove(); 196 } 197 198 if ((condition.size !== undefined && condition.size.length > 0) || condition.tag_id != null || condition.feature != null || condition.label_code != null || condition.shop_code != null){ 199 var searchCondition = ""; 200 201 if (condition.tag_id != null){ 202 var tagClass = document.getElementsByClassName("selected-tag-tag"); 203 for (var i = 0; i < tagClass.length; i++){ 204 var tagName = tagClass[i].children[0].textContent.replace("/ /g", "") 205 206 if (searchCondition == ""){ 207 searchCondition += tagName 208 } 209 else{ 210 searchCondition += "," + tagName 211 } 212 } 213 } 214 215 if (condition.size.length > 0){ 216 var sizeLen = ecblib.staffstart.master.user.size.items.length; 217 for (var i = 0; i < condition.size.length;i++ ){ 218 219 var sizeName = ""; 220 for(var j =0; j < sizeLen; j++){ 221 if (condition.size[i] == ecblib.staffstart.master.user.size.items[j].id){ 222 sizeName = ecblib.staffstart.master.user.size.items[j].name; 223 break; 224 } 225 } 226 227 if (searchCondition == ""){ 228 searchCondition += sizeName 229 } 230 else{ 231 searchCondition += "," + sizeName 232 } 233 } 234 } 235 236 if (condition.feature != null){ 237 var featureName = ""; 238 var featureLen = ecblib.staffstart.master.user.feature.items.length; 239 for(var i =0; i < featureLen; i++){ 240 if (condition.feature == ecblib.staffstart.master.user.feature.items[i].id){ 241 featureName = ecblib.staffstart.master.user.feature.items[i].name; 242 break; 243 } 244 } 245 246 if (searchCondition == ""){ 247 searchCondition += featureName 248 } 249 else{ 250 searchCondition += "," + featureName 251 } 252 } 253 254 if (condition.label_code != null){ 255 var labelName = ""; 256 var labelLen = ecblib.staffstart.master.labels.length; 257 for(var i =0; i < labelLen; i++){ 258 if (condition.label_code == ecblib.staffstart.master.labels[i].id){ 259 labelName = ecblib.staffstart.master.labels[i].name; 260 break; 261 } 262 } 263 264 if (searchCondition == ""){ 265 searchCondition += labelName 266 } 267 else{ 268 searchCondition += "," + labelName 269 } 270 } 271 272 if (condition.shop_code != null){ 273 var shopName = ""; 274 var shopLen = ecblib.staffstart.master.shops.length; 275 for(var i =0; i < shopLen; i++){ 276 if (condition.shop_code == ecblib.staffstart.master.shops[i].id){ 277 shopName = ecblib.staffstart.master.shops[i].name; 278 break; 279 } 280 } 281 if (searchCondition == ""){ 282 searchCondition += shopName 283 } 284 else{ 285 searchCondition += "," + shopName 286 } 287 } 288 289 jQuery('.bread-crumb-list').append(' <li class="bread-crumb-item-add"><span> > '+ searchCondition + '</span></li>'); 290 jQuery('.staff-contents-content-title').append(' <span class ="content-title-add"> > '+ searchCondition + '</span>'); 291 292 if (this.prefix != undefined || this.suffix != undefined){ 293 document.title = this.prefix + searchCondition + this.suffix; 294 } 295 } 296 else{ 297 if (this.prefix != undefined || this.suffix != undefined){ 298 document.title = this.prefix + 'ããã°ä¸è¦§' + this.suffix; 299 } 300 } 301 }, 302 hasPagination: function() { 303 if (this.disablePagination) return false; 304 305 return this.total > this.items.length; 306 }, 307 hasDetail: function() { 308 if (this.disableDetail) return false; 309 310 return this.total > this.items.length; 311 }, 312 addPage: function() { 313 const _self = this; 314 const url = ecblib.staffstart.api.url.articleList; 315 316 const condition = JSON.parse(JSON.stringify(this.condition)); 317 if (!this.disablePagination) { 318 condition.count = this.displayLimit + ( this.excludeId ? 1 : 0); 319 condition.offset = this.items.length; 320 321 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 322 if (this.condition[pageindexKey]) { 323 this.condition[pageindexKey]++; 324 } 325 else { 326 this.condition[pageindexKey] = 2; 327 } 328 ecblib.staffstart.util.pushHistoryPageIndex(pageindexKey, this.condition); 329 } 330 331 ecblib.staffstart.util.ajaxGet(url, condition, 332 function (data) { 333 const ret = _self._checkAndModifyList_fromExcludeId(data.item); 334 335 _self.items = _self.items.concat(ret.list); 336 if (ret.exist) { 337 _self.$emit('input', --_self.total); 338 } 339 }, 340 function () { 341 _self.total = _self.items.length; 342 _self.$emit('input', _self.total); 343 } 344 ); 345 }, 346 _checkAndModifyList_fromExcludeId: function(items) { 347 const _self = this; 348 const type = (this.listType ? "_" + this.listType : "") ; 349 if (this.excludeId == null) { 350 return {exist: false, list: items.splice(0, this.displayLimit * (this.condition["ss_pageindex" + type] || 1))}; 351 } 352 return items.some(function(i) { return i.article_id == _self.excludeId; }) ? 353 {exist: true, list: items} : 354 {exist: false, list: items.splice(0, this.displayLimit)}; 355 }, 356 getLocation: function() { 357 var baseUrl = ''; 358 var urlParam = ''; 359 var addParam = {}; 360 const condition = JSON.parse(JSON.stringify(this.condition)); 361 if(location.href.indexOf('default.aspx') >= 0){ 362 baseUrl = 'pages/articlelist.aspx'; 363 }
363else if(location.href.match(/\/.\//)){ 364 baseUrl = '../../pages/articlelist.aspx'; 365 }else{ 366 baseUrl = '../pages/articlelist.aspx'; 367 } 368 if(condition.product_code){ 369 addParam['product_code'] = condition.product_code; 370 } 371 if(condition.sort){ 372 addParam['sort'] = condition.sort; 373 } 374 urlParam = new URLSearchParams(addParam).toString(); 375 if(urlParam){ 376 return baseUrl + '?' + urlParam; 377 }else{ 378 return baseUrl; 379 } 380 }, 381 getSize: function(item){ 382 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 383 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.size.id){ 384 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value + item.user_attributes[i].user_attribute_type.unit; 385 } 386 } 387 return ''; 388 }, 389 getFeature: function(item){ 390 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 391 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.feature.id){ 392 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 393 } 394 } 395 return ''; 396 }, 397 }, 398 watch: { 399 condition: function() { 400 if(!this.disablePagination){ 401 this.getArticles(); 402 this.setMeta(); 403 } 404 } 405 } 406}); 407// applicable-count.js 408Vue.component('applicable-count', { 409template: '\ 410<div>\ 411 <dl class="applicable-count-item-number-box" v-if="!mobile">\ 412 <dt>対象</dt>\ 413 <dd>\ 414 <span>{{ count }}</span>件\ 415 </dd>\ 416 </dl>\ 417 <div v-if="mobile" class="applicable-count-item-number-box-mobile">\ 418 <span class="count">{{ count }}</span>件ããã¾ã\ 419 </div>\ 420</div>\ 421', 422props: ['count', 'mobile'] 423}); 424// brand-select.js 425Vue.component('brand-select', { 426template: '\ 427<div class="brand-select">\ 428 <ul v-if="!mobile" class="brand-select-list">\ 429 <li v-for="brand in brands" @click="selectItem(brand)" :class="getItemClass(brand)">{{ brand.name }}</li>\ 430 </ul>\ 431 <div v-if="mobile" class="brand-select-frame-sp">\ 432 <select class="brand-select-pulldown" v-model="selectValue">\ 433 <option :value="0">é¸æãªã</option>\ 434 <option v-for="brand in brands" :value="brand.id">{{ brand.name }}</option>\ 435 </select>\ 436 <div class="brand-search-btn" @click="_click()">æ¤ç´¢</div>\ 437 </div>\ 438</div>\ 439', 440props: ['value', 'mobile'], 441data: function() { 442 return { 443 brand: null, 444 brands: [], 445 selectValue: '0' 446 }; 447}, 448created: function() { 449 this.getBrand(); 450}, 451methods: { 452 getBrand: function() { 453 this.brands = ecblib.staffstart.master.brands; 454 }, 455 456 selectItem: function(brand) { 457 if (this.brand && this.brand.id == brand.id) { 458 this.brand = null; 459 } else { 460 this.brand = brand; 461 } 462 463 this.$emit('input', this.brand); 464 }, 465 _click: function() { 466 const _self = this; 467 468 if (this.selectValue == '0') { 469 this.brand = null; 470 } else { 471 this.brand = ecblib.staffstart.util.arrayFind(this.brands, function(i) {return i.id == _self.selectValue; }); 472 } 473 474 this.$emit('input', this.brand); 475 }, 476 477 getItemClass: function(brand) { 478 let result = 'brand-select-item'; 479 480 if (this.mobile) { 481 result += '-mobile'; 482 } 483 if (this.brand && this.brand.id == brand.id) { 484 result += ' brand-select-item__selected'; 485 } 486 487 return result; 488 } 489} 490}); 491// bread-crumb.js 492Vue.component('bread-crumb', { 493template: '\ 494<div class="block-bread-crumb-frame">\ 495 <ul class="bread-crumb-list">\ 496 <li v-for="page in pages" :key="page.name" class="bread-crumb-item">\ 497 <a :href="page.url">\ 498 <span>{{ page.name }}</span>\ 499 </a>\ 500 </li>\ 501 </ul>\ 502</div>\ 503', 504props: ['pages', 'mobile'] 505}); 506// label-select.js 507Vue.component('label-select', { 508template: '\ 509<div class="brand-select">\ 510 <ul v-if="!mobile" class="brand-select-list">\ 511 <li v-for="label in labels" @click="selectItem(label)" :class="getItemClass(label)">{{ label.name }}</li>\ 512 </ul>\ 513 <div v-if="mobile" class="brand-select-frame-sp">\ 514 <select class="brand-select-pulldown" v-model="selectValue">\ 515 <option :value="0">
515é¸æãªã</option>\ 516 <option v-for="label in labels" :value="label.id">{{ label.name }}</option>\ 517 </select>\ 518 <div class="label-search-btn" @click="_click()">æ¤ç´¢</div>\ 519 </div>\ 520</div>\ 521', 522props: ['value', 'mobile'], 523data: function() { 524 return { 525 label: null, 526 labels: [], 527 selectValue: '0' 528 }; 529}, 530created: function() { 531 this.getLabel(); 532}, 533methods: { 534 getLabel: function() { 535 this.labels = ecblib.staffstart.master.labels; 536 }, 537 538 selectItem: function(label) { 539 if (this.label && this.label.id == label.id) { 540 this.label = null; 541 } else { 542 this.label = label; 543 } 544 545 this.$emit('input', this.label); 546 }, 547 _click: function() { 548 const _self = this; 549 550 if (this.selectValue == '0') { 551 this.label = null; 552 } else { 553 this.label = ecblib.staffstart.util.arrayFind(this.labels, function(i) {return i.id == _self.selectValue; }); 554 } 555 556 this.$emit('input', this.label); 557 }, 558 559 getItemClass: function(label) { 560 let result = 'brand-select-item'; 561 562 if (this.mobile) { 563 result += '-mobile'; 564 } 565 if (this.label && this.label.id == label.id) { 566 result += ' brand-select-item__selected'; 567 } 568 569 return result; 570 } 571} 572}); 573// popular-keyword-tags.js 574Vue.component('popular-keyword-tags', { 575template: '\ 576<div :class="mobile ? \'popular-keyword-mobile\' : \'popular-keyword\'">\ 577 <div :class="mobile ? \'popular-keyword-label-block-mobile\' : \'popular-keyword-label-block\'">\ 578 <span class="popular-keyword-label">人æ°ã®ãã¼ã¯ã¼ã</span>\ 579 </div>\ 580 <div class="popular-keyword-tags-block">\ 581 <ul>\ 582 <li v-for="item in items" :key="item.tag_id">\ 583 <span @click="$emit(\'input\', valueType ? item[valueType] : item)">\ 584 {{ item.tag_name }}\ 585 </span>\ 586 </li>\ 587 </ul>\ 588 </div>\ 589</div>\ 590', 591props: ['value', 'valueType', 'mobile', 'itemsPerPage', 'contentType'], 592data: function() { 593 return { 594 items: [] 595 }; 596}, 597created: function() { 598 this.getTags(); 599}, 600methods: { 601 getTags: function () { 602 const _self = this; 603 const url = ecblib.staffstart.api.url.rankingTags; 604 605 ecblib.staffstart.util.ajaxGet(url, {count : (_self.itemsPerPage ? _self.itemsPerPage : 15), content_type : _self.contentType}, function (data) { _self.items = data.item; }); 606 607 // _self.items = [ 608 // { 609 // "tag_id": 10969, 610 // "tag_name": "ã¸ã£ã±ãã" 611 // }, 612 // { 613 // "tag_id": 10972, 614 // "tag_name": "ã¹ãã¼ã«ã¼" 615 // }, 616 // { 617 // "tag_id": 9999, 618 // "tag_name": "ããã¼" 619 // }, 620 // { 621 // "tag_id": 19999, 622 // "tag_name": "ããã¼" 623 // }, 624 // { 625 // "tag_id": 29999, 626 // "tag_name": "ããã¼" 627 // }, 628 // { 629 // "tag_id": 39999, 630 // "tag_name": "ããã¼" 631 // }, 632 // { 633 // "tag_id": 49999, 634 // "tag_name": "ããã¼" 635 // }, 636 // ]; 637 }, 638} 639}); 640 641// format-select 642Vue.component('format-select', { 643template: '\ 644<div>\ 645 <div class="list-d-switching">\ 646 <div class="list-d-now-select ico-normal"><span>é常</span></div>\ 647 <ul>\ 648 <li v-for="format in format" :id="format.id" :class="format.class"><span>{{ format.name }}</span></li>\ 649 </ul>\ 650</div>\ 651</div>\ 652', 653data: function() { 654 return { 655 format: [], 656 }; 657}, 658created: function() { 659 this.getFormat(); 660}, 661methods: { 662 getFormat: function() { 663 this.format = ecblib.staffstart.master.format; 664 }, 665}, 666}); 667 668// sort-select.js 669Vue.component('sort-select', { 670template: '\ 671<div>\ 672 <select :class="mobile ? \'sort-selectbox-mobile\' : \'sort-selectbox\'" :value="value" @change="$emit(\'input\', $event.target.value)">\ 673 <option v-for="sortType in sortTypes" :key="sortType.id" :value="sortType.id">{{ sortType.name }}</option>\ 674 </select>\ 675</div>\ 676', 677props: ['value', 'mobile', 'sortTypes'] 678}); 679// staffcontent-notfound.js 680Vue.component('staffcontent-notfound', { 681template: '\ 682<div class="block-common-alert">\ 683 <p class="block-common-alert--message"><slot></slot></p>\ 684 <a class="block-common-alert--link" :href="ecblib.staffstart.uri.home">ãã¼ã ã¸æ»ã</a>\ 685</div>\ 686', 687props: ['value', 'mobile'] 688}); 689// age.js 690Vue.component('search-condition-age', { 691template: '\ 692<div class="search-condition-age">\ 693 <div :class="getLabelClass()" @click="isShow = !isShow">年代</div>\ 694 <transition name="slide">\ 695 <ul v-show="!mobile || isShow" class="menubox-list">\ 696 <li v-for="age in ages" :key="age.id" class="menubox-item">\ 697 <label>\ 698 <input\ 699 type="radio"\ 700 name="age"\ 701 :value="JSON.stringify(age.age)"\ 702 :checked="JSON.stringify(value) == JSON.stringify(age.age)"\ 703 @change="$emit(\'input\', JSON.parse($event.target.value))"\ 704 />\
705 <span>{{ age.name }}</span>\ 706 </label>\ 707 </li>\ 708 </ul>\ 709 </transition>\ 710</div>\ 711', 712props: ['value', 'mobile'], 713data: function() { 714 return { 715 ages: [], 716 isShow: false, 717 }; 718}, 719created: function() { 720 this.getAge(); 721}, 722methods: { 723 getAge: function() { 724 this.ages = ecblib.staffstart.master.ages.items; 725 }, 726 getLabelClass: function() { 727 let result = ''; 728 729 if (this.mobile) { 730 result += ' label-mobile'; 731 732 if (this.isShow) { 733 result += ' label-mobile__open'; 734 } 735 } else { 736 result += ' label'; 737 } 738 739 return result; 740 }, 741}, 742watch: { 743 value: function(newValue) { 744 if (newValue.min === null && newValue.max === null) { 745 const _self = this; 746 747 // åæç»ãå¼·å¶ 748 const ageData = JSON.parse(JSON.stringify(this.ages)); 749 this.ages = []; 750 this.$nextTick(function() { 751 _self.ages = ageData; 752 }); 753 } 754 }, 755}, 756}); 757// brand-single.js 758Vue.component('search-condition-brand-single', { 759template: '\ 760<div class="search-condition-brand-single">\ 761 <div :class="getLabelClass()" @click="isShow = !isShow">ãã©ã³ã</div>\ 762 <transition name="slide">\ 763 <ul v-show="!mobile || isShow" class="menubox-list">\ 764 <li v-for="brand in brands" :key="brand.id" class="menubox-item">\ 765 <label>\ 766 <input type="radio" :value="brand.id" :checked="value === brand.id" @change="$emit(\'input\', $event.target.value)" />\ 767 <span>{{ brand.name }}</span>\ 768 </label>\ 769 </li>\ 770 </ul>\ 771 </transition>\ 772</div>\ 773', 774props: ['value', 'mobile'], 775data: function() { 776 return { 777 brands: [], 778 isShow: false, 779 }; 780}, 781created: function() { 782 this.getBrand(); 783}, 784methods: { 785 getBrand: function() { 786 this.brands = ecblib.staffstart.master.brands; 787 }, 788 getLabelClass: function() { 789 let result = ''; 790 791 if (this.mobile) { 792 result += ' label-mobile'; 793 794 if (this.isShow) { 795 result += ' label-mobile--open'; 796 } 797 } else { 798 result += ' label'; 799 } 800 801 return result; 802 }, 803} 804}); 805 806// brand.js 807Vue.component('search-condition-brand', { 808template: '\ 809<div class="search-condition-brand">\ 810 <div :class="getLabelClass()" @click="isShow = !isShow">ãã©ã³ã</div>\ 811 <transition name="slide">\ 812 <ul v-show="!mobile || isShow" class="menubox-list">\ 813 <li v-for="brand in brands" :key="brand.id" class="menubox-item">\ 814 <label>\ 815 <input type="checkbox" :value="brand.id" :checked="value && value.some(function(id){return id == brand.id;})" @change="changeBrand(brand.id)" />\ 816 <span>{{ brand.name }}</span>\ 817 </label>\ 818 </li>\ 819 </ul>\ 820 </transition>\ 821</div>\ 822', 823props: ['value', 'mobile'], 824data: function() { 825 return { 826 brands: [], 827 isShow: false, 828 }; 829}, 830created: function() { 831 this.getBrand(); 832}, 833methods: { 834 getBrand: function() { 835 this.brands = ecblib.staffstart.master.brands; 836 }, 837 changeBrand: function(id) { 838 if(!this.value) return; 839 const _self = this; 840 841 var index = -1; 842 const isChecked = this.value.some(function(brandId, i){ 843 if(brandId == id) { 844 index = i; 845 return true; 846 } 847 }); 848 849 if (!isChecked && this.value.length >= 10) { 850 alert('åæã«é¸æã§ãããã©ã³ãæ¡ä»¶ã¯10件ã¾ã§ã§ãã'); 851 852 // åæç»ãå¼·å¶ 853 const brandData = JSON.parse(JSON.stringify(this.brands)); 854 this.brands = []; 855 856 this.$nextTick(function(){ 857 _self.brands = brandData; 858 }); 859 } else { 860 const result = isChecked ? this.value.filter(function(brandId){return brandId !== id;}) : this.value.concat([id]); 861 862 this.$emit('input', result); 863 } 864 }, 865 getLabelClass: function() { 866 let result = ''; 867 868 if (this.mobile) { 869 result += ' label-mobile'; 870 871 if (this.isShow) { 872 result += ' label-mobile--open'; 873 } 874 } else { 875 result += ' label'; 876 } 877 878 return result; 879 }, 880} 881}); 882 883// label-single.js 884Vue.component('search-condition-label-single', { 885template: '\ 886<div class="search-condition-brand-single">\ 887 <div :class="getLabelClass()" @click="isShow = !isShow">ãã©ã³ãã·ã§ãã</div>\ 888 <transition name="slide">\ 889 <ul v-show="!mobile || isShow" class="menubox-list">\ 890 <li v-for="label in labels" :key="label.id" class="menubox-item">\ 891 <label>\ 892 <input type="radio" :value="label.id" :checked="value === label.id" @change="$emit(\'input\', $event.target.value)" />\
893 <span>{{ label.name }}</span>\ 894 </label>\ 895 </li>\ 896 </ul>\ 897 </transition>\ 898</div>\ 899', 900props: ['value', 'mobile'], 901data: function() { 902 return { 903 labels: [], 904 isShow: false, 905 }; 906}, 907created: function() { 908 this.getLabel(); 909}, 910methods: { 911 getLabel: function() { 912 this.labels = ecblib.staffstart.master.labels; 913 }, 914 getLabelClass: function() { 915 let result = ''; 916 917 if (this.mobile) { 918 result += ' label-mobile'; 919 920 if (this.isShow) { 921 result += ' label-mobile--open'; 922 } 923 } else { 924 result += ' label'; 925 } 926 927 return result; 928 }, 929} 930}); 931 932// label.js 933Vue.component('search-condition-label', { 934template: '\ 935<div class="search-condition-label">\ 936 <div :class="getLabelClass()" @click="isShow = !isShow">ãã©ã³ã</div>\ 937 <transition name="slide">\ 938 <ul v-show="!mobile || isShow" class="menubox-list">\ 939 <li v-for="label in labels" :key="label.id" class="menubox-item">\ 940 <label>\ 941 <input type="checkbox" :value="label.id" :checked="value && value.some(function(id){return id == label.id;})" @change="changeLabel(label.id)" />\ 942 <span>{{ label.name }}</span>\ 943 </label>\ 944 </li>\ 945 </ul>\ 946 </transition>\ 947</div>\ 948', 949props: ['value', 'mobile'], 950data: function() { 951 return { 952 labels: [], 953 isShow: false, 954 }; 955}, 956created: function() { 957 this.getLabel(); 958}, 959methods: { 960 getLabel: function() { 961 this.labels = ecblib.staffstart.master.labels; 962 }, 963 changeLabel: function(id) { 964 if(!this.value) return; 965 const _self = this; 966 967 var index = -1; 968 const isChecked = this.value.some(function(labelId, i){ 969 if(labelId == id) { 970 index = i; 971 return true; 972 } 973 }); 974 975 if (!isChecked && this.value.length >= 10) { 976 alert('åæã«é¸æã§ãããã©ã³ãæ¡ä»¶ã¯10件ã¾ã§ã§ãã'); 977 978 // åæç»ãå¼·å¶ 979 const labelData = JSON.parse(JSON.stringify(this.labels)); 980 this.labels = []; 981 982 this.$nextTick(function(){ 983 _self.labels = labelData; 984 }); 985 } else { 986 const result = isChecked ? this.value.filter(function(labelId){return labelId !== id;}) : this.value.concat([id]); 987 988 this.$emit('input', result); 989 } 990 }, 991 getLabelClass: function() { 992 let result = ''; 993 994 if (this.mobile) { 995 result += ' label-mobile'; 996 997 if (this.isShow) { 998 result += ' label-mobile--open'; 999 } 1000 } else { 1001 result += ' label'; 1002 } 1003 1004 return result; 1005 }, 1006} 1007}); 1008 1009// category.js 1010Vue.component('search-condition-category', { 1011template: '\ 1012<div class="search-condition-category">\ 1013 <div :class="getLabelClass()" @click="isShow = !isShow">ã«ãã´ãª</div>\ 1014 <transition name="slide">\ 1015 <ul v-show="!mobile || isShow" class="menubox-list">\ 1016 <li v-for="category in categorys" :key="category.id" class="menubox-item">\ 1017 <label>\ 1018 <input\ 1019 type="checkbox"\ 1020 :value="category.id"\ 1021 :checked="value.second.some(function(id){return id == category.id;})"\ 1022 @change="changeSecondCategory(category.id)"\ 1023 />\ 1024 <span>{{ category.name }}</span>\ 1025 </label>\ 1026 </li>\ 1027 </ul>\ 1028 </transition>\ 1029</div>', 1030props: ['value', 'firstOnly', 'mobile'], 1031data: function() { 1032 return { 1033 categorys: [], 1034 isShow: false, 1035 }; 1036}, 1037created: function() { 1038 this.getCategorys(); 1039}, 1040methods: { 1041 getCategorys: function() { 1042 this.categorys = ecblib.staffstart.master.categorys; 1043 }, 1044 changeFirstCategory: function(id) { 1045 const _self = this; 1046 1047 var index = -1; 1048 const isChecked = this.value.first.some(function(categoryId, i){ 1049 if(categoryId == id) { 1050 index = i; 1051 return true; 1052 } 1053 }); 1054 1055 if (!isChecked && this.value.first.length >= 10) { 1056 alert('åæã«é¸æã§ããã«ãã´ãªæ¡ä»¶ã¯10件ã¾ã§ã§ãã'); 1057 1058 // åæç»ãå¼·å¶ 1059 const categorys = JSON.parse(JSON.stringify(this.categorys)); 1060 this.categorys = []; 1061 this.$nextTick(function() { 1062 _self.categorys = categorys; 1063 }); 1064 } else { 1065 if (isChecked) { 1066 const firstData = this.value.first.filter(function(categoryId) {return categoryId != id;}); 1067 1068 var categoryIndex = -1; 1069 const isChecked = this.categorys.some(function(category, i){ 1070 if(category.id == id) { 1071 categoryIndex = i; 1072 return true; 1073 } 1074 }); 1075 1076 let ids = this.categorys[categoryIndex].sub_categorys.map(function(subCatefory) {return subCatefory.id;}); 1077 const secondData = this.value.second.filter( 1078 function(subCategoryId) { 1079 !ids.some(function(id) {return id == subCategoryId;}) 1080 } 1081 ); 1082 1083 this.$emit('input', { 1084 first: firstData, 1085 second: secondData, 1086 }); 1087 } else { 1088 // const firstData = [...this.value.first, id]; 1089 const firstData = this.value.first.concat([id]); 1090 1091 this.$emit('input', { 1092 first: firstData, 1093 second: this.value.second, 1094 }); 1095 } 1096 } 1097 }, 1098 changeSecondCategory: function(id) { 1099 const _self = this; 1100 1101 var index = -1; 1102 const isChecked = this.value.second.some(function(subCategoryId, i){ 1103 if(subCategoryId == id) { 1104 index = i; 1105 return true; 1106 } 1107 });
1108 1109 if (!isChecked && this.value.second.length >= 10) { 1110 alert('åæã«é¸æã§ããã«ãã´ãªæ¡ä»¶ã¯10件ã¾ã§ã§ãã'); 1111 1112 // åæç»ãå¼·å¶ 1113 const secondData = JSON.parse(JSON.stringify(this.categorys)); 1114 this.categorys = []; 1115 this.$nextTick(function() { 1116 _self.categorys = secondData; 1117 }); 1118 } else { 1119 const result = isChecked ? this.value.second.filter(function(subCategoryId){return subCategoryId != id;}) : this.value.second.concat([id]); 1120 1121 this.$emit('input', { 1122 first: this.value.first, 1123 second: result, 1124 }); 1125 } 1126 }, 1127 getLabelClass: function() { 1128 let result = ''; 1129 1130 if (this.mobile) { 1131 result += ' label-mobile'; 1132 1133 if (this.isShow) { 1134 result += ' label-mobile--open'; 1135 } 1136 } else { 1137 result += ' label'; 1138 } 1139 1140 return result; 1141 }, 1142} 1143}); 1144// gender.js 1145Vue.component('search-condition-gender', { 1146template: '\ 1147<div class="search-condition-gender">\ 1148 <div :class="getLabelClass()" @click="isShow = !isShow">æ§å¥</div>\ 1149 <transition name="slide">\ 1150 <ul v-show="!mobile || isShow" class="menubox-list">\ 1151 <li v-for="gender in genders" :key="gender.id" class="menubox-item">\ 1152 <label>\ 1153 <input type="radio" name="gender" :value="gender.id" :checked="value == gender.id" @change="$emit(\'input\', Number($event.target.value))" />\ 1154 <span>{{ gender.name }}</span>\ 1155 </label>\ 1156 </li>\ 1157 </ul>\ 1158 </transition>\ 1159</div>\ 1160', 1161props: ['value', 'kids', 'mobile'], 1162data: function() { 1163 return { 1164 genders: [], 1165 isShow: false, 1166 }; 1167}, 1168created: function() { 1169 this.getGender(); 1170}, 1171methods: { 1172 getGender: function() { 1173 this.genders = [ 1174 { id: 1, name: 'ã¡ã³ãº' }, 1175 { id: 2, name: 'ã¦ã£ã¡ã³ãº' }, 1176 ]; 1177 1178 if (this.kids) { 1179 this.genders.push({ id: 3, name: 'ãããº' }); 1180 } 1181 }, 1182 getLabelClass: function() { 1183 let result = ''; 1184 1185 if (this.mobile) { 1186 result += ' label-mobile'; 1187 1188 if (this.isShow) { 1189 result += ' label-mobile--open'; 1190 } 1191 } else { 1192 result += ' label'; 1193 } 1194 1195 return result; 1196 }, 1197}, 1198watch: { 1199 value: function(newValue) { 1200 if (newValue.min === null && newValue.max === null) { 1201 const _self = this; 1202 1203 // åæç»ãå¼·å¶ 1204 const genderData = JSON.parse(JSON.stringify(this.genders)); 1205 this.genders = []; 1206 this.$nextTick(function() { 1207 _self.genders = genderData; 1208 }); 1209 } 1210 }, 1211}, 1212}); 1213// genre.js 1214Vue.component('search-condition-genre', { 1215template: '\ 1216<div class="search-condition-genre">\ 1217 <div :class="getLabelClass()" @click="isShow = !isShow">{{ genre_name }}</div>\ 1218 <transition name="slide">\ 1219 <ul v-show="!mobile || isShow" class="menubox-list">\ 1220 <li v-for="genre in genres" :key="genre.id" class="menubox-item">\ 1221 <label>\ 1222 <input type="radio" :value="genre.id" :checked="value == genre.id" @change="$emit(\'input\', Number($event.target.value))" />\ 1223 <span>{{ genre.name }}</span>\ 1224 </label>\ 1225 </li>\ 1226 </ul>\ 1227 </transition>\ 1228</div>\ 1229', 1230props: ['value', 'kids', 'mobile'], 1231data: function() { 1232 return { 1233 genres: [], 1234 genre_name: ecblib.staffstart.master.coordinate_genre.name, 1235 isShow: false, 1236 }; 1237}, 1238created: function() { 1239 this.getgenre(); 1240}, 1241methods: { 1242 getgenre: function() { 1243 this.genres = ecblib.staffstart.master.coordinate_genre.items; 1244 }, 1245 getLabelClass: function() { 1246 let result = ''; 1247 1248 if (this.mobile) { 1249 result += ' label-mobile'; 1250 1251 if (this.isShow) { 1252 result += ' label-mobile--open'; 1253 } 1254 } else { 1255 result += ' label'; 1256 } 1257 1258 return result; 1259 }, 1260} 1261}); 1262// skin_type.js 1263Vue.component('search-condition-skin-type', { 1264template: '\ 1265<div class="search-condition-skin-type">\ 1266 <div :class="getLabelClass()" @click="isShow = !isShow">{{ skintypeName }}</div>\ 1267 <transition name="slide">\ 1268 <ul v-show="!mobile || isShow" class="menubox-list">\ 1269 <li v-for="skintype in skintypes" :key="skintype.id" class="menubox-item">\ 1270 <label>\ 1271 <input type="radio" :value="skintype.id" :checked="value == skintype.id" @change="$emit(\'input\', $event.target.value)" />\
1272 <span>{{ skintype.name }}</span>\ 1273 </label>\ 1274 </li>\ 1275 </ul>\ 1276 </transition>\ 1277</div>\ 1278', 1279props: ['value', 'mobile'], 1280data: function() { 1281 return { 1282 skintypes: [], 1283 skintypeName: null, 1284 isShow: false, 1285 }; 1286}, 1287created: function() { 1288 this.skintypes = ecblib.staffstart.master.user.skin_type.items; 1289 this.skintypeName = ecblib.staffstart.master.user.skin_type.name; 1290}, 1291methods: { 1292 getLabelClass: function() { 1293 let result = ''; 1294 1295 if (this.mobile) { 1296 result += ' label-mobile'; 1297 1298 if (this.isShow) { 1299 result += ' label-mobile--open'; 1300 } 1301 } else { 1302 result += ' label'; 1303 } 1304 1305 return result; 1306 }, 1307} 1308}); 1309// skin_color.js 1310Vue.component('search-condition-skin-color', { 1311template: '\ 1312<div class="search-condition-skin-color">\ 1313 <div :class="getLabelClass()" @click="isShow = !isShow">{{ skincolorName }}</div>\ 1314 <transition name="slide">\ 1315 <ul v-show="!mobile || isShow" class="menubox-list">\ 1316 <li v-for="skincolor in skincolors" :key="skincolor.id" class="menubox-item">\ 1317 <label>\ 1318 <input type="radio" :value="skincolor.id" :checked="value == skincolor.id" @change="$emit(\'input\', $event.target.value)" />\ 1319 <span>{{ skincolor.name }}</span>\ 1320 </label>\ 1321 </li>\ 1322 </ul>\ 1323 </transition>\ 1324</div>\ 1325', 1326props: ['value', 'mobile'], 1327data: function() { 1328 return { 1329 skincolors: [], 1330 skincolorName: null, 1331 isShow: false, 1332 }; 1333}, 1334created: function() { 1335 this.skincolors = ecblib.staffstart.master.user.skin_color.items; 1336 this.skincolorName = ecblib.staffstart.master.user.skin_color.name; 1337}, 1338methods: { 1339 getLabelClass: function() { 1340 let result = ''; 1341 1342 if (this.mobile) { 1343 result += ' label-mobile'; 1344 1345 if (this.isShow) { 1346 result += ' label-mobile--open'; 1347 } 1348 } else { 1349 result += ' label'; 1350 } 1351 1352 return result; 1353 }, 1354} 1355}); 1356// eyelid.js 1357Vue.component('search-condition-eyelid', { 1358template: '\ 1359<div class="search-condition-eyelid">\ 1360 <div :class="getLabelClass()" @click="isShow = !isShow">{{ eyelidName }}</div>\ 1361 <transition name="slide">\ 1362 <ul v-show="!mobile || isShow" class="menubox-list">\ 1363 <li v-for="eyelid in eyelids" :key="eyelid.id" class="menubox-item">\ 1364 <label>\ 1365 <input type="radio" :value="eyelid.id" :checked="value == eyelid.id" @change="$emit(\'input\', $event.target.value)" />\ 1366 <span>{{ eyelid.name }}</span>\ 1367 </label>\ 1368 </li>\ 1369 </ul>\ 1370 </transition>\ 1371</div>\ 1372', 1373props: ['value', 'mobile'], 1374data: function() { 1375 return { 1376 eyelids: [], 1377 eyelidName: null, 1378 isShow: false, 1379 }; 1380}, 1381created: function() { 1382 this.eyelids = ecblib.staffstart.master.user.eyelid.items; 1383 this.eyelidName = ecblib.staffstart.master.user.eyelid.name; 1384}, 1385methods: { 1386 getLabelClass: function() { 1387 let result = ''; 1388 1389 if (this.mobile) { 1390 result += ' label-mobile'; 1391 1392 if (this.isShow) { 1393 result += ' label-mobile--open'; 1394 } 1395 } else { 1396 result += ' label'; 1397 } 1398 1399 return result; 1400 }, 1401} 1402}); 1403// release-date.js 1404/* 1405Vue.component('search-condition-release-date', { 1406template: '\ 1407<div class="search-condition-release-date">\ 1408 <div :class="getLabelClass()" @click="isShow = !isShow">å ¬éæ¥</div>\ 1409 <transition name="slide">\ 1410 <ul v-show="!mobile || isShow" class="menubox-list">\ 1411 <li class="menubox-item">\ 1412 <v-datepicker\ 1413 :value="value"\ 1414 @input="$emit(\'input\', $event)"\ 1415 @selected="$emit(\'input\', $event)"\ 1416 :format="pickerOptions.format"\ 1417 :language="pickerOptions.language"\ 1418 :minimum-view="\'month\'"\ 1419 :initial-view="\'month\'"\ 1420 :class="mobile ? \'select-month-mobile\' : \'select-month\'"\ 1421 placeholder="é¸æãªã"\ 1422 >\ 1423 </v-datepicker>\ 1424 </li>\ 1425 </ul>\ 1426 </transition>\ 1427</div>\ 1428', 1429props: ['value', 'mobile'], 1430components: { 1431 'v-datepicker': vuejsDatepicker, 1432}, 1433data: function() { 1434 return { 1435 pickerOptions: { 1436 format: 'yyyy/MM', 1437 language: vdp_translation_ja.js, 1438 }, 1439 isShow: false, 1440 }; 1441}, 1442methods: { 1443 getLabelClass: function() { 1444 let result = ''; 1445 1446 if (this.mobile) { 1447 result += ' label-mobile'; 1448 1449 if (this.isShow) { 1450 result += ' label-mobile--open'; 1451 } 1452 } else { 1453 result += ' label'; 1454 } 1455 1456 return result; 1457 }, 1458}, 1459}); 1460*/ 1461// selected-tag-name.js 1462Vue.component('selected-tag-name', { 1463template: '\ 1464<div :class="\'selected-tag\' + (mobile ? \' selected-tag-mobile\' : \'\')">\ 1465 <div :class="mobile ? \'selected-tag-label-mobile\' : \'selected-tag-label\'">ãã¼ã¯ã¼ã</div>\ 1466 <div v-if="!value">
1466é¸æãªã</div>\ 1467 <div v-else class="clearfix">\ 1468 <div class="selected-tag-tag">\ 1469 <span>\ 1470 {{ value }}\ 1471 <i class="fa fa-times close-btn" @click="remove()"></i>\ 1472 </span>\ 1473 </div>\ 1474 </div>\ 1475</div>\ 1476', 1477props: ['value', 'mobile'], 1478methods: { 1479 remove: function(selectedId) { 1480 this.$emit('input', null); 1481 }, 1482}, 1483}); 1484// selected-tag.js 1485Vue.component('selected-tag', { 1486template: '\ 1487<div :class="\'selected-tag\' + (mobile ? \' selected-tag-mobile\' : \'\')">\ 1488 <div :class="mobile ? \'selected-tag-label-mobile\' : \'selected-tag-label\'">ãã¼ã¯ã¼ã</div>\ 1489 <div v-if="!value || value.length == 0">é¸æãªã</div>\ 1490 <div v-else class="clearfix">\ 1491 <div v-for="item in value" :key="item.tag_id" class="selected-tag-tag">\ 1492 <span>\ 1493 {{ item.tag_name }}\ 1494 <i class="fa fa-times close-btn" @click="remove(item.tag_id)"></i>\ 1495 </span>\ 1496 </div>\ 1497 </div>\ 1498</div>\ 1499', 1500props: ['value', 'mobile'], 1501methods: { 1502 remove: function(selectedId) { 1503 const removed = this.value.filter(function(i) { return i.tag_id != selectedId; }); 1504 1505 this.$emit('input', removed); 1506 }, 1507}, 1508}); 1509 1510// shop add 1511Vue.component('staff-contents-store-data', { 1512template: '\ 1513<div class="staff-contents-store-data">\ 1514 <div class="search-condition-shop">\ 1515 <div class=" label">åºèæ¤ç´¢</div>\ 1516 <div class="staff-contents-modal-overlay" style="display: none;"></div>\ 1517 <div class="staff-contents-modal-select">æå®ãªã</div>\ 1518 <div class="staff-contents-modal">\ 1519 <div class="staff-contents-modal-inner">\ 1520 <h2>åºèãçµè¾¼ã</h2>\ 1521 <div class="staff-contents-modal-close">éãã</div>\ 1522 <div class="staff-contents-modal-tab">\ 1523 <ul>\ 1524 <li v-for="area in area">{{ area.area }}</li>\ 1525 </ul>\ 1526 </div>\ 1527 <div class="staff-contents-modal-tab-cont">\ 1528 <div v-for="area in area">\ 1529 <ul>\ 1530 <template v-for="shop in shop">\ 1531 <li v-if="shop.area == area.area">\ 1532 <label>\ 1533 <input type="radio" :data-area="shop.area" :data-pref="shop.pref" :value="shop.id" :checked="value == shop.id" @change="$emit(\'input\', $event.target.value)">\ 1534 <span>{{ shop.name }}</span>\ 1535 </label>\ 1536 </li>\ 1537 </template>\ 1538 </ul>\ 1539 </div>\ 1540 </div>\ 1541 <div class="staff-contents-modal-shop-more"><a href="/shop/pages/shoplist.aspx">åºèä¸è¦§ããæ¢ã⇒</a></div>\ 1542 </div>\ 1543 </div>\ 1544 </div>\ 1545</div>\ 1546', 1547props: ['value',], 1548data: function() { 1549 return { 1550 area: [], 1551 shopsp: [], 1552 }; 1553}, 1554created: function() { 1555 this.getArea(); 1556}, 1557methods: { 1558 getArea: function() { 1559 this.area = ecblib.staffstart.master.area; 1560 this.shop = ecblib.staffstart.master.shops; 1561 }, 1562}, 1563}); 1564 1565// shop sp add 1566Vue.component('staff-contents-store-data-sp', { 1567template: '\ 1568 <section class="staff-contents-menubox">\ 1569 <div v-for="area in areasp">\ 1570 <div class="search-condition-shop">\ 1571 <div class="label-mobile">{{ area.area }}</div>\ 1572 <ul class="menubox-list" style="display: none;">\ 1573 <template v-for="shop in shops">\ 1574 <li v-if="shop.area == area.area" class="menubox-item">\ 1575 <label>\ 1576 <input type="radio" :data-area="shop.area" :data-pref="shop.pref" :value="shop.id" :checked="value == shop.id" @change="$emit(\'input\', $event.target.value)">\ 1577 <span>{{ shop.name }}</span>\ 1578 </label>\ 1579ãããããã </li>\ 1580 </template>\ 1581 </ul>\ 1582 </div>\ 1583 </div>\ 1584 </section>\ 1585', 1586props: ['value',], 1587data: function() { 1588 return { 1589 areasp: [], 1590 shopsp: [], 1591 //shops: [], 1592 }; 1593}, 1594created: function() { 1595 this.getAreaSp(); 1596}, 1597methods: { 1598 getAreaSp: function() { 1599 this.areasp = ecblib.staffstart.master.area; 1600 this.shops = ecblib.staffstart.master.shops; 1601 }, 1602}, 1603}) 1604 1605// shop.js 1606Vue.component('search-condition-shop', { 1607template: '\ 1608<div class="search-condition-shop">\ 1609 <div :class="getLabelClass()" @click="isShow = !isShow">åºè</div>\ 1610 <transition name="slide">\ 1611 <select v-show="!mobile || isShow" class="select-area" :value="value" @change="$emit(\'input\', $event.target.value)">\ 1612 <option :value="0">
1612é¸æãªã</option>\ 1613 <option v-for="shop in shops" :key="shop.id" :value="shop.id" :data-area="shop.area" :data-pref="shop.pref">{{ shop.name }}</option>\ 1614 </select>\ 1615 </transition>\ 1616</div>\ 1617', 1618props: ['value', 'mobile'], 1619data: function() { 1620 return { 1621 shops: [], 1622 isShow: false, 1623 }; 1624}, 1625created: function() { 1626 this.getShops(); 1627}, 1628methods: { 1629 getShops: function() { 1630 this.shops = ecblib.staffstart.master.shops; 1631 }, 1632 getLabelClass: function() { 1633 let result = ''; 1634 1635 if (this.mobile) { 1636 result += ' label-mobile'; 1637 1638 if (this.isShow) { 1639 result += ' label-mobile__open'; 1640 } 1641 } else { 1642 result += ' label'; 1643 } 1644 1645 return result; 1646 }, 1647}, 1648}); 1649// staff.js 1650Vue.component('search-condition-staff', { 1651 template: '\ 1652 <div class="search-condition-staff">\ 1653 <div :class="getLabelClass()" @click="isShow = !isShow">ã¹ã¿ãã</div>\ 1654 <transition name="slide">\ 1655 <select v-show="!mobile || isShow" class="select-area" :value="value" @change="$emit(\'input\', $event.target.value)">\ 1656 <option :value="0">é¸æãªã</option>\ 1657 <option v-for="staff in staffs" :key="staff.user_id" :value="staff.user_id">{{ staff.name }}</option>\ 1658 </select>\ 1659 </transition>\ 1660 </div>\ 1661 ', 1662 props: ['value', 'mobile'], 1663 data: function() { 1664 return { 1665 staffs: [], 1666 isShow: false, 1667 }; 1668 }, 1669 created: function() { 1670 this.getStaffs(); 1671 }, 1672 methods: { 1673 getStaffs: function() { 1674 const _self = this; 1675 const url = ecblib.staffstart.api.url.staffList; 1676 1677 ecblib.staffstart.util.ajaxGet(url, {}, function (data) { _self.staffs = data.item; }); 1678 }, 1679 getLabelClass: function() { 1680 let result = ''; 1681 1682 if (this.mobile) { 1683 result += ' label-mobile'; 1684 1685 if (this.isShow) { 1686 result += ' label-mobile__open'; 1687 } 1688 } else { 1689 result += ' label'; 1690 } 1691 1692 return result; 1693 }, 1694 }, 1695}); 1696// stature.js 1697Vue.component('search-condition-stature', { 1698template: '\ 1699<div class="search-condition-stature">\ 1700 <div :class="getLabelClass()" @click="isShow = !isShow">身é·</div>\ 1701 <transition name="slide">\ 1702 <ul v-show="!mobile || isShow" class="menubox-list">\ 1703 <li v-for="stature in statures" :key="stature.id" class="menubox-item">\ 1704 <label>\ 1705 <input\ 1706 type="radio"\ 1707 name="stature"\ 1708 :value="JSON.stringify(stature.stature)"\ 1709 :checked="JSON.stringify(value) == JSON.stringify(stature.stature)"\ 1710 @change="$emit(\'input\', JSON.parse($event.target.value))"\ 1711 />\ 1712 <span>{{ stature.name }}</span>\ 1713 </label>\ 1714 </li>\ 1715 </ul>\ 1716 </transition>\ 1717</div>\ 1718', 1719props: ['value', 'mobile'], 1720data: function() { 1721 return { 1722 statures: [], 1723 isShow: false, 1724 }; 1725}, 1726created: function() { 1727 this.getStature(); 1728}, 1729methods: { 1730 getStature: function() { 1731 this.statures = ecblib.staffstart.master.statures.items; 1732 }, 1733 getLabelClass: function() { 1734 let result = ''; 1735 1736 if (this.mobile) { 1737 result += ' label-mobile'; 1738 1739 if (this.isShow) { 1740 result += ' label-mobile__open'; 1741 } 1742 } else { 1743 result += ' label'; 1744 } 1745 1746 return result; 1747 }, 1748}, 1749watch: { 1750 value: function(newValue) { 1751 if (newValue.min === null && newValue.max === null) { 1752 const _self = this; 1753 1754 // åæç»ãå¼·å¶ 1755 const statureData = JSON.parse(JSON.stringify(this.statures)); 1756 this.statures = []; 1757 this.$nextTick(function() { 1758 _self.statures = statureData; 1759 }); 1760 } 1761 }, 1762}, 1763}); 1764// coordinate-detail-info.js 1765Vue.component('coordinate-detail-info', { 1766template: '\ 1767<div v-if="coordinate">\ 1768 <div class="coordinate-detail-date">\ 1769 <p>{{ ecblib.staffstart.util.formatDate(coordinate.accept_at) }}</p>\ 1770 </div>\ 1771 <div class="coordinate-detail-comment">\ 1772 <p>{{ coordinate.comment }}</p>\ 1773 </div>\ 1774 <div class="coordinate-detail-link">\ 1775 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + co
1775ordinate.user_id">ãã®ã¹ã¿ããã®ã¹ã¿ã¤ãªã³ã°ãè¦ã</a>\ 1776 </div>\ 1777 <div class="coordinate-detail-bookmark" v-if="dispFlag !== undefined" :class="\'coordinate-detail-bookmark\' + (mobile ? \'-mobile\' : \'\')">\ 1778 <a data-type="coordinate" :data-code="coordinate.cid" @click="registBookmark" :class="bookmarkid > 0 ? \'coordinate-detail-bookmark-registed\' : \'\'" :key="key">\ 1779 <img v-if="bookmarkid > 0" :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue_check.png\'" alt="ãæ°ã«å ¥ã">\ 1780 <img v-else :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue.png\'" alt="ãæ°ã«å ¥ã">\ 1781 <span>{{ bookmarkid > 0 ? \'ãæ°ã«å ¥ãç»é²æ¸\' : \'ãæ°ã«å ¥ãç»é²\' }}</span>\ 1782 </a>\ 1783 </div>\ 1784 <slot></slot>\ 1785 <div class="coordinate-detail-keyword">\ 1786 <ul class="keyword-tag-list">\ 1787 <li v-for="tag in coordinate.tags" :key="tag" class="keyword-tag-item">\ 1788 <a :href="ecblib.staffstart.uri.coordinateList + \'?tag=\' + encodeURI(tag) + \'&sort=time\'">{{ tag }}</a>\ 1789 </li>\ 1790 </ul>\ 1791 </div>\ 1792</div>\ 1793', 1794props: ['coordinate', 'mobile'], 1795data: function() { 1796 return { 1797 dispFlag: undefined, 1798 key: 1, 1799 bookmarkid: 0, 1800 }; 1801}, 1802methods: { 1803 registBookmark: async function(e) { 1804 var result = await ecblib.staffstart.util.StaffStart_RegistBookmark(e.currentTarget, this.bookmarkid); 1805 if(result.result) { 1806 this.bookmarkid = result.bookmarkid; 1807 this.key = this.key + 1; 1808 } 1809 }, 1810}, 1811watch: { 1812 coordinate: async function(getsCoordinate){ 1813 const self_ = this; 1814 const result = await ecblib.staffstart.util.StaffStart_GetBookmark('coordinate', getsCoordinate.cid) 1815 if(result) { 1816 this.dispFlag = true; 1817 this.bookmarkid = result; 1818 } 1819 } 1820}, 1821}); 1822// coordinate-viewer.js 1823Vue.component('coordinate-viewer', { 1824template: '\ 1825<section :class="\'coordinate-detail-img-frame\' + (mobile ? \'-mobile\' : \'\')">\ 1826 <div class="coordinate-detail-img-main">\ 1827 <figure v-for="image in smallImages">\ 1828 <img v-if="image" :src="image" alt="ã¹ã¿ã¤ãªã³ã°åç" />\ 1829 </figure>\ 1830 </div>\ 1831 <div class="coordinate-detail-gallery">\ 1832 <ul class="coordinate-detail-img-list">\ 1833 <li\ 1834 v-for="image in smallImages"\ 1835 :key="image"\ 1836 @click="selectedImage = image"\ 1837 :class="\'coordinate-detail-img-item\' + (mobile ? \'-mobile\' : \'\')"\ 1838 >\ 1839 <img :src="image" alt="ã¹ã¿ã¤ãªã³ã°åç" />\ 1840 </li>\ 1841 </ul>\ 1842 </div>\ 1843</section>\ 1844', 1845props: ['coordinate', 'mobile'], 1846data: function() { 1847 return { 1848 selectedImage: null, 1849 smallImages: [], 1850 }; 1851}, 1852methods: { 1853 initSelectedImage: function() { 1854 this.selectedImage = this.coordinate.image_url || ecblib.staffstart.uri.sorryImg; 1855 }, 1856 getSmallImages: function() { 1857 this.smallImages = [this.coordinate.image_url].concat(this.coordinate.sub_image) 1858 .map(function(i) { return i || ecblib.staffstart.uri.sorryImg}); 1859 }, 1860}, 1861watch: { 1862 'coordinate.image_url': function() { 1863 this.initSelectedImage(); 1864 }, 1865 'coordinate.sub_image': function() { 1866 this.getSmallImages(); 1867 }, 1868}, 1869}); 1870// coordinate-wear-items.js 1871Vue.component('coordinate-wear-items', { 1872template: '\ 1873<div v-if="coordinate" class="coordinate-detail-wear-items" :class="\'coordinate-detail-wear-items\' + (mobile ? \'-mobile\' : \'\')">\ 1874 <h2 class="coordinate-detail-wear-items--title">çç¨ã¢ã¤ãã </h2>\ 1875 <ul class="coordinate-detail-wear-list">\ 1876 <li v-for="item in coordinate.products" :key="item.product_code" :class="\'coordinate-detail-wear-item\' + (mobile ? \'-mobile\' : \'\')">\ 1877 <a :href="item.product_url">\ 1878 <img :src="item.image_url || ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ã¤ãªã³ã°ã«ä½¿ç¨ããã¦ããã¢ã¤ãã " />\ 1879 </a>\ 1880 <p class="coordinate-detail-wear-item--name">{{ item.name }}</p>\ 1881 <p class="coordinate-detail-wear-item--color">ã«ã©ã¼ï¼{{ item.color }}</p>\ 1882 <p class="coordinate-detail-wear-item--price">\ 1883 <span class="selling-price">
1883Â¥ {{ Number(item.selling_price).toLocaleString(\'ja\') }}</span>\ 1884 <span>(ç¨è¾¼)</span>\ 1885 </p>\ 1886 </li>\ 1887 </ul>\ 1888 <div class="staff-contents-coordinate-detail-description-caution">â»ããã°ã®å 容ãååã¹ããã¯ãä¾¡æ ¼çã®æ å ±ã¯æ²è¼æç¹ã®ãã®ã§ãã</div>\ 1889</div>\ 1890', 1891props: ['coordinate', 'mobile'] 1892}); 1893// staff-coordinate-list.js 1894Vue.component('staff-coordinate-list', { 1895template: '\ 1896<section :class="\'staff-coordinate-list-frame\' + (mobile ? \'-mobile\' : \'\')" v-if="limitCountItems.length != 0">\ 1897 <div class="staff-coordinate-list-title">\ 1898 <h2>{{ coordinate.user_name }}ã®ã¹ã¿ã¤ãªã³ã°</h2>\ 1899 </div>\ 1900 \ 1901 <div class="staff-coordinate-list">\ 1902 <div v-for="item in limitCountItems" :key="item.cid" :class="\'coordinate-item\' + (displayType == displayTypeConst.cosme ? \'-cosme\' : \'\') + (mobile ? \'-mobile\' : \'\')">\ 1903 <coordinate-list-item-apparel v-if="displayType == displayTypeConst.apparel" :item="item" :comment-mode="false"></coordinate-list-item-apparel>\ 1904 <coordinate-list-item-cosme v-if="displayType == displayTypeConst.cosme" :item="item"></coordinate-list-item-cosme>\ 1905 </div>\ 1906 </div>\ 1907 \ 1908 <div class="staff-coordinate-button-frame" v-if="isShowButton">\ 1909 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + coordinate.user_id" :class="\'staff-coordinate-button-seemore\' + (mobile ? \'-mobile\' : \'\')">ãã£ã¨è¦ã</a>\ 1910 </div>\ 1911</section>\ 1912', 1913props: ['coordinate', 'cid', 'mobile', 'displayType', 'displayTypeConst', 'itemsPerPage'], 1914data: function() { 1915 return { 1916 items: [], 1917 isShowButton: false, 1918 }; 1919}, 1920methods: { 1921 getCoordinates: function () { 1922 const _self = this; 1923 const url = ecblib.staffstart.api.url.coordinateList; 1924 1925 const params = { 1926 count: 6, 1927 user_id: this.coordinate.user_id, 1928 }; 1929 if (this.displayType == this.displayTypeConst.cosme) { 1930 params.add_fields = "comment"; 1931 } 1932 1933 ecblib.staffstart.util.ajaxGet(url, params, 1934 function (data) { 1935 _self.items = data.item; 1936 }, 1937 function () { 1938 _self.items = []; 1939 } 1940 ); 1941 1942 }, 1943 getStaffIcon: function(imgArr) { 1944 if (!imgArr || imgArr.length === 0) return ecblib.staffstart.uri.sorryImg; 1945 1946 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 's';}); 1947 }, 1948}, 1949computed: { 1950 limitCountItems: function() { 1951 if (!this.items || this.items.length == 0) return []; 1952 1953 const _self = this; 1954 const _cid = this.cid || this.coordinate.cid; 1955 let result = this.items; 1956 1957 result = result.filter(function(coordinate) {return Number(coordinate.cid) != _cid}); 1958 1959 this.isShowButton = result.length > Number(this.itemsPerPage); 1960 1961 return result.splice(0, Number(this.itemsPerPage)); 1962 }, 1963}, 1964watch: { 1965 coordinate: function() { 1966 if(this.coordinate) { 1967 this.getCoordinates(); 1968 } else { 1969 this.items = []; 1970 } 1971 } 1972} 1973}); 1974// staff-simple-info-view.js 1975Vue.component('staff-simple-info-view', { 1976template: '\ 1977<div v-if="coordinate" :class="\'coordinate-detail-staff-info-view\' + (mobile ? \'-mobile\' : \'\')">\ 1978 <div class="coordinate-detail-staff-info-view--img">\ 1979 <img :src="coordinate.user_image_url ? coordinate.user_image_url : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³" />\ 1980 </div>\ 1981 <div class="coordinate-detail-staff-info-view--description">\ 1982 <p class="coordinate-detail-staff-info-view--shop">{{ coordinate.shop_name }}</p>\ 1983 <p class="coordinate-detail-staff-info-view--name">{{ coordinate.user_name }}</p>\ 1984 <p class="coordinate-detail-staff-info-view--height">{{ coordinate.user_height > 0 ? \'èº«é· : \' + coordinate.user_height + \'cm\' : \'\' }}</p>\ 1985 <p class="coordinate-detail-staff-info-view--size">{{ getSize(coordinate) }}</p>\ 1986 <p class="coordinate-detail-staff-info-view--feature">{{ getFeature(coordinate) }}</p>\ 1987 <p class="coordinate-detail-staff-info-view--qualification1">{{ getQualification1(coordinate) }}</p>\ 1988 <p class="coordinate-detail-staff-info-view--qualification2">{{ getQualification2(coordinate) }}</p>\ 1989 </div>\ 1990</div>\ 1991', 1992props: ['coordinate', 'mobile'], 1993methods: { 1994 getSize: function(item){ 1995 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 1996 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.size.id){ 1997 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value + item.user_attributes[i].user_attribute_type.unit; 1998 } 1999 } 2000 return ''; 2001 }, 2002 getFeature: function(item){ 2003 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 2004 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.feature.id){ 2005 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2006 } 2007 } 2008 return ''; 2009 }, 2010 getQualification1: function(item){ 2011 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 2012 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_1.id){ 2013 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2014 } 2015 } 2016 return ''; 2017 }, 2018 getQualification2: function(item){ 2019 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 2020 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_2.id){ 2021 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2022 } 2023 } 2024 return ''; 2025 }, 2026} 2027}); 2028// coordinate-list.js 2029Vue.component('coordinate-list', { 2030template: '\ 2031<div class="coordinate-list">\ 2032 <div class="card-list-frame">\ 2033 <p v-if="!init && !commentMode">\ 2034 <strong>æ¤ç´¢ä¸...</strong>\ 2035 </p>\ 2036 <p v-else-if="items.length == 0 && !commentMode">\ 2037 <strong v-if="notFoundMessage != null">{{notFoundMessage}}</strong>\ 2038 <strong v-else>ãæå®ã®æ¡ä»¶ã«ä¸è´ããã¹ã¿ã¤ãªã³ã°ãè¦ã¤ããã¾ããã§ããã</strong>\ 2039 </p>\ 2040 <div v-for="item in items" :key="item.cid" :class="\'coordinate-item\' + (displayType == displayTypeConst.cosme ? \'-cosme\' : \'\') + (mobile ? \'-mobile\' : \'\') + (commentMode ? \' coordinate-item__small\' : \'\')">\ 2041 <coordinate-list-item-apparel v-if="displayType == displayTypeConst.apparel" :item="item" :comment-mode="commentMode"></coordinate-list-item-apparel>\ 2042 <coordinate-list-item-cosme v-if="displayType == displayTypeConst.cosme" :item="item"></coordinate-list-item-cosme>\ 2043 </div>\
2044 </div>\ 2045 <div v-if="hasPagination()" class="see-more-btn-block">\ 2046 <button type="button" :class="\'see-more-btn\' + (mobile ? \'-mobile\' : \'\')" @click="addPage()">ãã£ã¨è¦ã</button>\ 2047 </div>\ 2048 <div v-else-if="hasDetail()" class="seemore">\ 2049 <a :href="getLocation()">ãã£ã¨è¦ã</a>\ 2050 </div>\ 2051</div>\ 2052', 2053props: ['value', 'condition', 'commentMode', 'itemsPerPage', 'disablePagination', 'notFoundMessage', 'mobile', 'displayType', 'displayTypeConst', 'disableDetail', 'listType'], 2054data: function() { 2055 return { 2056 items: [], 2057 displayLimit: 20, 2058 total: 0, 2059 init: false 2060 }; 2061}, 2062created: function() { 2063 this.setOptions(); 2064 this.getCoordinates(); 2065 this.setMeta(); 2066}, 2067mounted(){ 2068 this.prefix = document.title.split("ã¹ã¿ã¤ãªã³ã°ä¸è¦§")[0] 2069 this.suffix = document.title.split("ã¹ã¿ã¤ãªã³ã°ä¸è¦§")[1] 2070 }, 2071methods: { 2072 setOptions: function() { 2073 this.displayLimit = this.itemsPerPage || 20; 2074 }, 2075 getCoordinates: function () { 2076 ecblib.staffstart.util.setCanonical(); 2077 const _self = this; 2078 const url = ecblib.staffstart.api.url.coordinateList; 2079 2080 const condition = JSON.parse(JSON.stringify(this.condition)); 2081 if (this.displayType == this.displayTypeConst.cosme) { 2082 condition.add_fields = "comment"; 2083 } 2084 if (this.displayLimit > 0) { 2085 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2086 condition.count = this.displayLimit * (condition[pageindexKey] || 1); 2087 } 2088 2089 ecblib.staffstart.util.ajaxGet(url, condition, 2090 function (data) { 2091 _self.items = data.item; 2092 _self.total = data.total; 2093 _self.$emit('input', data.total); 2094 _self.init = true; 2095 }, 2096 function () { 2097 _self.items = []; 2098 _self.total = 0; 2099 _self.$emit('input', 0); 2100 _self.init = true; 2101 } 2102 ); 2103 }, 2104 setMeta :function(){ 2105 if (location.href.indexOf("coordinatelist.aspx") < 0){ 2106 return 2107 } 2108 2109 const condition = JSON.parse(JSON.stringify(this.condition)); 2110 2111 var breadAddElement = document.getElementsByClassName("bread-crumb-item-add"); 2112 if (breadAddElement.length > 0) { 2113 breadAddElement[0].remove(); 2114 } 2115 2116 var contentTitleAddElement = document.getElementsByClassName("content-title-add"); 2117 if (contentTitleAddElement.length > 0) { 2118 contentTitleAddElement[0].remove(); 2119 } 2120 2121 if (condition.tag != null || condition.user_gender != null || condition.from_height != null || condition.to_height != null || condition.size.length > 0 2122 || condition.feature != null || condition.label != null || condition.category != null || condition.qualification_1.length > 0 || condition.qualification_2.length > 0 ||condition.shop_code != null){ 2123 var searchCondition = ""; 2124 2125 if (condition.tag != null){ 2126 var tagClass = document.getElementsByClassName("selected-tag-tag"); 2127 for (var i = 0; i < tagClass.length; i++){ 2128 var tagName = tagClass[i].children[0].textContent.replace("/ /g", "") 2129 2130 if (searchCondition == ""){ 2131 searchCondition += tagName 2132 } 2133 else{ 2134 searchCondition += "," + tagName 2135 } 2136 } 2137 } 2138 2139 if (condition.user_gender != null){ 2140 var genderName = "" 2141 if (condition.user_gender == "1"){ 2142 genderName = "ã¡ã³ãº"; 2143 } else if (condition.user_gender == "2"){ 2144 genderName = "ã¦ã£ã¡ã³ãº"; 2145 } else if (condition.user_gender == "3"){ 2146 genderName = "ãããº"; 2147 } 2148 2149 if (searchCondition == ""){ 2150 searchCondition += genderName 2151 } 2152 else{ 2153 searchCondition += "," + genderName 2154 } 2155 } 2156 2157 if (condition.from_height != null && condition.to_height != null){ 2158 if (searchCondition == ""){ 2159 searchCondition += condition.from_height + "cm~" + condition.to_height + "cm" 2160 } 2161 else{ 2162 searchCondition += "," + condition.from_height + "cm~" + condition.to_height + "cm" 2163 } 2164 } 2165 2166 if (condition.from_height == null && condition.to_height != null){ 2167 if (searchCondition == ""){ 2168 searchCondition += condition.to_height+ "cm以ä¸" 2169 } 2170 else{ 2171 searchCondition += "," + condition.to_height+ "cm以ä¸" 2172 } 2173 } 2174 2175 if (condition.from_height != null && condition.to_height == null){ 2176 if (searchCondition == ""){ 2177 searchCondition += condition.from_height+ "cm以ä¸" 2178 } 2179 else{ 2180 searchCondition += "," + condition.from_height+ "cm以ä¸" 2181 } 2182 } 2183 2184 if (condition.size.length > 0){ 2185 var sizeLen = ecblib.staffstart.master.user.size.items.length; 2186 for (var i = 0; i < condition.size.length;i++ ){
2187 var sizeName = ""; 2188 for(var j =0; j < sizeLen; j++){ 2189 if (condition.size[i] == ""){ 2190 break; 2191 } 2192 if (condition.size[i] == ecblib.staffstart.master.user.size.items[j].id){ 2193 sizeName = ecblib.staffstart.master.user.size.items[j].name; 2194 break; 2195 } 2196 } 2197 if (sizeName == ""){ 2198 continue; 2199 } 2200 else if (searchCondition == ""){ 2201 searchCondition += sizeName 2202 } 2203 else{ 2204 searchCondition += "," + sizeName 2205 } 2206 } 2207 } 2208 2209 if (condition.feature != null){ 2210 var featureName = ""; 2211 var featureLen = ecblib.staffstart.master.user.feature.items.length; 2212 for(var i =0; i < featureLen; i++){ 2213 if (condition.feature == ecblib.staffstart.master.user.feature.items[i].id){ 2214 featureName = ecblib.staffstart.master.user.feature.items[i].name; 2215 break; 2216 } 2217 } 2218 2219 if (searchCondition == ""){ 2220 searchCondition += featureName 2221 } 2222 else{ 2223 searchCondition += "," + featureName 2224 } 2225 } 2226 2227 if (condition.label != null){ 2228 var labelArr = condition.label.split(","); 2229 var labelLen = labelArr.length; 2230 for (var i = 0; i < labelLen; i++ ){ 2231 var brandName = ""; 2232 for(var j =0; j < ecblib.staffstart.master.brands.length; j++){ 2233 if (labelArr[i] == ecblib.staffstart.master.brands[j].id){ 2234 brandName = ecblib.staffstart.master.brands[j].name; 2235 break; 2236 } 2237 } 2238 2239 if (searchCondition == ""){ 2240 searchCondition += brandName 2241 } 2242 else{ 2243 searchCondition += "," + brandName 2244 } 2245 } 2246 } 2247 2248 if (condition.category != null){ 2249 var categoryArr = jQuery('.search-condition-category').find("input[type='checkbox']").filter(":checked"); 2250 var categoryLen = categoryArr.length; 2251 for (var i = 0; i < categoryLen; i++ ){ 2252 var categoryName = ""; 2253 for(var j =0; j < ecblib.staffstart.master.categorys.length; j++){ 2254 if (categoryArr[i].value == ecblib.staffstart.master.categorys[j].id){ 2255 categoryName = ecblib.staffstart.master.categorys[j].name; 2256 break; 2257 } 2258 } 2259 2260 if (categoryName == ""){ 2261 continue; 2262 } 2263 2264 if (searchCondition == ""){ 2265 searchCondition += categoryName 2266 } 2267 else{ 2268 searchCondition += "," + categoryName 2269 } 2270 } 2271 } 2272 2273 if (condition.qualification_1.length > 0){ 2274 var qualification_1Len = ecblib.staffstart.master.user.qualification_1.items.length; 2275 for (var i = 0; i < condition.qualification_1.length;i++ ){ 2276 var qualification_1Name = ""; 2277 for(var j =0; j < qualification_1Len; j++){ 2278 if (condition.qualification_1[i] == ""){ 2279 break; 2280 } 2281 if (condition.qualification_1[i] == ecblib.staffstart.master.user.qualification_1.items[j].id){ 2282 qualification_1Name = ecblib.staffstart.master.user.qualification_1.items[j].name; 2283 break; 2284 } 2285 } 2286 if (qualification_1Name == ""){ 2287 continue; 2288 } 2289 else if (searchCondition == ""){ 2290 searchCondition += qualification_1Name 2291 } 2292 else{ 2293 searchCondition += "," + qualification_1Name 2294 } 2295 } 2296 } 2297 2298 if (condition.qualification_2.length > 0){ 2299 var qualification_2Len = ecblib.staffstart.master.user.qualification_2.items.length; 2300 for (var i = 0; i < condition.qualification_2.length;i++ ){ 2301 var qualification_2Name = ""; 2302 for(var j =0; j < qualification_2Len; j++){ 2303 if (condition.qualification_2[i] == ""){ 2304 break; 2305 } 2306 if (condition.qualification_2[i] == ecblib.staffstart.master.user.qualification_2.items[j].id){
2307 qualification_2Name = ecblib.staffstart.master.user.qualification_2.items[j].name; 2308 break; 2309 } 2310 } 2311 if (qualification_2Name == ""){ 2312 continue; 2313 } 2314 else if (searchCondition == ""){ 2315 searchCondition += qualification_2Name 2316 } 2317 else{ 2318 searchCondition += "," + qualification_2Name 2319 } 2320 } 2321 } 2322 2323 if (condition.shop_code != null){ 2324 var shopName = ""; 2325 var shopLen = ecblib.staffstart.master.shops.length; 2326 for(var i =0; i < shopLen; i++){ 2327 if (condition.shop_code == ecblib.staffstart.master.shops[i].id){ 2328 shopName = ecblib.staffstart.master.shops[i].name; 2329 break; 2330 } 2331 } 2332 if (searchCondition == ""){ 2333 searchCondition += shopName 2334 } 2335 else{ 2336 searchCondition += "," + shopName 2337 } 2338 } 2339 2340 jQuery('.bread-crumb-list').append(' <li class="bread-crumb-item-add"><span"> > '+ searchCondition + '</span></li>'); 2341 jQuery('.staff-contents-content-title:first').append(' <span class ="content-title-add"> > '+ searchCondition + '</span>'); 2342 2343 if (this.prefix != undefined || this.suffix != undefined){ 2344 document.title = this.prefix + searchCondition + this.suffix; 2345 } 2346 } 2347 else{ 2348 if (this.prefix != undefined || this.suffix != undefined){ 2349 document.title = this.prefix + 'ã¹ã¿ã¤ãªã³ã°ä¸è¦§' + this.suffix; 2350 } 2351 } 2352 }, 2353 2354 hasPagination: function() { 2355 if (this.disablePagination) return false; 2356 2357 return this.total > this.items.length; 2358 }, 2359 hasDetail: function() { 2360 if (this.disableDetail) return false; 2361 2362 return this.total > this.items.length; 2363 }, 2364 addPage: function() { 2365 const _self = this; 2366 const url = ecblib.staffstart.api.url.coordinateList; 2367 2368 const condition = JSON.parse(JSON.stringify(this.condition)); 2369 if (this.displayType == this.displayTypeConst.cosme) { 2370 condition.add_fields = "comment"; 2371 } 2372 if (!this.disablePagination) { 2373 condition.count = this.displayLimit; 2374 condition.offset = this.items.length; 2375 2376 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2377 if (this.condition[pageindexKey]) { 2378 this.condition[pageindexKey]++; 2379 } 2380 else { 2381 this.condition[pageindexKey] = 2; 2382 } 2383 ecblib.staffstart.util.pushHistoryPageIndex(pageindexKey, this.condition); 2384 } 2385 2386 ecblib.staffstart.util.ajaxGet(url, condition, 2387 function (data) { 2388 _self.items = _self.items.concat(data.item); 2389 }, 2390 function () { 2391 _self.total = _self.items.length; 2392 _self.$emit('input', _self.total); 2393 } 2394 ); 2395 }, 2396 getLocation: function() { 2397 var baseUrl = ''; 2398 var urlParam = ''; 2399 var addParam = {}; 2400 const condition = JSON.parse(JSON.stringify(this.condition)); 2401 if(location.href.indexOf('default.aspx') >= 0){ 2402 baseUrl = 'pages/coordinatelist.aspx'; 2403 }else if(location.href.match(/\/.\//)){ 2404 baseUrl = '../../pages/coordinatelist.aspx'; 2405 }else{ 2406 baseUrl = '../pages/coordinatelist.aspx'; 2407 } 2408 if(condition.product_code){ 2409 addParam['product_code'] = condition.product_code; 2410 } 2411 if(condition.sort){ 2412 addParam['sort'] = condition.sort; 2413 } 2414 urlParam = new URLSearchParams(addParam).toString(); 2415 if(urlParam){ 2416 return baseUrl + '?' + urlParam; 2417 }else{ 2418 return baseUrl; 2419 } 2420 }, 2421 getQualification_1: function(item){ 2422 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 2423 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_1.id){ 2424 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2425 } 2426 } 2427 return ''; 2428 }, 2429 getQualification_2: function(item){ 2430 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 2431 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_2.id){ 2432 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2433 } 2434 } 2435 return ''; 2436 }, 2437}, 2438watch: { 2439 condition: function() { 2440 if(!this.disablePagination){ 2441 this.getCoordinates();
2442 this.setMeta(); 2443 } 2444 } 2445} 2446}); 2447// coordinate-list-item-apparel.js 2448Vue.component('coordinate-list-item-apparel', { 2449template: '\ 2450 <div>\ 2451 <div class="coordinate-item--main-img">\ 2452 <figure>\ 2453 <a :href="ecblib.staffstart.uri.coordinateDetail + \'?ss_cid=\' + item.cid">\ 2454 <img :src="item.resized_main_images[0] ? item.resized_main_images[0].m : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ã¤ãªã³ã°ã®ã¤ã¡ã¼ã¸"/>\ 2455 </a>\ 2456 </figure>\ 2457 </div>\ 2458 <div v-if="!commentMode" class="coordinate-item--description">\ 2459 <div class="coordinate-item--description--staff-icon">\ 2460 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 2461 <img :src="getStaffIcon(item.user_resized_images)" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³"/>\ 2462 </a>\ 2463 </div>\ 2464 <div class="coordinate-item--info">\ 2465 <div class="coordinate-item--info--blandname">{{ item.label_name }}</div>\ 2466 <div class="coordinate-item--info--shopname">{{ item.shop_name }}</div>\ 2467 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 2468 <div class="coordinate-item--info--staffname">{{ item.user_name }}</div>\ 2469 </a>\ 2470 </div>\ 2471 </div>\ 2472 <div v-if="commentMode" class="coordinate-item--description-comment">\ 2473 <div class="coordinate-item--description-comment--date">\ 2474 <p>{{ ecblib.staffstart.util.formatDate(item.accept_at) }}</p>\ 2475 </div>\ 2476 <div class="coordinate-item--description-comment--comment">\ 2477 </div>\ 2478 </div>\ 2479 </div>\ 2480', 2481props: ['item', 'commentMode'], 2482data: function() { 2483 return { 2484 }; 2485}, 2486created: function() { 2487}, 2488methods: { 2489 getStaffIcon: function(imgArr) { 2490 if (!imgArr || imgArr.length == 0) return ecblib.staffstart.uri.sorryImg; 2491 2492 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 's';}); 2493 }, 2494 getSize: function(item){ 2495 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0) ; i++){ 2496 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.size.id){ 2497 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value + item.user_attributes[i].user_attribute_type.unit; 2498 } 2499 } 2500 return ''; 2501 }, 2502 getFeature: function(item){ 2503 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 2504 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.feature.id){ 2505 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2506 } 2507 } 2508 return ''; 2509 }, 2510 getQualification1: function(item){ 2511 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 2512 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_1.id){ 2513 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2514 } 2515 } 2516 return ''; 2517 }, 2518 getQualification2: function(item){ 2519 for(var i = 0; i < (item.user_attributes ? item.user_attributes.length : 0); i++){ 2520 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_2.id){ 2521 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 2522 } 2523 } 2524 return ''; 2525 }, 2526} 2527}); 2528// coordinate-list-item-cosme.js 2529Vue.component('coordinate-list-item-cosme', { 2530template: '\ 2531 <div class="coordinate-item-cosme--frame">\ 2532 <div class="coordinate-item-cosme--frame-description">\ 2533 <div class="coordinate-item-cosme--description">\ 2534 <div class="coordinate-item-cosme--description--staff-icon">\ 2535 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 2536 <img :src="getStaffIcon(item.user_resized_images)" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³"/>\ 2537 </a>\ 2538 </div>\ 2539 <div class="coordinate-item-cosme--info">\ 2540 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 2541 <div class="coordinate-item-cosme--info--staffname">{{ item.user_name }}</div>\ 2542 </a>\ 2543 <div class="coordinate-item-cosme--info--skin-type" v-if="skin_type">{{skin_type_name}}ï¼{{ skin_type }}</div>\ 2544 <div class="coordinate-item-cosme--info--skin-color" v-if="skin_color">{{skin_color_name}}ï¼{{ skin_color }}</div>\ 2545 <div class="coordinate-item-cosme--info--eyelid" v-if="eyelid">{{eyelid_name}}ï¼{{ eyelid }}</div>\ 2546 </div>\ 2547 </div>\ 2548 <div class="coordinate-item-cosme--tags" v-if="item.tags && item.tags.length > 0">\ 2549 <ul class="keyword-tag-list">\ 2550 <li v-for="tag in item.tags" :key="tag" class="keyword-tag-item">\{{ tag }}</li>\ 2551 </ul>\ 2552 </div>\ 2553 <div class="coordinate-item-cosme--description-comment" v-if="item.comment">\ 2554 <div class="coordinate-item-cosme--description-comment--date">\ 2555 <p>{{ ecblib.staffstart.util.formatDate(item.accept_at) }}</p>\ 2556 </div>\ 2557 <div class="coordinate-item-cosme--description-comment--comment">\ 2558 {{item.comment}}\ 2559 </div>\ 2560 </div>\ 2561 </div>\ 2562 <div class="coordinate-item-cosme--frame-img">\ 2563 <div class="coordinate-item-cosme--main-img">\ 2564 <figure>\ 2565 <a :href="ecblib.staffstart.uri.coordinateDetail + \'?ss_cid=\' + item.cid">\ 2566 <img :src="(item.products && item.products[0]) ? item.products[0].image_url : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ã¤ãªã³ã°ååã®ã¤ã¡ã¼ã¸"/>\ 2567 </a>\ 2568 </figure>\ 2569 </div>\ 2570 <div class="coordinate-item-cosme--imginfo" v-if="item.products && item.products[0]">\ 2571 <div class="coordinate-item-cosme--imginfo--labelname">{{ item.products[0].label }}</div>\ 2572 <div class="coordinate-item-cosme--imginfo--goodsname">{{ item.products[0].name }}</div>\ 2573 </div>\ 2574 </div>\ 2575 </div>\ 2576', 2577props: ['item'], 2578data: function() { 2579 return { 2580 skin_type: null, 2581 skin_color: null, 2582 eyelid: null, 2583 skin_type_name: ecblib.staffstart.master.user.skin_type.name, 2584 skin_color_name: ecblib.staffstart.master.user.skin_color.name, 2585 eyelid_name: ecblib.staffstart.master.user.eyelid.name, 2586 }; 2587}, 2588created: function() { 2589 const _self = this; 2590 if (Array.isArray(_self.item.user_attributes)) {
2591 _self.item.user_attributes.forEach(function (x) { 2592 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.skin_type.id) _self.skin_type = x.user_attribute_value.display_value; 2593 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.skin_color.id) _self.skin_color = x.user_attribute_value.display_value; 2594 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.eyelid.id) _self.eyelid = x.user_attribute_value.display_value; 2595 }); 2596 } 2597}, 2598methods: { 2599 getStaffIcon: function(imgArr) { 2600 if (!imgArr || imgArr.length == 0) return ecblib.staffstart.uri.sorryImg; 2601 2602 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 's';}); 2603 }, 2604} 2605}); 2606 2607// shop-detail-coordinatelist.js 2608Vue.component('shop-detail-coordinatelist', { 2609template: '\ 2610<div class="shop-detail-coordinatelist">\ 2611 <div class="card-list-frame">\ 2612 <p v-if="!init && !commentMode">\ 2613 <strong>æ¤ç´¢ä¸...</strong>\ 2614 </p>\ 2615 <p v-else-if="items.length == 0 && !commentMode">\ 2616 <strong v-if="notFoundMessage != null">{{notFoundMessage}}</strong>\ 2617 <strong v-else>ãæå®ã®æ¡ä»¶ã«ä¸è´ããã¹ã¿ã¤ãªã³ã°ãè¦ã¤ããã¾ããã§ããã</strong>\ 2618 </p>\ 2619 <div v-for="item in items" :key="item.cid" :class="\'coordinate-item\' + (displayType == displayTypeConst.cosme ? \'-cosme\' : \'\') + (mobile ? \'-mobile\' : \'\') + (commentMode ? \' coordinate-item__small\' : \'\')">\ 2620 <coordinate-list-item-apparel v-if="displayType == displayTypeConst.apparel" :item="item" :comment-mode="commentMode"></coordinate-list-item-apparel>\ 2621 <coordinate-list-item-cosme v-if="displayType == displayTypeConst.cosme" :item="item"></coordinate-list-item-cosme>\ 2622 </div>\ 2623 </div>\ 2624 <div v-if="hasPagination()" class="see-more-btn-block">\ 2625 <button :class="\'see-more-btn\' + (mobile ? \'-mobile\' : \'\')" @click="addPage()">ãã£ã¨è¦ã</button>\ 2626 </div>\ 2627</div>\ 2628', 2629 props: ['value', 'condition', 'commentMode', 'itemsPerPage', 'disablePagination', 'notFoundMessage', 'mobile', 'displayType', 'displayTypeConst', 'listType'], 2630 data: function() { 2631 return { 2632 items: [], 2633 displayLimit: 4, 2634 total: 0, 2635 init: false 2636 }; 2637 }, 2638 created: function() { 2639 this.setOptions(); 2640 this.getCoordinates(); 2641 }, 2642 methods: { 2643 setOptions: function() { 2644 this.displayLimit = this.itemsPerPage || 4; 2645 }, 2646 getCoordinates: function () { 2647 ecblib.staffstart.util.setCanonical(); 2648 const _self = this; 2649 const url = ecblib.staffstart.api.url.coordinateList; 2650 2651 const condition = JSON.parse(JSON.stringify(this.condition)); 2652 if (this.displayType == this.displayTypeConst.cosme) { 2653 condition.add_fields = "comment"; 2654 } 2655 if (this.displayLimit > 0) { 2656 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2657 condition.count = this.displayLimit * (condition[pageindexKey] || 1); 2658 } 2659 2660 ecblib.staffstart.util.ajaxGet(url, condition, 2661 function (data) { 2662 _self.items = data.item; 2663 _self.total = data.total; 2664 _self.$emit('input', data.total); 2665 _self.init = true; 2666 }, 2667 function () { 2668 _self.items = []; 2669 _self.total = 0; 2670 _self.$emit('input', 0); 2671 _self.init = true; 2672 } 2673 ); 2674 }, 2675 2676 hasPagination: function() { 2677 if (this.disablePagination) return false; 2678 2679 return this.total > this.items.length; 2680 }, 2681 addPage: function() { 2682 const _self = this; 2683 const url = ecblib.staffstart.api.url.coordinateList; 2684 2685 const condition = JSON.parse(JSON.stringify(this.condition)); 2686 if (this.displayType == this.displayTypeConst.cosme) { 2687 condition.add_fields = "comment"; 2688 } 2689 if (!this.disablePagination) { 2690 condition.count = this.displayLimit; 2691 condition.offset = this.items.length; 2692 2693 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2694 if (this.condition[pageindexKey]) { 2695 this.condition[pageindexKey]++; 2696 } 2697 else { 2698 this.condition[pageindexKey] = 2; 2699 } 2700 ecblib.staffstart.util.pushHistoryPageIndex(pageindexKey, this.condition); 2701 } 2702 2703 ecblib.staffstart.util.ajaxGet(url, condition, 2704 function (data) { 2705 _self.items = _self.items.concat(data.item); 2706 }, 2707 function () { 2708 _self.total = _self.items.length; 2709 _self.$emit('input', _self.total); 2710 } 2711 ); 2712 }, 2713 getStaffIcon: function(imgArr) { 2714 if (!imgArr || imgArr.length == 0) return ecblib.staffstart.uri.sorryImg; 2715 2716 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 's';}); 2717 }, 2718 }, 2719 watch: { 2720 condition: function() { 2721 this.getCoordinates();
2722 } 2723 } 2724}); 2725// shop-detail-info.js 2726Vue.component('shop-detail-info', { 2727template: '\ 2728<div v-if="shop" :class="\'shop-detail-info-frame\' + (mobile ? \'-mobile\' : \'\')">\ 2729 <div :class="\'shop-detail-info--container\' + (mobile ? \'-mobile\' : \'\')">\ 2730 <div :class="\'shop-detail-info--top-area\' + (mobile ? \'-mobile\' : \'\')">\ 2731 <div :class="\'shop-detail-info--shop-img\' + (mobile ? \'-mobile\' : \'\')">\ 2732 <img :src="shop.main_image_urls && shop.main_image_urls.l ? shop.main_image_urls.l : ecblib.staffstart.uri.sorryImg" alt="åºèç»å" />\ 2733 </div>\ 2734 <div :class="\'shop-detail-info--info\' + (mobile ? \'-mobile\' : \'\')">\ 2735 <p class="shop-detail-info--info--shop-name">{{ shop.name }} </p>\ 2736 <p class="shop-detail-info--info--label">{{ shop.label.name }} </p>\ 2737 <p class="shop-detail-info--info--zip">{{ shop.zip ? \'ã\' + shop.zip : \'\'}} </p>\ 2738 <p class="shop-detail-info--info--address">{{ shop.address }} </p>\ 2739 <p class="shop-detail-info--info--tel">{{ shop.tel }} </p>\ 2740 <p class="shop-detail-info--info--business_hours">{{ shop.business_hours }}\ 2741 <span v-if="shop.shop_holidays">ï¼å®ä¼æ¥ï¼{{ shop.shop_holidays }}ï¼</span>\ 2742 </p>\ 2743 </div>\ 2744 </div>\ 2745 <div :class="\'shop-detail-info--description\' + (mobile ? \'-mobile\' : \'\')" v-html="shop.description"></div>\ 2746 </div>\ 2747</div>\ 2748', 2749props: ['value', 'condition', 'mobile'], 2750data: function () { 2751 return { 2752 shop: null, 2753 }; 2754}, 2755created: function() { 2756 this.getShop(); 2757}, 2758methods: { 2759 getShop: function () { 2760 const _self = this; 2761 const url = ecblib.staffstart.api.url.shopDetail; 2762 2763 ecblib.staffstart.util.ajaxGet(url, this.condition, 2764 function (data) { 2765 _self.shop = data.item[0]; 2766 _self.$emit('input', _self.shop); 2767 }, 2768 function () { 2769 _self.shop = null; 2770 _self.$emit('input', _self.shop); 2771 } 2772 ); 2773 }, 2774}, 2775watch: { 2776 condition: function() { 2777 this.getShop(); 2778 } 2779} 2780}); 2781// shop-detail-stafflist.js 2782Vue.component('shop-detail-stafflist', { 2783template: '\ 2784<div>\ 2785 <section class="shop-detail-stafflist">\ 2786 <p v-if="!init">\ 2787 <strong>æ¤ç´¢ä¸...</strong>\ 2788 </p>\ 2789 <p v-else-if="items.length == 0">\ 2790 <strong v-if="notFoundMessage != null">{{notFoundMessage}}</strong>\ 2791 <strong v-else>ãæå®ã®æ¡ä»¶ã«ä¸è´ããã¹ã¿ãããè¦ã¤ããã¾ããã§ããã</strong>\ 2792 </p>\ 2793 <div v-for="item in items" :key="item.user_id" :class="\'staff-item\' + (mobile ? \'-mobile\' : \'\')">\ 2794 <div class="staff-item--inner">\ 2795 <div class="staff-item--staff-icon">\ 2796 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 2797 <img :src="getStaffIcon(item.resized_images)" alt="ã¹ã¿ããã¢ã¤ã³ã³" />\ 2798 </a>\ 2799 </div>\ 2800 <div class="staff-item--info">\ 2801 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 2802 <p class="staff-item--info--staffname">{{ item.name }}</p>\ 2803 </a>\ 2804 <p class="staff-item--info--bland">{{ item.label_name }}</p>\ 2805 <p class="staff-item--info--shop">{{ item.shop_name }}</p>\ 2806 <p class="staff-item--info--stature">{{ item.height > 0 ? item.height + \'cm\' : \'\' }}</p>\ 2807 </div>\ 2808 </div>\ 2809 </div>\ 2810 </section>\ 2811 \ 2812 <div v-if="hasPagination()" class="shop-detail-stafflist-block-see-more-btn">\ 2813 <button :class="\'shop-detail-stafflist-see-more-btn\' + (mobile ? \'-mobile\' : \'\')" @click="addPage()">ãã£ã¨è¦ã</button>\ 2814 </div>\ 2815</div>\ 2816', 2817 props: ['value', 'condition', 'itemsPerPage', 'disablePagination', 'notFoundMessage', 'mobile', 'listType'], 2818 data: function() { 2819 return { 2820 items: [], 2821 displayLimit: 10, 2822 total: 0, 2823 init: false 2824 }; 2825 }, 2826 created: function() { 2827 this.setOptions(); 2828 this.getStaffs(); 2829 }, 2830 methods: { 2831 setOptions: function() { 2832 this.displayLimit = this.itemsPerPage || 10; 2833 }, 2834 getStaffs: function () { 2835 ecblib.staffstart.util.setCanonical(); 2836 const _self = this; 2837 const url = ecblib.staffstart.api.url.staffList; 2838 2839 const condition = JSON.parse(JSON.stringify(this.condition)); 2840 if (!this.disablePagination) { 2841 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2842 condition.count = this.displayLimit * (condition[pageindexKey] || 1); 2843 } 2844 2845 ecblib.staffstart.util.ajaxGet(url, condition, 2846 function (data) { 2847 _self.items = data.item; 2848 _self.total = data.total; 2849 _self.$emit('input', data.total); 2850 _self.init = true; 2851 }, 2852 function () { 2853 _self.items = []; 2854 _self.total = 0; 2855 _self.$emit('input', 0); 2856 _self.init = true; 2857 } 2858 ); 2859 }, 2860 hasPagination: function() { 2861 if (this.disablePagination) return false; 2862 2863 return this.total > this.items.length; 2864 }, 2865 addPage: function() { 2866 const _self = this; 2867 const url = ecblib.staffstart.api.url.staffList; 2868 2869 const condition = JSON.parse(JSON.stringify(this.condition)); 2870 if (!this.disablePagination) { 2871 condition.count = this.displayLimit; 2872 condition.offset = this.items.length; 2873 2874 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2875 if (this.condition[pageindexKey]) { 2876 this.condition[pageindexKey]++; 2877 } 2878 else { 2879 this.condition[pageindexKey] = 2; 2880 } 2881 ecblib.staffstart.util.pushHistoryPageIndex(pageindexKey, this.condition); 2882 } 2883 2884 ecblib.staffstart.util.ajaxGet(url, condition, 2885 function (data) { 2886 _self.items = _self.items.concat(data.item); 2887 }, 2888 function () { 2889 _self.total = _self.items.length; 2890 _self.$emit('input', _self.total); 2891 } 2892 ); 2893 }, 2894 getStaffIcon: function(imgArr) { 2895 if (!imgArr || imgArr.length === 0) return ecblib.staffstart.uri.sorryImg; 2896 2897 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 'm';}); 2898 }, 2899 }, 2900 watch: { 2901 condition: function() {
2902 this.getStaffs(); 2903 } 2904 } 2905}); 2906// shop-list.js 2907Vue.component('shop-list', { 2908template: '\ 2909<div class="shop-list">\ 2910 <div class="card-list-frame">\ 2911 <p v-if="!init">\ 2912 <strong>æ¤ç´¢ä¸...</strong>\ 2913 </p>\ 2914 <p v-else-if="items.length == 0">\ 2915 <strong v-if="notFoundMessage != null">{{notFoundMessage}}</strong>\ 2916 <strong v-else>ãæå®ã®æ¡ä»¶ã«ä¸è´ããã·ã§ãããè¦ã¤ããã¾ããã§ããã</strong>\ 2917 </p>\ 2918 <div v-for="item in items" :key="item.shop_id" :class="\'shop-item\' + (mobile ? \'-mobile\' : \'\')">\ 2919 <div class="shop-item--img">\ 2920 <figure>\ 2921 <a :href="ecblib.staffstart.uri.shopDetail + \'?ss_shop_id=\' + item.shop_id">\ 2922 <img :src="item.icon_image_urls && item.icon_image_urls.m ? item.icon_image_urls.m : ecblib.staffstart.uri.sorryImg" alt="ã·ã§ããã®ã¤ã¡ã¼ã¸"/>\ 2923 </a>\ 2924 </figure>\ 2925 </div>\ 2926 <div class="shop-item--info">\ 2927 <div class="shop-item--info--name">{{ item.name }}</div>\ 2928 <div class="shop-item--info--label">{{ item.label.name }}</div>\ 2929 <div class="shop-item--info--postal-code">{{ item.zip ? \'ã\' + item.zip : \'\'}}</div>\ 2930 <div class="shop-item--info--address">{{ item.address }}</div>\ 2931 <div class="shop-item--info--phone">{{ item.tel }}</div>\ 2932 <div class="shop-item--info--hours">\ 2933 {{ item.business_hours }}\ 2934 <span v-if="!mobile && item.shop_holidays">ï¼å®ä¼æ¥ï¼{{ item.shop_holidays }}ï¼</span>\ 2935 <div v-if="mobile && item.shop_holidays">ï¼å®ä¼æ¥ï¼{{ item.shop_holidays }}ï¼</div>\ 2936 </div>\ 2937 </div>\ 2938 <a :href="ecblib.staffstart.uri.shopDetail + \'?ss_shop_id=\' + item.shop_id">\ 2939 <div class="shop-item--arrow"></div>\ 2940 </a>\ 2941 </div>\ 2942 </div>\ 2943 <div v-if="hasPagination()" class="see-more-btn-block">\ 2944 <button :class="\'see-more-btn\' + (mobile ? \'-mobile\' : \'\')" @click="addPage()">ãã£ã¨è¦ã</button>\ 2945 </div>\ 2946</div>\ 2947', 2948props: ['value', 'condition', 'itemsPerPage', 'disablePagination', 'notFoundMessage', 'mobile', 'listType'], 2949data: function() { 2950 return { 2951 items: [], 2952 displayLimit: 20, 2953 total: 0, 2954 init: false 2955 }; 2956}, 2957created: function() { 2958 this.setOptions(); 2959 this.getShops(); 2960}, 2961methods: { 2962 setOptions: function() { 2963 this.displayLimit = this.itemsPerPage || 20; 2964 }, 2965 getShops: function () { 2966 ecblib.staffstart.util.setCanonical(); 2967 const _self = this; 2968 const url = ecblib.staffstart.api.url.shopList; 2969 2970 const condition = JSON.parse(JSON.stringify(this.condition)); 2971 if (!this.disablePagination) { 2972 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2973 condition.count = this.displayLimit * (condition[pageindexKey] || 1); 2974 } 2975 2976 ecblib.staffstart.util.ajaxGet(url, condition, 2977 function (data) { 2978 _self.items = data.item; 2979 _self.total = data.total; 2980 _self.$emit('input', data.total); 2981 _self.init = true; 2982 }); 2983 }, 2984 hasPagination: function() { 2985 if (this.disablePagination) return false; 2986 2987 return this.total > this.items.length; 2988 }, 2989 addPage: function() { 2990 const _self = this; 2991 const url = ecblib.staffstart.api.url.shopList; 2992 2993 const condition = JSON.parse(JSON.stringify(this.condition)); 2994 if (!this.disablePagination) { 2995 condition.count = this.displayLimit; 2996 condition.offset = this.items.length; 2997 2998 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 2999 if (this.condition[pageindexKey]) { 3000 this.condition[pageindexKey]++; 3001 } 3002 else { 3003 this.condition[pageindexKey] = 2; 3004 } 3005 ecblib.staffstart.util.pushHistoryPageIndex(pageindexKey, this.condition); 3006 } 3007 3008 ecblib.staffstart.util.ajaxGet(url, condition, 3009 function (data) { 3010 _self.items = _self.items.concat(data.item); 3011 }); 3012 }, 3013 getStaffIcon: function(imgArr) { 3014 if (!imgArr || imgArr.length == 0) return ecblib.staffstart.uri.sorryImg; 3015 3016 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 's';}); 3017 }, 3018}, 3019watch: { 3020 condition: function() {
3021 this.getShops(); 3022 } 3023} 3024}); 3025// staff-simple-info.js 3026Vue.component('staff-simple-info', { 3027template: '\ 3028<div v-if="staff" :class="\'coordinate-detail-staff-info\' + (mobile ? \'-mobile\' : \'\')">\ 3029 <div class="coordinate-detail-staff-info-sub">\ 3030 <div :class="\'coordinate-detail-staff-info--img\' + (mobile ? \'-mobile\' : \'\')">\ 3031 <img :src="getStaffIcon(staff.resized_images)" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³" />\ 3032 </div>\ 3033 <div :class="\'coordinate-detail-staff-info--description\' + (mobile ? \'-mobile\' : \'\')">\ 3034 <p :class="\'coordinate-detail-staff-info--name\' + (mobile ? \'-mobile\' : \'\')">{{ staff.name }}</p>\ 3035 <div v-if="staff.sns.line_staff_start && staff.sns.line_staff_start.link_value && LSS == \'1\'" style="width: 100%"><div class="line-it-button" data-lang="ja" data-type="friend" data-env="REAL" :data-lineId="staff.sns.line_staff_start.link_value" style="display: none;"></div></div>\ 3036 <a :class="\'coordinate-detail-staff-info--shop\' + (mobile ? \'-mobile\' : \'\')" :href="ecblib.staffstart.uri.shopDetail + \'?ss_shop_id=\' + staff.shop_id">{{ staff.label_name }} ï¼ {{ staff.shop_name }}</a>\ 3037 <p :class="\'coordinate-detail-staff-info--height\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.apparel">{{ staff.height > 0 ? \'èº«é· : \' + staff.height + \'cm\' : \'\' }}</p>\ 3038 <p :class="\'coordinate-detail-staff-info--age\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.cosme && staff.age_floor">{{ age_floor_name }}ï¼{{ staff.age_floor }}</p>\ 3039 <p :class="\'coordinate-detail-staff-info--skin-type\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.cosme && skin_type">{{skin_type_name}}ï¼{{ skin_type }}</p>\ 3040 <p :class="\'coordinate-detail-staff-info--skin-color\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.cosme && skin_color">{{skin_color_name}}ï¼{{ skin_color }}</p>\ 3041 <p :class="\'coordinate-detail-staff-info--eyelid\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.cosme && eyelid">{{eyelid_name}}ï¼{{ eyelid }}</p>\ 3042 <p :class="\'coordinate-detail-staff-info--size\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.apparel && size">{{size_name}}ï¼{{ size }}</p>\ 3043 <p :class="\'coordinate-detail-staff-info--feature\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.apparel && feature">{{feature_name}}ï¼{{ feature }}</p>\ 3044 <div v-if="qualification_1 || qualification_2" :class="\'coordinate-detail-staff-info--qualification\' + (mobile ? \'-mobile\' : \'\')">\ 3045 <p :class="\'coordinate-detail-staff-info--qualification_1\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.apparel && qualification_1">{{qualification_1_name}}ï¼{{ qualification_1 }}</p>\ 3046 <p :class="\'coordinate-detail-staff-info--qualification_2\' + (mobile ? \'-mobile\' : \'\')" v-if="displayType==displayTypeConst.apparel && qualification_2">{{qualification_2_name}}ï¼{{ qualification_2 }}</p>\ 3047 </div>\ 3048 <div v-if="dispFlag && !mobile" class="coordinate-detail-staff-info-bookmark">\ 3049 <a data-type="staff" :data-code="staff.user_id" @click="registBookmark" :class="bookmarkid > 0 ? \'coordinate-detail-staff-info-bookmark-registed\' : \'\'" :key="key">\ 3050 <img v-if="bookmarkid > 0" :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue_check.png\'" alt="ãæ°ã«å ¥ã">\ 3051 <img v-else :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue.png\'" alt="ãæ°ã«å ¥ã">\ 3052 <span>{{ bookmarkid > 0 ? \'ãæ°ã«å ¥ãç»é²æ¸\' : \'ãæ°ã«å ¥ãç»é²\' }}</span>\ 3053 </a>\ 3054 </div>\ 3055 </div>\ 3056 </div>\ 3057 <div class="coordinate-detail-staff-info--profile">\ 3058 {{ staff.profile }}\ 3059 </div>\ 3060 <div v-if="dispFlag && mobile" class="coordinate-detail-staff-info-bookmark coordinate-detail-staff-info-bookmark-mobile">\ 3061 <a data-type="staff" :data-code="staff.user_id" @click="registBookmark" :class="bookmarkid > 0 ? \'coordinate-detail-staff-info-bookmark-registed\' : \'\'" :key="key">\ 3062 <img v-if="bookmarkid > 0" :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue_check.png\'" alt="ãæ°ã«å ¥ã">\ 3063 <img v-else :src="EC_WWW_ROOT + \'/img/usr/common/favorite_icon_blue.png\'" alt="ãæ°ã«å ¥ã">\
3064 <span>{{ bookmarkid > 0 ? \'ãæ°ã«å ¥ãç»é²æ¸\' : \'ãæ°ã«å ¥ãç»é²\' }}</span>\ 3065 </a>\ 3066 </div>\ 3067</div>\ 3068', 3069props: ['value', 'condition', 'mobile', 'displayType', 'displayTypeConst'], 3070data: function () { 3071 return { 3072 staff: null, 3073 skin_type: null, 3074 skin_color: null, 3075 eyelid: null, 3076 size: null, 3077 feature: null, 3078 qualification_1:null, 3079 qualification_2:null, 3080 LSS:null, 3081 age_floor_name: ecblib.staffstart.master.ages.name, 3082 skin_type_name: ecblib.staffstart.master.user.skin_type.name, 3083 skin_color_name: ecblib.staffstart.master.user.skin_color.name, 3084 eyelid_name: ecblib.staffstart.master.user.eyelid.name, 3085 size_name: ecblib.staffstart.master.user.size.name, 3086 feature_name: ecblib.staffstart.master.user.feature.name, 3087 qualification_1_name: ecblib.staffstart.master.user.qualification_1.name, 3088 qualification_2_name: ecblib.staffstart.master.user.qualification_2.name, 3089 dispFlag: undefined, 3090 key: 1, 3091 bookmarkid: 0, 3092 }; 3093}, 3094created: function() { 3095 this.getStaff(); 3096 var script = document.createElement('script'); 3097 script.src = "https://www.line-website.com/social-plugins/js/thirdparty/loader.min.js"; 3098 document.head.appendChild(script); 3099}, 3100methods: { 3101 getStaff: function () { 3102 const _self = this; 3103 const url = ecblib.staffstart.api.url.staffDetail; 3104 3105 ecblib.staffstart.util.ajaxGet(url, this.condition, 3106 function (data) { 3107 this.prefix = document.title.split("ã¹ã¿ãã詳細")[0] 3108 this.suffix = document.title.split("ã¹ã¿ãã詳細")[1] 3109 document.title = this.prefix + data.item[0]["name"] + this.suffix 3110 3111 _self.staff = data.item[0]; 3112 _self.staff.age_floor = ecblib.staffstart.util.yearsoldToAge(_self.staff.age); 3113 _self.staff.user_attributes.forEach(function (x) { 3114 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.skin_type.id) _self.skin_type = x.user_attribute_value.display_value; 3115 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.skin_color.id) _self.skin_color = x.user_attribute_value.display_value; 3116 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.eyelid.id) _self.eyelid = x.user_attribute_value.display_value; 3117 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.size.id) _self.size = x.user_attribute_value.display_value + x.user_attribute_type.unit; 3118 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.feature.id) _self.feature = x.user_attribute_value.display_value; 3119 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.qualification_1.id) _self.qualification_1 = x.user_attribute_value.display_value; 3120 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.qualification_2.id) _self.qualification_2 = x.user_attribute_value.display_value; 3121 if (x.user_attribute_type.slug == ecblib.staffstart.master.user.LSS.id) _self.LSS = x.user_attribute_value.slug; 3122 }); 3123 _self.$emit('input', _self.staff); 3124 }, 3125 function () { 3126 _self.staff = null; 3127 _self.$emit('input', _self.staff); 3128 } 3129 ); 3130 }, 3131 getStaffIcon: function(imgArr) { 3132 if (!imgArr || imgArr.length == 0) return ecblib.staffstart.uri.sorryImg; 3133 3134 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 'l';}); 3135 }, 3136 registBookmark: async function(e) { 3137 var result = await ecblib.staffstart.util.StaffStart_RegistBookmark(e.currentTarget, this.bookmarkid); 3138 if(result.result) { 3139 this.bookmarkid = result.bookmarkid; 3140 this.key = this.key + 1; 3141 } 3142 }, 3143}, 3144watch: { 3145 condition: function() { 3146 this.getStaff(); 3147 }, 3148 staff: async function(getsStaff) { 3149 var result = await ecblib.staffstart.util.StaffStart_GetBookmark('staff', getsStaff.user_id); 3150 if(result) { 3151 this.dispFlag = true; 3152 this.bookmarkid = result; 3153 } 3154 } 3155} 3156}); 3157// staff-list.js 3158Vue.component('staff-list', { 3159template: '\ 3160<div>\ 3161 <section class="staff-list">\ 3162 <p v-if="!init">\ 3163 <strong>æ¤ç´¢ä¸...</strong>\ 3164 </p>\ 3165 <p v-else-if="items.length == 0">\ 3166 <strong v-if="notFoundMessage != null">{{notFoundMessage}}</strong>\ 3167 <strong v-else>ãæå®ã®æ¡ä»¶ã«ä¸è´ããã¹ã¿ãããè¦ã¤ããã¾ããã§ããã</strong>\ 3168 </p>\ 3169 <div v-for="(item, index) in items" :key="item.user_id" :class="\'staff-item\' + (mobile ? \'-mobile\' : \'\')">\ 3170 <div class="staff-item--inner">\ 3171 <div class="staff-item--staff-icon">\ 3172 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\
3173 <span v-if="condition.sort === \'pv\' || condition.sort === \'sales\'" :class="\'staff-item--staff-rank\' + (index + 1)">{{ index + 1 }}</span>\ 3174 <img :src="getStaffIcon(item.resized_images)" alt="ã¹ã¿ããã¢ã¤ã³ã³" />\ 3175 </a>\ 3176 </div>\ 3177 <div class="staff-item--info">\ 3178 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 3179 <p class="staff-item--info--staffname">{{ item.name }}</p>\ 3180 </a>\ 3181 <a :href="ecblib.staffstart.uri.shopDetail + \'?ss_shop_id=\' + item.shop_id">\ 3182 <p class="staff-item--info--bland">{{ item.label_name }}</p>\ 3183 <p class="staff-item--info--shop">{{ item.shop_name }}</p>\ 3184 </a>\ 3185 <p class="staff-item--info--size">{{ getSize(item) }}</p>\ 3186 <p class="staff-item--info--feature">{{ getFeature(item) }}</p>\ 3187 <p class="staff-item--info--qualification_1">{{ getQualification_1(item) }}</p>\ 3188 <p class="staff-item--info--qualification_2">{{ getQualification_2(item) }}</p>\ 3189 </div>\ 3190 </div>\ 3191 </div>\ 3192 </section>\ 3193 \ 3194 <div v-if="hasPagination()" class="staff-list-block-see-more-btn">\ 3195 <button :class="\'staff-list-see-more-btn\' + (mobile ? \'-mobile\' : \'\')" @click="addPage()">ãã£ã¨è¦ã</button>\ 3196 </div>\ 3197 <div v-else-if="hasDetail()" class="seemore">\ 3198 <a :href="getLocation()">ãã£ã¨è¦ã</a>\ 3199 </div>\ 3200</div>\ 3201', 3202props: ['value', 'condition', 'itemsPerPage', 'disablePagination', 'notFoundMessage', 'mobile', 'disableDetail', 'conditionForTag', 'listType'], 3203data: function() { 3204 return { 3205 items: [], 3206 displayLimit: 20, 3207 total: 0, 3208 init: false 3209 }; 3210}, 3211created: function() { 3212 this.setOptions(); 3213 this.getStaffs(); 3214 this.setMeta(); 3215}, 3216mounted(){ 3217 this.prefix = document.title.split("ã¹ã¿ããä¸è¦§")[0] 3218 this.suffix = document.title.split("ã¹ã¿ããä¸è¦§")[1] 3219 }, 3220methods: { 3221 setOptions: function() { 3222 this.displayLimit = this.itemsPerPage || 20; 3223 }, 3224 getStaffs: function () { 3225 ecblib.staffstart.util.setCanonical(); 3226 const _self = this; 3227 const url = ecblib.staffstart.api.url.staffList; 3228 3229 const condition = JSON.parse(JSON.stringify(this.condition)); 3230 if (!this.disablePagination || this.displayLimit > 0) { 3231 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 3232 condition.count = this.displayLimit * (condition[pageindexKey] || 1); 3233 } 3234 3235 ecblib.staffstart.util.ajaxGet(url, condition, 3236 function (data) { 3237 _self.items = data.item; 3238 _self.total = data.total; 3239 _self.$emit('input', data.total); 3240 _self.init = true; 3241 }, 3242 function () { 3243 _self.items = []; 3244 _self.total = 0; 3245 _self.$emit('input', 0); 3246 _self.init = true; 3247 } 3248 ); 3249 }, 3250 setMeta : function(){ 3251 if (location.href.indexOf("stafflist.aspx") < 0){ 3252 return 3253 } 3254 3255 var condition 3256 if (this.conditionForTag == undefined){ 3257 condition = JSON.parse(JSON.stringify(this.condition)); 3258 } 3259 else{ 3260 condition = JSON.parse(JSON.stringify(this.conditionForTag)); 3261 } 3262 3263 if (condition.from_age === undefined){ 3264 return; 3265 } 3266 3267 var breadAddElement = document.getElementsByClassName("bread-crumb-item-add"); 3268 if (breadAddElement.length > 0) { 3269 breadAddElement[0].remove(); 3270 } 3271 3272 var contentTitleAddElement = document.getElementsByClassName("content-title-add"); 3273 if (contentTitleAddElement.length > 0) { 3274 contentTitleAddElement[0].remove(); 3275 } 3276 3277 if (condition.gender != null || condition.from_height != null || condition.to_height != null || condition.to_height != null || condition.qualification_1.length > 0 || condition.qualification_2.length > 0 3278 || condition.label_code != null || condition.shop_code != null){ 3279 var searchCondition = ""; 3280 3281 if (condition.gender != null){ 3282 if (condition.gender == "1"){ 3283 searchCondition = "ã¡ã³ãº"; 3284 } else if (condition.gender == "2"){ 3285 searchCondition = "ã¦ã£ã¡ã³ãº"; 3286 } 3287 } 3288 3289 if (condition.from_height != null && condition.to_height != null){ 3290 if (searchCondition == ""){ 3291 searchCondition += condition.from_height + "cm~" + condition.to_height + "cm" 3292 } 3293 else{ 3294 searchCondition += "," + condition.from_height + "cm~" + condition.to_height + "cm" 3295 } 3296 } 3297 3298 if (condition.from_height == null && condition.to_height != null){ 3299 if (searchCondition == ""){ 3300 searchCondition += condition.to_height+ "cm以ä¸" 3301 } 3302 else{ 3303 searchCondition += "," + condition.to_height+ "cm以ä¸" 3304 } 3305 } 3306 3307 if (condition.from_height != null && condition.to_height == null){ 3308 if (searchCondition == ""){ 3309 searchCondition += condition.from_height + "cm以ä¸" 3310 } 3311 else{ 3312 searchCondition += "," + condition.from_height + "cm以ä¸" 3313 } 3314 } 3315 3316 if (condition.qualification_1.length > 0){ 3317 var qualification_1Len = ecblib.staffstart.master.user.qualification_1.items.length; 3318 for (var i = 0; i < condition.qualification_1.length;i++ ){
3319 var qualification_1Name = ""; 3320 for(var j =0; j < qualification_1Len; j++){ 3321 if (condition.qualification_1[i] == ""){ 3322 break; 3323 } 3324 if (condition.qualification_1[i] == ecblib.staffstart.master.user.qualification_1.items[j].id){ 3325 qualification_1Name = ecblib.staffstart.master.user.qualification_1.items[j].name; 3326 break; 3327 } 3328 } 3329 if (qualification_1Name == ""){ 3330 continue; 3331 } 3332 else if (searchCondition == ""){ 3333 searchCondition += qualification_1Name 3334 } 3335 else{ 3336 searchCondition += "," + qualification_1Name 3337 } 3338 } 3339 } 3340 3341 if (condition.qualification_2.length > 0){ 3342 var qualification_2Len = ecblib.staffstart.master.user.qualification_2.items.length; 3343 for (var i = 0; i < condition.qualification_2.length;i++ ){ 3344 var qualification_2Name = ""; 3345 for(var j =0; j < qualification_2Len; j++){ 3346 if (condition.qualification_2[i] == ""){ 3347 break; 3348 } 3349 if (condition.qualification_2[i] == ecblib.staffstart.master.user.qualification_2.items[j].id){ 3350 qualification_2Name = ecblib.staffstart.master.user.qualification_2.items[j].name; 3351 break; 3352 } 3353 } 3354 if (qualification_2Name == ""){ 3355 continue; 3356 } 3357 else if (searchCondition == ""){ 3358 searchCondition += qualification_2Name 3359 } 3360 else{ 3361 searchCondition += "," + qualification_2Name 3362 } 3363 } 3364 } 3365 3366 if (condition.label_code != null){ 3367 var labelName = ""; 3368 var labelLen = ecblib.staffstart.master.labels.length; 3369 for(var i =0; i < labelLen; i++){ 3370 if (condition.label_code == ecblib.staffstart.master.labels[i].id){ 3371 labelName = ecblib.staffstart.master.labels[i].name; 3372 break; 3373 } 3374 } 3375 3376 if (searchCondition == ""){ 3377 searchCondition += labelName 3378 } 3379 else{ 3380 searchCondition += "," + labelName 3381 } 3382 } 3383 3384 if (condition.shop_code != null){ 3385 var shopName = ""; 3386 var shopLen = ecblib.staffstart.master.shops.length; 3387 for(var i =0; i < shopLen; i++){ 3388 if (condition.shop_code == ecblib.staffstart.master.shops[i].id){ 3389 shopName = ecblib.staffstart.master.shops[i].name; 3390 break; 3391 } 3392 } 3393 if (searchCondition == ""){ 3394 searchCondition += shopName 3395 } 3396 else{ 3397 searchCondition += "," + shopName 3398 } 3399 } 3400 3401 jQuery('.bread-crumb-list').append(' <li class="bread-crumb-item-add"><span> > '+ searchCondition + '</span></li>'); 3402 jQuery('.staff-contents-content-title:last').append(' <span class ="content-title-add"> > '+ searchCondition + '</span>'); 3403 3404 if (this.prefix != undefined || this.suffix != undefined){ 3405 document.title = this.prefix + searchCondition + this.suffix; 3406 } 3407 } 3408 else{ 3409 if (this.prefix != undefined || this.suffix != undefined){ 3410 document.title = this.prefix + 'ã¹ã¿ããä¸è¦§' + this.suffix; 3411 } 3412 3413 } 3414 }, 3415 hasPagination: function() { 3416 if (this.disablePagination) return false; 3417 3418 return this.total > this.items.length; 3419 }, 3420 hasDetail: function() { 3421 if (this.disableDetail) return false; 3422 3423 return this.total > this.items.length; 3424 }, 3425 addPage: function() { 3426 const _self = this; 3427 const url = ecblib.staffstart.api.url.staffList; 3428 3429 const condition = JSON.parse(JSON.stringify(this.condition)); 3430 if (!this.disablePagination) { 3431 condition.count = this.displayLimit; 3432 condition.offset = this.items.length; 3433 3434 const pageindexKey = "ss_pageindex" + (this.listType ? "_" + this.listType : "") ; 3435 if (this.condition[pageindexKey]) { 3436 this.condition[pageindexKey]++; 3437 } 3438 else { 3439 this.condition[pageindexKey] = 2; 3440 } 3441 ecblib.staffstart.util.pushHistoryPageIndex(pageindexKey, this.condition); 3442 } 3443 3444 ecblib.staffstart.util.ajaxGet(url, condition, 3445 function (data) { 3446 _self.items = _self.items.concat(data.item); 3447 }, 3448 function () { 3449 _self.total = _self.items.length; 3450 _self.$emit('input', _self.total); 3451 } 3452 ); 3453 }, 3454 getStaffIcon: function(imgArr) { 3455 if (!imgArr || imgArr.length === 0) return ecblib.staffstart.uri.sorryImg; 3456 3457 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 'm';}); 3458 }, 3459 getSize: function(item){ 3460 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 3461 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.size.id){ 3462 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value + item.user_attributes[i].user_attribute_type.unit; 3463 } 3464 } 3465 return ''; 3466 }, 3467 getFeature: function(item){ 3468 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 3469 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.feature.id){ 3470 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 3471 } 3472 } 3473 return ''; 3474 }, 3475 getQualification_1: function(item){ 3476 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 3477 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_1.id){ 3478 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 3479 } 3480 } 3481 return ''; 3482 }, 3483 getQualification_2: function(item){ 3484 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 3485 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_2.id){ 3486 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 3487 } 3488 } 3489 return ''; 3490 }, 3491 getLocation: function() { 3492 var baseUrl = ''; 3493 var urlParam = ''; 3494 var addParam = {}; 3495 const condition = JSON.parse(JSON.stringify(this.condition)); 3496 if(location.href.indexOf('default.aspx') >= 0){
3497 baseUrl = 'pages/stafflist.aspx'; 3498 }else if(location.href.match(/\/.\//)){ 3499 baseUrl = '../../pages/stafflist.aspx'; 3500 }else{ 3501 baseUrl = '../pages/stafflist.aspx'; 3502 } 3503 if(condition.sort){ 3504 addParam['sort'] = condition.sort; 3505 } 3506 urlParam = new URLSearchParams(addParam).toString(); 3507 if(urlParam){ 3508 return baseUrl + '?' + urlParam; 3509 }else{ 3510 return baseUrl; 3511 } 3512 } 3513}, 3514filters: { 3515 capitalize: function (value) { 3516 if (!value) return '' 3517 value = value.toString() 3518 return value.charAt(0).toUpperCase() + value.slice(1) 3519 } 3520}, 3521watch: { 3522 condition: function() { 3523 if(!this.disablePagination){ 3524 this.getStaffs(); 3525 } 3526 this.setMeta(); 3527 } 3528} 3529}); 3530// assessment.js 3531Vue.component('assessment', { 3532template: '\ 3533<div v-if="assessment" :class="\'assessment\' + (wideStyle ? \' assessment--wide\' : \'\')">\ 3534 <div class="assessment-title">{{assessment.title}}</div>\ 3535 <div class="assessment-score">\ 3536 <div>{{assessment.feature_name_from}}</div>\ 3537 <div v-for="i of sizeImpl" :class="getScoreBoxClass(i)"></div>\ 3538 <div>{{assessment.feature_name_to}}</div>\ 3539 </div>\ 3540</div>\ 3541', 3542props: ['assessment', 'size', 'wideStyle', 'scoreType', 'mobile'], 3543data: function() { 3544 return { 3545 sizeImpl: this.size || 5, 3546 scoreTypeImpl: this.scoreType || 'dot', 3547 }; 3548}, 3549methods: { 3550 getScoreBoxClass: function(i) { 3551 let name = 'assessment-score-box'; 3552 switch (this.scoreTypeImpl) { 3553 case 'fill': 3554 name += this.assessment.value >= i ? ' assessment-score-box__active' : ''; 3555 break; 3556 case 'fill-reverse': 3557 name += this.assessment.value <= i ? ' assessment-score-box__active' : ''; 3558 break; 3559 default: 3560 name += this.assessment.value == i ? ' assessment-score-box__active' : ''; 3561 break; 3562 } 3563 3564 return name; 3565 } 3566} 3567}); 3568 3569// staff-review-info.js 3570Vue.component('staff-review-info', { 3571template: '\ 3572<div v-if="staffreview" :class="\'staff-review-detail-staff-info\' + (mobile ? \'-mobile\' : \'\')">\ 3573 <div class="staff-review-detail-staff-info--info">\ 3574 <div class="staff-review-detail-staff-info--img">\ 3575 <img :src="staffreview.user_image_url ? staffreview.user_image_url : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³" />\ 3576 </div>\ 3577 <div class="staff-review-detail-staff-info--description">\ 3578 <p class="staff-review-detail-staff-info--shop">{{ staffreview.shop.name }}</p>\ 3579 <p class="staff-review-detail-staff-info--label">{{ staffreview.label.name }}</p>\ 3580 <p class="staff-review-detail-staff-info--name">{{ staffreview.user.name }}</p>\ 3581 <p class="staff-review-detail-staff-info--height">{{ staffreview.user.height > 0 ? staffreview.user.height + \'cm\' : \'\' }}</p>\ 3582 </div>\ 3583 </div>\ 3584 <div class="staff-review-detail-date">\ 3585 <p>ã¬ãã¥ã¼å ¬éæ¥ {{ ecblib.staffstart.util.formatDate(staffreview.published_at) }}</p>\ 3586 </div>\ 3587 <p class="staff-review-detail-staff-info--title">{{ staffreview.title }}</p>\ 3588 <div class="staff-review-detail-keyword">\ 3589 <ul class="keyword-tag-list">\ 3590 <li v-for="tag in staffreview.tags" :key="tag" class="keyword-tag-item">\ 3591 <a :href="ecblib.staffstart.uri.staffreviewList + \'?tag_id=\' + tag.tag_id + \'&tag_name=\' + encodeURI(tag.name)">{{ tag.name }}</a>\ 3592 </li>\ 3593 </ul>\ 3594 <p class="staff-review-detail-staff-info--comment">{{ staffreview.comment }}</p>\ 3595 </div>\ 3596</div>\ 3597', 3598props: ['staffreview', 'mobile'], 3599});// staff-review-sub-products.js 3600Vue.component('staff-review-sub-products', { 3601 template: '\ 3602 <div v-if="staffreview" class="staff-review-detail-sub-products">\ 3603 <ul class="staff-review-detail-sub-products-list">\ 3604 <li v-for="item in staffreview.sub_products" :key="item.product_code" :class="\'staff-review-detail-sub-product\' + (mobile ? \'-mobile\' : \'\')">\ 3605 <a :href="item.product_url">\ 3606 <img :src="item.image_url || ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ã¤ãªã³ã°ã«ä½¿ç¨ããã¦ããã¢ã¤ãã " />\ 3607 </a>\ 3608 <div class="staff-review-detail-sub-products--despcription">\ 3609 <p class="staff-review-detail-sub-products--label">{{ item.label.name }}</p>\ 3610 <p class="staff-review-detail-sub-products--name">{{ item.name }}</p>\ 3611 <p class="staff-review-detail-sub-products--price">\
3612 <span class="selling-price">Â¥ {{ Number(item.selling_price).toLocaleString(\'ja\') }}</span>\ 3613 <span>+ç¨</span>\ 3614 </p>\ 3615 </div>\ 3616 <div class="staff-review-detail-sub-products-item--see-btn">\ 3617 <a :href="item.product_url">ååãè¦ã</a>\ 3618 </div>\ 3619 </li>\ 3620 </ul>\ 3621 </div>\ 3622 ', 3623 props: ['staffreview', 'mobile'] 3624}); 3625// staff-review-viewer.js 3626Vue.component('staff-review-viewer', { 3627template: '\ 3628<section :class="\'staff-review-detail-img-frame\' + (mobile ? \'-mobile\' : \'\')">\ 3629 <div class="staff-review-detail-img-main">\ 3630 <img v-if="selectedImage" :src="selectedImage.l ? selectedImage.l : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ããã¬ãã¥ã¼åç" />\ 3631 </div>\ 3632 <ul class="staff-review-detail-img-list">\ 3633 <li\ 3634 v-for="image in smallImages"\ 3635 :key="image"\ 3636 @click="selectedImage = image"\ 3637 :class="\'staff-review-detail-img-item\' + (mobile ? \'-mobile\' : \'\')"\ 3638 >\ 3639 <img :src="image.m ? image.m : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ããã¬ãã¥ã¼åç" />\ 3640 </li>\ 3641 </ul>\ 3642 <div class="staff-review-detail-img-description">\ 3643 <p class="staff-review-detail-img-description--label">{{ staffreview.label.name }}</p>\ 3644 <p class="staff-review-detail-img-description--name">{{ staffreview.main_product.name }}</p>\ 3645 <p class="staff-review-detail-img-description--price">\ 3646 <span class="selling-price">Â¥ {{ Number(staffreview.main_product.selling_price).toLocaleString(\'ja\') }}</span>\ 3647 <span>+ç¨</span>\ 3648 </p>\ 3649 <div class="staff-review-detail-img-description--see-btn">\ 3650 <a :href="staffreview.main_product.product_url">ååãè¦ã</a>\ 3651 </div>\ 3652 </div>\ 3653</section>\ 3654', 3655props: ['staffreview', 'mobile'], 3656data: function() { 3657 return { 3658 selectedImage: null, 3659 smallImages: [], 3660 }; 3661}, 3662created: function() { 3663 this.initSelectedImage(); 3664 this.getSmallImages(); 3665}, 3666methods: { 3667 initSelectedImage: function() { 3668 this.selectedImage = this.staffreview.main_image_url || ecblib.staffstart.uri.sorryImg; 3669 }, 3670 getSmallImages: function() { 3671 // this.smallImages = [this.staffreview.main_image_url].concat(this.staffreview.sub_image_urls) 3672 // .map(function(i) { return i || ecblib.staffstart.uri.sorryImg}); 3673 this.smallImages = this.staffreview.sub_image_urls; 3674 }, 3675}, 3676watch: { 3677 'staffreview.main_image_url': function() { 3678 this.initSelectedImage(); 3679 }, 3680 'staffreview.sub_image_urls': function() { 3681 this.getSmallImages(); 3682 }, 3683} 3684}); 3685// staff-review-list.js 3686Vue.component('staff-review-list', { 3687 template: '\ 3688 <div class="staff-review-list">\ 3689 <div class="card-list-frame">\ 3690 <p v-if="!init">\ 3691 <strong>æ¤ç´¢ä¸...</strong>\ 3692 </p>\ 3693 <p v-else-if="items.length == 0">\ 3694 <strong v-if="notFoundMessage != null">{{notFoundMessage}}</strong>\ 3695 <strong>ãæå®ã®æ¡ä»¶ã«ä¸è´ããã¹ã¿ããã¬ãã¥ã¼ãè¦ã¤ããã¾ããã§ããã</strong>\ 3696 </p>\ 3697 <div v-for="item in items" :key="item.id" v-if="item.id != excludeId" :class="\'staff-review-item\' + (mobile ? \'-mobile\' : \'\')">\ 3698 <div v-if="!detail" class="staff-review-item--staff">\ 3699 <div class="staff-review-item--staff--staff-icon">\ 3700 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 3701 <img :src="getStaffIcon(item.id.main_image_url)" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³"/>\ 3702 </a>\ 3703 </div>\ 3704 <div class="staff-review-item--info">\ 3705 <div class="staff-review-item--info--shopname">{{ item.shop.name }}</div>\ 3706 <div class="staff-review-item--info--blandname">{{ item.label.name }}</div>\ 3707 <div class="staff-review-item--info--staffname">{{ item.user.name }}</div>\ 3708 <div class="staff-review-item--info--stature">{{ item.user.height > 0 ? item.user.height + \'cm\' : \'\'}}</div>\ 3709 </div>\ 3710 </div>\ 3711 <div class="staff-review-item--title">{{ item.title }}</div>\ 3712 <ul class="staff-review-item--tag--list">\ 3713 <li v-for="tag in item.tags" :key="tag" class="staff-review-item--tag--item">{{tag.name}}</li>\ 3714 </ul>\ 3715 <div class="staff-review-item--comment">{{ item.comment }}</div>\ 3716 <div class="staff-review-item--published">{{ ecblib.staffstart.util.formatDate(item.published_at) }}</div>\
3717 <div v-if="item.assessments" class="staff-review-item--assessment">\ 3718 <div v-for="assessment in item.assessments">\ 3719 <assessment :assessment="assessment" :mobile="mobile"></assessment>\ 3720 </div>\ 3721 </div>\ 3722 <div class="staff-review-item--product">\ 3723 <div class="staff-review-item--product--img">\ 3724 <a :href="item.main_product.product_url">\ 3725 <img :src="item.main_product.product_image_url || ecblib.staffstart.uri.sorryImg" alt="ç´ä»ãååç»å" />\ 3726 </a>\ 3727 </div>\ 3728 <div class="staff-review-item--product--info">\ 3729 <div class="staff-review-item--product--label">{{ item.main_product.label.name }}</div>\ 3730 <div class="staff-review-item--product--name">{{ item.main_product.name }}</div>\ 3731 <div class="staff-review-item--product--price">Â¥ {{ Number(item.main_product.selling_price).toLocaleString(\'ja\') }}</div>\ 3732 </div>\ 3733 </div>\ 3734 <div class="staff-review-see-review-btn-block">\ 3735 <a :href="ecblib.staffstart.uri.staffreviewDetail + \'?ss_rid=\' + item.id">ã¬ãã¥ã¼ãè¦ã</>\ 3736 </div>\ 3737 </div>\ 3738 </div>\ 3739 <div v-if="hasPagination()" class="see-more-btn-block">\ 3740 <button :class="\'see-more-btn\' + (mobile ? \'-mobile\' : \'\')" @click="addPage()">ãã£ã¨è¦ã</button>\ 3741 </div>\ 3742 </div>\ 3743 ', 3744 props: ['value', 'condition', 'excludeId', 'itemsPerPage', 'disablePagination', 'notFoundMessage', 'detail', 'mobile'], 3745 components: { 3746 3747 }, 3748 data: function() { 3749 return { 3750 items: [], 3751 displayLimit: 20, 3752 total: 0, 3753 init: false 3754 }; 3755 }, 3756 created: function() { 3757 this.setOptions(); 3758 this.getStaffreviews(); 3759 }, 3760 methods: { 3761 setOptions: function() { 3762 this.displayLimit = this.itemsPerPage || 20; 3763 }, 3764 getStaffreviews: function () { 3765 const _self = this; 3766 const url = ecblib.staffstart.api.url.staffreviewList; 3767 3768 const condition = JSON.parse(JSON.stringify(this.condition)); 3769 if (this.displayLimit > 0) { 3770 condition.count = this.displayLimit + ( this.excludeId ? 1 : 0);; 3771 } 3772 3773 ecblib.staffstart.util.ajaxGet(url, condition, 3774 function (data) { 3775 const ret = _self._checkAndModifyList_fromExcludeId(data.item); 3776 3777 _self.items = ret.list; 3778 _self.total = data.total - (ret.exist ? 1 : 0); 3779 _self.$emit('input', _self.total); 3780 _self.init = true; 3781 }, 3782 function () { 3783 _self.items = []; 3784 _self.total = 0; 3785 _self.$emit('input', 0); 3786 _self.init = true; 3787 } 3788 ); 3789 }, 3790 3791 hasPagination: function() { 3792 if (this.disablePagination) return false; 3793 3794 return this.total > this.items.length; 3795 }, 3796 addPage: function() { 3797 const _self = this; 3798 const url = ecblib.staffstart.api.url.staffreviewList; 3799 3800 const condition = JSON.parse(JSON.stringify(this.condition)); 3801 if (!this.disablePagination) { 3802 condition.count = this.displayLimit + ( this.excludeId ? 1 : 0);; 3803 condition.offset = this.items.length; 3804 } 3805 3806 ecblib.staffstart.util.ajaxGet(url, condition, 3807 function (data) { 3808 const ret = _self._checkAndModifyList_fromExcludeId(data.item); 3809 3810 _self.items = _self.items.concat(ret.list); 3811 if (ret.exist) { 3812 _self.$emit('input', --_self.total); 3813 } 3814 }, 3815 function () { 3816 _self.total = _self.items.length; 3817 _self.$emit('input', _self.total); 3818 } 3819 ); 3820 }, 3821 getStaffIcon: function(imgArr) { 3822 if (!imgArr || imgArr.length == 0) return ecblib.staffstart.uri.sorryImg; 3823 3824 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 's';}); 3825 }, 3826 _checkAndModifyList_fromExcludeId: function(items) { 3827 const _self = this; 3828 return items.some(function(i) { return i.id == _self.excludeId; }) ? 3829 {exist: true, list: items} : 3830 {exist: false, list: items.splice(0, this.displayLimit)}; 3831 }, 3832 }, 3833 watch: { 3834 condition: function() {
3835 this.getStaffreviews(); 3836 } 3837 } 3838}); 3839 3840Vue.component('select-goods', { 3841 template: '\ 3842 <div class="select-goods" v-if="condition.product_code">\ 3843 <p class="select-goods-title">é¸æä¸ã®åå</p>\ 3844 <div class="select-goods-img">\ 3845 <a :href="goodsPath">\ 3846 <img :src="imgPath">\ 3847 </a>\ 3848 </div>\ 3849 <div class="select-goods-name">\ 3850 <p class="goods_name_" :title="goodsName">{{ goodsName }}</p>\ 3851 </div>\ 3852 </div>\ 3853 ', 3854 props: ['condition'], 3855 components: { 3856 3857 }, 3858 data: function() { 3859 return { 3860 goodsPath: '', 3861 imgPath: '', 3862 goodsName: '' 3863 }; 3864 }, 3865 created: function() { 3866 this.setGoodsInfo() 3867 }, 3868 methods: { 3869 setGoodsInfo: function() { 3870 const _self = this; 3871 const condition = JSON.parse(JSON.stringify(this.condition)); 3872 if(condition.product_code !== '' && condition.product_code !== undefined){ 3873 jQuery.ajax({ 3874 type: 'GET', 3875 url: '../goods/goodsapi.aspx', 3876 datatype: 'json', 3877 data: { 3878 goods: condition.product_code, 3879 top: '1', 3880 type: 'json' 3881 } 3882 }).done(function(data){ 3883 var json = JSON.parse(JSON.stringify(data).replaceAll("\\","").slice(1,-1))[0]; 3884 _self.goodsPath = json.goods_path; 3885 _self.imgPath = json.src_l; 3886 _self.goodsName = json.name 3887 }); 3888 } 3889 } 3890 }, 3891 watch: { 3892 condition: function() { 3893 this.setGoodsInfo(); 3894 } 3895 } 3896}); 3897 3898Vue.component('search-condition-size', { 3899template: '\ 3900<div class="search-condition-size">\ 3901 <div :class="getLabelClass()" @click="isShow = !isShow">é´ã®ãµã¤ãº</div>\ 3902 <transition name="slide">\ 3903 <ul v-show="!mobile || isShow" class="menubox-list">\ 3904 <li v-for="size in sizes" :key="size.id" class="menubox-item">\ 3905 <label>\ 3906 <input type="checkbox" :value="size.id" :checked="value && value.some(function(id){return id == size.id;})" @change="changeSize(size.id)" />\ 3907 <span>{{ size.name }}</span>\ 3908 </label>\ 3909 </li>\ 3910 </ul>\ 3911 </transition>\ 3912</div>\ 3913', 3914props: ['value', 'kids', 'mobile'], 3915data: function() { 3916 return { 3917 sizes: [], 3918 isShow: false, 3919 }; 3920}, 3921created: function() { 3922 this.getSizes(); 3923}, 3924methods: { 3925 getSizes: function() { 3926 this.sizes = ecblib.staffstart.master.user.size.items; 3927 }, 3928 getLabelClass: function() { 3929 let result = ''; 3930 3931 if (this.mobile) { 3932 result += ' label-mobile'; 3933 3934 if (this.isShow) { 3935 result += ' label-mobile__open'; 3936 } 3937 } else { 3938 result += ' label'; 3939 } 3940 3941 return result; 3942 }, 3943 changeSize: function(id) { 3944 if(!this.value) return; 3945 const _self = this; 3946 3947 var index = -1; 3948 const isChecked = this.value.some(function(sizeId, i){ 3949 if(sizeId == id) { 3950 index = i; 3951 return true; 3952 } 3953 }); 3954 3955 if (!isChecked && this.value.length >= 10) { 3956 alert('åæã«é¸æã§ãããµã¤ãºæ¡ä»¶ã¯10件ã¾ã§ã§ãã'); 3957 3958 // åæç»ãå¼·å¶ 3959 const sizeData = JSON.parse(JSON.stringify(this.sizes)); 3960 this.sizes = []; 3961 3962 this.$nextTick(function(){ 3963 _self.sizes = sizeData; 3964 }); 3965 } else { 3966 const result = isChecked ? this.value.filter(function(sizeId){return sizeId !== id;}) : this.value.concat([id]); 3967 3968 this.$emit('input', result); 3969 } 3970 }, 3971} 3972}); 3973 3974Vue.component('search-condition-feature', { 3975template: '\ 3976<div class="search-condition-feature">\ 3977 <div :class="getLabelClass()" @click="isShow = !isShow">足ã®ã¿ã¤ã</div>\ 3978 <transition name="slide">\ 3979 <ul v-show="!mobile || isShow" class="menubox-list">\ 3980 <li v-for="feature in features" :key="feature.id" class="menubox-item">\ 3981 <label>\ 3982 <input type="radio" :value="feature.id" :checked="value == feature.id" @change="$emit(\'input\', String($event.target.value))" />\ 3983 <span>{{ feature.name }}</span>\ 3984 </label>\ 3985 </li>\ 3986 </ul>\ 3987 </transition>\ 3988</div>\ 3989', 3990props: ['value', 'kids', 'mobile'], 3991data: function() { 3992 return { 3993 features: [], 3994 isShow: false, 3995 }; 3996}, 3997created: function() { 3998 this.getFeatures(); 3999}, 4000methods: { 4001 getFeatures: function() {
4002 this.features = ecblib.staffstart.master.user.feature.items; 4003 }, 4004 getLabelClass: function() { 4005 let result = ''; 4006 4007 if (this.mobile) { 4008 result += ' label-mobile'; 4009 4010 if (this.isShow) { 4011 result += ' label-mobile__open'; 4012 } 4013 } else { 4014 result += ' label'; 4015 } 4016 4017 return result; 4018 }, 4019} 4020}); 4021 4022// qualification_1.js 4023Vue.component('search-condition-qualification_1', { 4024 template: '\ 4025 <div class="search-condition-qualification_1">\ 4026 <div :class="getLabelClass()" @click="isShow = !isShow">ãã£ããã£ã³ã°è³æ ¼</div>\ 4027 <transition name="slide">\ 4028 <ul v-show="!mobile || isShow" class="menubox-list">\ 4029 <li v-for="qualification_1 in qualification_1s" :key="qualification_1.id" class="menubox-item">\ 4030 <label>\ 4031 <input type="checkbox" :value="qualification_1.id" :checked="value && value.some(function(id){return id == qualification_1.id;})" @change="changeQualification1(qualification_1.id)" />\ 4032 <span>{{ qualification_1.name }}</span>\ 4033 </label>\ 4034 </li>\ 4035 </ul>\ 4036 </transition>\ 4037 </div>\ 4038 ', 4039 props: ['value', 'kids', 'mobile'], 4040 data: function() { 4041 return { 4042 qualification_1s: [], 4043 isShow: false, 4044 }; 4045 }, 4046 created: function() { 4047 this.getqualification_1(); 4048 }, 4049 methods: { 4050 getqualification_1: function() { 4051 this.qualification_1s = ecblib.staffstart.master.user.qualification_1.items; 4052 }, 4053 getLabelClass: function() { 4054 let result = ''; 4055 4056 if (this.mobile) { 4057 result += ' label-mobile'; 4058 4059 if (this.isShow) { 4060 result += ' label-mobile--open'; 4061 } 4062 } else { 4063 result += ' label'; 4064 } 4065 4066 return result; 4067 }, 4068 changeQualification1: function(id) { 4069 if(!this.value) return; 4070 const _self = this; 4071 4072 var index = -1; 4073 const isChecked = this.value.some(function(qualification1Id, i){ 4074 if(qualification1Id == id) { 4075 index = i; 4076 return true; 4077 } 4078 }); 4079 4080 const result = isChecked ? this.value.filter(function(qualification1Id){return qualification1Id !== id;}) : this.value.concat([id]); 4081 this.$emit('input', result); 4082 }, 4083 }, 4084}); 4085 4086// qualification_2.js 4087Vue.component('search-condition-qualification_2', { 4088 template: '\ 4089 <div class="search-condition-qualification_2">\ 4090 <div :class="getLabelClass()" @click="isShow = !isShow">ã¡ã³ããã³ã¹è³æ ¼</div>\ 4091 <transition name="slide">\ 4092 <ul v-show="!mobile || isShow" class="menubox-list">\ 4093 <li v-for="qualification_2 in qualification_2s" :key="qualification_2.id" class="menubox-item">\ 4094 <label>\ 4095 <input type="checkbox" :value="qualification_2.id" :checked="value && value.some(function(id){return id == qualification_2.id;})" @change="changeQualification2(qualification_2.id)" />\ 4096 <span>{{ qualification_2.name }}</span>\ 4097 </label>\ 4098 </li>\ 4099 </ul>\ 4100 </transition>\ 4101 </div>\ 4102 ', 4103 props: ['value', 'kids', 'mobile'], 4104 data: function() { 4105 return { 4106 qualification_2s: [], 4107 isShow: false, 4108 }; 4109 }, 4110 created: function() { 4111 this.getqualification_2(); 4112 }, 4113 methods: { 4114 getqualification_2: function() { 4115 this.qualification_2s = ecblib.staffstart.master.user.qualification_2.items; 4116 }, 4117 getLabelClass: function() { 4118 let result = ''; 4119 4120 if (this.mobile) { 4121 result += ' label-mobile'; 4122 4123 if (this.isShow) { 4124 result += ' label-mobile--open'; 4125 } 4126 } else { 4127 result += ' label'; 4128 } 4129 4130 return result; 4131 }, 4132 changeQualification2: function(id) { 4133 if(!this.value) return; 4134 const _self = this; 4135 4136 var index = -1; 4137 const isChecked = this.value.some(function(qualification2Id, i){ 4138 if(qualification2Id == id) { 4139 index = i; 4140 return true; 4141 } 4142 }); 4143 4144 const result = isChecked ? this.value.filter(function(qualification2Id){return qualification2Id !== id;}) : this.value.concat([id]); 4145 this.$emit('input', result); 4146 }, 4147 }, 4148}); 4149 4150// coordinate-detail-title.js 4151Vue.component('coordinate-detail-title', { 4152 template: '\ 4153 <h1 class="coordinate-detail-title">\
4154 {{ coordinate.products[0].name }}ã使ã£ãã¹ã¿ã¤ãªã³ã°\ 4155 </h1>\ 4156 ', 4157 props: ['coordinate'], 4158}); 4159 4160// coordinate-bookmark-list.js 4161Vue.component('coordinate-bookmark-list', { 4162 template: '\ 4163 <div class="coordinate-list">\ 4164 <div v-if="notDeletedItems.length > 0" class="block-favorite--pager-top">\ 4165 <div class="pager">\ 4166 <div class="pager-total"><span class="pager-count"><span>{{ notDeletedItems.length }}</span>件</span></div>\ 4167 </div>\ 4168 </div>\ 4169 <div class="card-list-frame" id="ss_cordinate_list">\ 4170 <p v-if="init == false">\ 4171 <strong>ãæ°ã«å ¥ãæ å ±ãåå¾ãã¦ãã¾ã...</strong>\ 4172 </p>\ 4173 <p v-else-if="notDeletedItems.length == 0">\ 4174 <strong>ãæ°ã«å ¥ãç»é²ãããã¹ã¿ã¤ãªã³ã°ã¯ããã¾ããã</strong>\ 4175 </p>\ 4176 <div v-for="item in displayItems" :key="item.cid" class="js-coordinate-tile" :class="\'coordinate-item\' + (mobile ? \'-mobile\' : \'\')">\ 4177 <coordinate-bookmark-list-item-apparel :item="item"></coordinate-bookmark-list-item-apparel>\ 4178 </div>\ 4179 </div>\ 4180 <bookmark-pagenation :items-per-page="itemsPerPage" :total="notDeletedItems.length" :current-page="currentPage" @input="currentPage = $event"></bookmark-pagenation>\ 4181 </div>\ 4182 ', 4183 props: ['value', 'condition', 'mobile', 'itemsPerPage'], 4184 data: function() { 4185 return { 4186 items: [], 4187 init: false, 4188 currentPage: 1, 4189 }; 4190 }, 4191 created: function() { 4192 this.getCoordinates(); 4193 }, 4194 methods: { 4195 getCoordinates: function () { 4196 const _self = this; 4197 const url = ecblib.staffstart.api.url.coordinateList; 4198 const condition = JSON.parse(JSON.stringify(this.condition)); 4199 4200 ecblib.staffstart.util.ajaxGet(url, condition, 4201 function (data) { 4202 data.item.forEach(child => { 4203 let filtered_arr = condition.cid_array.filter(arr_item => arr_item.cid == child.cid); 4204 child["bookmarkid"] = filtered_arr.length == 1 ? filtered_arr[0].bookmark_id : ""; 4205 child["regist_date"] = filtered_arr.length == 1 ? filtered_arr[0].regist_date : ""; 4206 child["deleted"] = false; 4207 }); 4208 _self.items = data.item; 4209 _self.$emit('input', data.total); 4210 _self.init = true; 4211 _self.updateTile(); 4212 }, 4213 function () { 4214 _self.items = []; 4215 _self.$emit('input', 0); 4216 _self.init = true; 4217 } 4218 ); 4219 }, 4220 updateTile: function(){ 4221 this.$nextTick(() => { 4222 if(this.mobile) { 4223 jQuery("#ss_cordinate_list").find(".js-coordinate-tile .coordinate-item--description").tile(2); 4224 } else { 4225 jQuery("#ss_cordinate_list").find(".js-coordinate-tile .coordinate-item--description").tile(5); 4226 } 4227 }); 4228 }, 4229 }, 4230 computed: { 4231 notDeletedItems: function(){ 4232 return this.items.filter(item => !item.deleted).sort((a, b) => a.regist_date < b.regist_date ? 1 : -1); 4233 }, 4234 displayItems: function(){ 4235 const startIdx = this.itemsPerPage * ( this.currentPage - 1 ); 4236 const finishIdx = startIdx + this.itemsPerPage; 4237 return this.notDeletedItems.slice(startIdx, finishIdx); 4238 } 4239 }, 4240 watch: { 4241 items: { 4242 handler: function() { 4243 this.updateTile(); 4244 }, 4245 deep : true, 4246 }, 4247 currentPage: { 4248 handler: function() { 4249 this.updateTile(); 4250 }, 4251 deep : true, 4252 }, 4253 } 4254}); 4255 4256// coordinate-bookmark-list-item-apparel.js 4257Vue.component('coordinate-bookmark-list-item-apparel', { 4258 template: '\ 4259 <div v-if="!item.deleted">\ 4260 <div class="coordinate-item--main-img">\ 4261 <figure>\ 4262 <a :href="ecblib.staffstart.uri.coordinateDetail + \'?ss_cid=\' + item.cid">\ 4263 <img :src="item.resized_main_images[0] ? item.resized_main_images[0].m : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ã¤ãªã³ã°ã®ã¤ã¡ã¼ã¸"/>\ 4264 </a>\ 4265 </figure>\ 4266 </div>\ 4267 <div class="coordinate-item--description">\ 4268 <div class="coordinate-item--description--staff-icon">\ 4269 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 4270 <img :src="getStaffIcon(item.user_resized_images)" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³"/>\ 4271 </a>\ 4272 </div>\ 4273 <div class="coordinate-item--info">\ 4274 <div class="coordinate-item--info--blandname">{{ item.label_name }}</div>\ 4275 <div class="coordinate-item--info--shopname">{{ item.shop_name }}</div>\ 4276 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 4277 <div class="coordinate-item--info--staffname">{{ item.user_name }}</div>\ 4278 </a>\ 4279 </div>\ 4280 </div>\ 4281 <div class="coordinate-item--bookmark">\ 4282 <a data-type="coordinate" :data-code="item.cid" :data-bookmarkid="item.bookmarkid" @click="removeBookmark">\
4283 <span>â åé¤ãã</span>\ 4284 </a>\ 4285 </div>\ 4286 </div>\ 4287 ', 4288 props: ['item'], 4289 methods: { 4290 getStaffIcon: function(imgArr) { 4291 if (!imgArr || imgArr.length == 0) return ecblib.staffstart.uri.sorryImg; 4292 4293 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 's';}); 4294 }, 4295 removeBookmark: async function(e) { 4296 let result = await ecblib.staffstart.util.StaffStart_DeleteBookmark(e.currentTarget); 4297 if(result.result) { 4298 this.item.deleted = true; 4299 } 4300 } 4301 } 4302 }); 4303 4304 // article-bookmark-list.js 4305Vue.component('article-bookmark-list', { 4306 template: '\ 4307 <div class="article-list">\ 4308 <div v-if="notDeletedItems.length > 0" class="block-favorite--pager-top">\ 4309 <div class="pager">\ 4310 <div class="pager-total"><span class="pager-count"><span>{{ notDeletedItems.length }}</span>件</span></div>\ 4311 </div>\ 4312 </div>\ 4313 <div class="card-list-frame">\ 4314 <p v-if="!init">\ 4315 <strong>ãæ°ã«å ¥ãæ å ±ãåå¾ãã¦ãã¾ã...</strong>\ 4316 </p>\ 4317 <p v-else-if="notDeletedItems.length == 0">\ 4318 <strong>ãæ°ã«å ¥ãç»é²ãããããã°ã¯ããã¾ããã</strong>\ 4319 </p>\ 4320 <div v-for="item in displayItems" :key="item.article_id" :class="\'article-item\' + (mobile ? \'-mobile\' : \'\')">\ 4321 <div class="article-item--main-img">\ 4322 <figure>\ 4323 <a :href="ecblib.staffstart.uri.articleDetail + \'?ss_article_id=\' + item.article_id">\ 4324 <img :src="item.resized_main_images && item.resized_main_images.m ? item.resized_main_images.m : ecblib.staffstart.uri.sorryImg" alt="ããã°ã®ã¤ã¡ã¼ã¸"/>\ 4325 </a>\ 4326 </figure>\ 4327 </div>\ 4328 <div class="article-item--articletitle">\ 4329 <a :href="ecblib.staffstart.uri.articleDetail + \'?ss_article_id=\' + item.article_id">\ 4330 {{item.title}}\ 4331 </a>\ 4332 </div>\ 4333 <div class="article-item--description">\ 4334 <div class="article-item--description--staff-icon">\ 4335 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user.user_id">\ 4336 <img :src="item.user && item.user.image_url ? item.user.image_url : ecblib.staffstart.uri.sorryImg" alt="ã¹ã¿ããã®ã¢ã¤ã³ã³"/>\ 4337 </a>\ 4338 </div>\ 4339 <div class="article-item--info">\ 4340 <div class="article-item--info--blandname">{{ item.label.name }}</div>\ 4341 <div class="article-item--info--shopname">{{ item.shop.name }}</div>\ 4342 <div class="article-item--info--staffname-wrap">\ 4343 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user.user_id">\ 4344 <div class="article-item--info--staffname">{{ item.user.name }}</div>\ 4345 </a>\ 4346 </div>\ 4347 </div>\ 4348 </div>\ 4349 <div class="article-item--bookmark">\ 4350 <a data-type="article" :data-code="item.article_id" :data-bookmarkid="item.bookmarkid" @click="removeBookmark">\ 4351 <span>â åé¤ãã</span>\ 4352 </a>\ 4353 </div>\ 4354 </div>\ 4355 </div>\ 4356 <bookmark-pagenation :items-per-page="itemsPerPage" :total="notDeletedItems.length" :current-page="currentPage" @input="currentPage = $event"></bookmark-pagenation>\ 4357 </div>\ 4358 ', 4359 props: ['value', 'condition', 'mobile', 'itemsPerPage'], 4360 data: function() { 4361 return { 4362 items: [], 4363 init: false, 4364 currentPage: 1, 4365 }; 4366 }, 4367 created: function() { 4368 this.getArticles(); 4369 }, 4370 methods: { 4371 getArticles: function () { 4372 const _self = this; 4373 const url = ecblib.staffstart.api.url.articleList; 4374 4375 const condition = JSON.parse(JSON.stringify(this.condition)); 4376 condition.count = 50; 4377 4378 ecblib.staffstart.util.ajaxGet(url, condition, 4379 function (data) { 4380 data.item.forEach(child => { 4381 let filtered_arr = condition.article_id_array.filter(arr_item => arr_item.article_id == child.article_id); 4382 child["bookmarkid"] = filtered_arr.length == 1 ? filtered_arr[0].bookmark_id : ""; 4383 child["regist_date"] = filtered_arr.length == 1 ? filtered_arr[0].regist_date : ""; 4384 child["deleted"] = false; 4385 }); 4386 _self.items = data.item; 4387 _self.$emit('input', data.total); 4388 _self.init = true; 4389 _self.updateTile(); 4390 }, 4391 function () { 4392 _self.items = []; 4393 _self.$emit('input', 0); 4394 _self.init = true; 4395 } 4396 ); 4397 }, 4398 removeBookmark: async function(e) { 4399 let bookmarkid = jQuery(e.currentTarget).attr("data-bookmarkid"); 4400 let _self = this; 4401 let result = await ecblib.staffstart.util.StaffStart_DeleteBookmark(e.currentTarget); 4402 if(result.result) { 4403 let filter_article = _self.items.filter(item => item.bookmarkid == bookmarkid); 4404 if(filter_article.length == 1) { filter_article[0].deleted = true; } 4405 } 4406 }, 4407 updateTile: function() { 4408 this.$nextTick(() => { 4409 if(this.mobile) { 4410 jQuery("#ss-article-list").find(".article-item-mobile .article-item--articletitle").tile(2); 4411 jQuery("#ss-article-list").find(".article-item-mobile .article-item--info--blandname").tile(2); 4412 jQuery("#ss-article-list").find(".article-item-mobile .article-item--info--shopname").tile(2); 4413 jQuery("#ss-article-list").find(".article-item-mobile .article-item--info--staffname-wrap").tile(2); 4414 } else { 4415 jQuery("#ss-article-list").find(".article-item .article-item--articletitle").tile(5); 4416 jQuery("#ss-article-list").find(".article-item .article-item--info--blandname").tile(5); 4417 jQuery("#ss-article-list").find(".article-item .article-item--info--shopname").tile(5); 4418 jQuery("#ss-article-list").find(".article-item .article-item--info--staffname-wrap").tile(5); 4419 } 4420 }); 4421 }, 4422 }, 4423 computed: { 4424 notDeletedItems: function(){ 4425 return this.items.filter(item => !item.deleted).sort((a, b) => a.regist_date < b.regist_date ? 1 : -1); 4426 }, 4427 displayItems: function(){ 4428 const startIdx = this.itemsPerPage * ( this.currentPage - 1 ); 4429 const finishIdx = startIdx + this.itemsPerPage; 4430 return this.notDeletedItems.slice(startIdx, finishIdx); 4431 } 4432 }, 4433 watch: { 4434 items: { 4435 handler: function() { 4436 this.updateTile(); 4437 }, 4438 deep : true, 4439 }, 4440 currentPage: { 4441 handler: function() { 4442 this.updateTile(); 4443 }, 4444 deep : true, 4445 }, 4446 } 4447}); 4448// staff-bookmark-list.js 4449Vue.component('staff-bookmark-list', { 4450 template: '\ 4451 <div>\ 4452 <div v-if="notDeletedItems.length > 0" class="block-favorite--pager-top">\ 4453 <div class="pager">\ 4454 <div class="pager-total"><span class="pager-count"><span>{{ notDeletedItems.length }}</span>件</span></div>\ 4455 </div>\ 4456 </div>\ 4457 <section class="staff-list">\ 4458 <p v-if="!init">\ 4459 <strong>ãæ°ã«å ¥ãæ å ±ãåå¾ãã¦ãã¾ã...</strong>\ 4460 </p>\ 4461 <p v-else-if="notDeletedItems.length == 0">\ 4462 <strong v-else>ãæ°ã«å ¥ãç»é²ãããããã°ã¯ããã¾ããã</strong>\ 4463 </p>\ 4464 <div v-for="(item, index) in displayItems" :key="item.user_id" :class="\'staff-item\' + (mobile ? \'-mobile\' : \'\')">\ 4465 <div class="staff-item--inner">\ 4466 <div class="staff-item--staff-icon">\ 4467 <a :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\
4468 <span v-if="condition.sort === \'pv\' || condition.sort === \'sales\'" :class="\'staff-item--staff-rank\' + (index + 1)">{{ index + 1 }}</span>\ 4469 <img :src="getStaffIcon(item.resized_images)" alt="ã¹ã¿ããã¢ã¤ã³ã³" />\ 4470 </a>\ 4471 </div>\ 4472 <div class="staff-item--info">\ 4473 <p class="staff-item--info--bland">{{ item.label_name }}</p>\ 4474 <a class="staff-item--info--shop-wrap" :href="ecblib.staffstart.uri.shopDetail + \'?ss_shop_id=\' + item.shop_id">\ 4475 <p class="staff-item--info--shop">{{ item.shop_name }}</p>\ 4476 </a>\ 4477 <a class="staff-item--info--staffname-wrap" :href="ecblib.staffstart.uri.staffDetail + \'?ss_user_id=\' + item.user_id">\ 4478 <p class="staff-item--info--staffname">{{ item.name }}</p>\ 4479 </a>\ 4480 <div class="staff-item--bookmark" v-if="!mobile">\ 4481 <a data-type="staff" :data-code="item.user_id" :data-bookmarkid="item.bookmarkid" @click="removeBookmark">\ 4482 <span>â åé¤ãã</span>\ 4483 </a>\ 4484 </div>\ 4485 </div>\ 4486 <div class="staff-item--bookmark" v-if="mobile">\ 4487 <a data-type="staff" :data-code="item.user_id" :data-bookmarkid="item.bookmarkid" @click="removeBookmark">\ 4488 <span>â åé¤ãã</span>\ 4489 </a>\ 4490 </div>\ 4491 </div>\ 4492 </div>\ 4493 </section>\ 4494 <bookmark-pagenation :items-per-page="itemsPerPage" :total="notDeletedItems.length" :current-page="currentPage" @input="currentPage = $event"></bookmark-pagenation>\ 4495 </div>\ 4496 ', 4497 props: ['value', 'condition', 'mobile', 'itemsPerPage'], 4498 data: function() { 4499 return { 4500 items: [], 4501 init: false, 4502 currentPage: 1, 4503 }; 4504 }, 4505 created: function() { 4506 this.getStaffs(); 4507 }, 4508 methods: { 4509 getStaffs: function () { 4510 const _self = this; 4511 const url = ecblib.staffstart.api.url.staffList; 4512 4513 const condition = JSON.parse(JSON.stringify(this.condition)); 4514 condition.count = 50; 4515 4516 ecblib.staffstart.util.ajaxGet(url, condition, 4517 function (data) { 4518 data.item.forEach(child => { 4519 let filtered_arr = condition.user_id_array.filter(arr_item => arr_item.user_id == child.user_id); 4520 child["bookmarkid"] = filtered_arr.length == 1 ? filtered_arr[0].bookmark_id : ""; 4521 child["regist_date"] = filtered_arr.length == 1 ? filtered_arr[0].regist_date : ""; 4522 child["deleted"] = false; 4523 }); 4524 _self.items = data.item; 4525 _self.$emit('input', data.total); 4526 _self.init = true; 4527 _self.updateTile(); 4528 }, 4529 function () { 4530 _self.items = []; 4531 _self.$emit('input', 0); 4532 _self.init = true; 4533 } 4534 ); 4535 }, 4536 getStaffIcon: function(imgArr) { 4537 if (!imgArr || imgArr.length === 0) return ecblib.staffstart.uri.sorryImg; 4538 4539 return ecblib.staffstart.util.arrayFindUrl(imgArr, function(img) {return img.size === 'm';}); 4540 }, 4541 getSize: function(item){ 4542 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 4543 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.size.id){ 4544 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value + item.user_attributes[i].user_attribute_type.unit; 4545 } 4546 } 4547 return ''; 4548 }, 4549 getFeature: function(item){ 4550 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 4551 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.feature.id){ 4552 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 4553 } 4554 } 4555 return ''; 4556 }, 4557 getQualification_1: function(item){ 4558 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 4559 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_1.id){ 4560 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 4561 } 4562 } 4563 return ''; 4564 }, 4565 getQualification_2: function(item){ 4566 for(var i = 0; i < (item.user_attributes ? (item.user_attributes ? item.user_attributes.length : 0) : 0); i++){ 4567 if(item.user_attributes[i].user_attribute_type.slug == ecblib.staffstart.master.user.qualification_2.id){ 4568 return item.user_attributes[i].user_attribute_type.display_value + ' : ' + item.user_attributes[i].user_attribute_value.display_value; 4569 } 4570 } 4571 return ''; 4572 }, 4573 removeBookmark: async function(e) { 4574 let bookmarkid = jQuery(e.currentTarget).attr("data-bookmarkid"); 4575 let _self = this; 4576 let result = await ecblib.staffstart.util.StaffStart_DeleteBookmark(e.currentTarget); 4577 if(result.result) { 4578 let filter_staff = _self.items.filter(item => item.bookmarkid == bookmarkid); 4579 if(filter_staff.length == 1) { filter_staff[0].deleted = true; } 4580 } 4581 }, 4582 updateTile: function(){ 4583 this.$nextTick(() => { 4584 if(this.mobile) { 4585 jQuery("#ss-staff-list").find(".staff-item-mobile .staff-item--info").tile(2); 4586 } else { 4587 jQuery("#ss-staff-list").find(".staff-item .staff-item--info--staffname-wrap").tile(6); 4588 jQuery("#ss-staff-list").find(".staff-item .staff-item--info--blandshop-wrap").tile(6); 4589 jQuery("#ss-staff-list").find(".staff-item .staff-item--info--other-wrap").tile(6); 4590 } 4591 }); 4592 }, 4593 }, 4594 computed: { 4595 notDeletedItems: function(){ 4596 return this.items.filter(item => !item.deleted).sort((a, b) => a.regist_date < b.regist_date ? 1 : -1); 4597 }, 4598 displayItems: function(){ 4599 const startIdx = this.itemsPerPage * ( this.currentPage - 1 ); 4600 const finishIdx = startIdx + this.itemsPerPage; 4601 4602 this.updateTile(); 4603 return this.notDeletedItems.slice(startIdx, finishIdx); 4604 } 4605 }, 4606 watch: { 4607 items: { 4608 handler: function() { 4609 this.updateTile(); 4610 }, 4611 deep : true, 4612 }, 4613 currentPage: { 4614 handler: function() { 4615 this.updateTile(); 4616 }, 4617 deep : true, 4618 }, 4619 } 4620}); 4621 4622// bookmark-pagenation.js 4623Vue.component('bookmark-pagenation', { 4624 template: '\ 4625 <ul v-if="pagerCount >= 2" class="pagination">\ 4626 <li class="pager-previous" v-if="currentPage != 1" @click="movePage(currentPage - 1)">\ 4627 <a></a>\ 4628 </li>\ 4629 <li v-if="currentPage >= 6" class="pager-first" @click="if(currentPage != 1){ movePage(1) }">\ 4630 <a>1</a>\ 4631 </li>\ 4632 <li class="page-item disabled" v-if="currentPage >= 7">\ 4633 <a tabindex="0">â¦</a>\ 4634 </li>\ 4635 <li v-if="currentPage >= 5" @click="movePage(currentPage - 4)">\ 4636 <a>{{ currentPage - 4 }}</a>\ 4637 </li>\ 4638 <li v-if="currentPage >= 4" @click="movePage(currentPage - 3)">\ 4639 <a>{{ currentPage - 3 }}</a>\ 4640 </li>\ 4641 <li v-if="currentPage >= 3" @click="movePage(currentPage - 2)">\ 4642 <a>{{ currentPage - 2 }}</a>\ 4643 </li>\ 4644 <li v-if="currentPage >= 2" @click="movePage(currentPage - 1)">\ 4645 <a>{{ currentPage - 1 }}</a>\ 4646 </li>\ 4647 <li class="pager-current active">\
4648 <span>{{ currentPage }}</span>\ 4649 </li>\ 4650 <li v-if="pagerCount - currentPage >= 2" @click="movePage(currentPage + 1)">\ 4651 <a>{{ currentPage + 1 }}</a>\ 4652 </li>\ 4653 <li v-if="pagerCount - currentPage >= 3" @click="movePage(currentPage + 2)">\ 4654 <a>{{ currentPage + 2 }}</a>\ 4655 </li>\ 4656 <li v-if="pagerCount - currentPage >= 4" @click="movePage(currentPage + 3)">\ 4657 <a>{{ currentPage + 3 }}</a>\ 4658 </li>\ 4659 <li v-if="pagerCount - currentPage >= 5" @click="movePage(currentPage + 4)">\ 4660 <a>{{ currentPage + 4 }}</a>\ 4661 </li>\ 4662 <li v-if="pagerCount - currentPage >= 6" class="page-item disabled">\ 4663 <a tabindex="0">â¦</a>\ 4664 </li>\ 4665 <li v-if="currentPage != pagerCount" class="pager-last" @click="if(currentPage != pagerCount){ movePage(pagerCount) }">\ 4666 <a>{{ pagerCount }}</a>\ 4667 </li>\ 4668 <li v-if="currentPage != pagerCount" class="pager-next" @click="movePage(currentPage + 1)">\ 4669 <a rel="next"></a>\ 4670 </li>\ 4671 </ul>\ 4672 ', 4673 props: ['itemsPerPage','total','currentPage'], 4674 methods: { 4675 movePage: function(pageNum) { 4676 this.$emit("input", pageNum); 4677 } 4678 }, 4679 computed: { 4680 pagerCount: function(){ 4681 return Math.ceil(this.total / this.itemsPerPage); 4682 } 4683 }, 4684 });
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.