first commit

历届学生/韩想/项目开发/课程项目/美食/js/page/info.js

@@ -0,0 +1,163 @@
+class Info {
+    constructor() {
+        this.Url = GetQueryString("url")
+        this.getIndexInfo();
+    }
+
+    async getIndexInfo() {
+        let res = await indexService.indexInfo({
+            url: this.Url
+        });
+
+        $(".img_hidden img").attr("src", res.backImg);
+        $(".info_list h1 span").text(res.title);
+
+        $(".posttime").text(res.posttime);
+
+        res.stepInfo.arr.forEach((v,i)=>{
+            $(".ddd").append(`
+                <li>
+                    <div class="i" style="background-position: 0px ${v.position /20}rem;"></div>
+                    <p>${v.title}</p>
+                </li>
+            `)
+        });
+
+        res.stepInfo.message = res.stepInfo.message;
+        $(".list_text p").text(res.stepInfo.message)
+        if(res.stepInfo.message.length > 44) {
+            $(".list_text").append(`
+                <div class="more">
+                    <span>展开</span>
+                    <i class="iconfont icon-houtui-copy-copy"></i>
+                </div>
+            `);
+            $(".more").on("click", function() {
+                $(".list_text").css({
+                    height: 'auto'
+                })
+                $(".list_text .more").remove()
+
+            });
+        };
+
+        res.material.main.forEach((v,i)=>{
+           $(".ms .main ul").eq(0).append(`
+            <li>
+                <span>${v.title}</span>
+                <span>${v.nums}</span>
+             </li>
+           `)
+        })
+
+        res.material.accessories.forEach((v,i)=>{
+            $(".ms .main ul").eq(1).append(`
+             <li>
+                 <span>${v.title}</span>
+                 <span>${v.nums}</span>
+              </li>
+            `)
+         })
+
+         var successImg = 0;
+
+         res.DetailedSteps.forEach((v,i)=>{
+             console.log(v.step_img);
+            if(Array.isArray(v.step_img) && v.step_img.length >=2) {
+                successImg = i
+                $(".content_list").append(`
+                    <li>
+                        <div class="step 2">${v.step_title}</div>
+                        <img src="${v.step_img[0]}" alt="">
+                        <p>${v.step_text || ''}</p>
+                        <div class="tabs_img">
+                        </div>
+                    </li>
+                `)  
+            } else{
+                $(".content_list").append(`
+                    <li>
+                        <div class="step">${v.step_title}</div>
+                        <img src="${v.step_img}" alt="">
+                        <p>${v.step_text || ''}</p>
+                    </li>
+                `)
+            }
+         });
+        
+         if (successImg != 0) {
+            res.DetailedSteps[successImg].step_img.forEach((a,b)=>{
+                $(".content_list li").eq(successImg).find(".tabs_img").append(`
+                    <img style="width: 70px;height:70px" src="${a}" alt=""/>
+                `)
+            });
+    
+            $(".content_list li").eq(successImg).find(".tabs_img img").on("click", function(){
+                $(".content_list li").eq(successImg).find("img").eq(0).attr('src', $(this).attr("src"))
+               
+            });
+         }
+
+        var arr = [],
+            self = this;
+         if (localStorage.getItem("like") != null) {
+             arr = JSON.parse(localStorage.getItem("like"))
+         }
+
+         console.log("arr: ", arr);
+         // 如果已经收藏了
+         (arr.filter((v,index)=> v.url == self.Url).length == 0) ? '' :  $(".icon-shoucang").removeClass().addClass("iconfont icon-ai-mark")
+
+        //  for (let i = 0; i < arr.length; i++) {
+        //     if (arr[i].url.includes(self.Url)) {
+        //         $(".icon-shoucang").removeClass().addClass("iconfont icon-ai-mark");
+        //     }
+        // }
+
+        var xxx;
+         $(".icon-shoucang").on("click", function () {
+             if (arr.length === 0) {
+                addData()
+             } else {
+
+                (arr.filter((v,index)=> v.url == self.Url).length == 0) ? addData() : ''
+                    
+                // for (let i = 0; i < arr.length; i++) {
+                //     if (arr[i].url.includes(self.Url)) {
+                //         xxx = true
+                //         break;
+                //     } else {
+                //         xxx = false
+                //     }   
+                // }
+
+                // if (xxx) {
+                //     console.log("已经收藏了");
+                // } else {
+                //     addData()
+                // }
+             }
+
+             
+            
+         });
+
+
+         function addData() {
+            $(".icon-shoucang").removeClass().addClass("iconfont icon-ai-mark");
+            arr.push({
+                title: res.title,
+                url: self.Url,
+                img: res.backImg
+            })
+            localStorage.setItem("like", JSON.stringify(arr))
+         }
+
+        
+
+
+
+    }
+}
+
+new Info()