first commit

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/config/index.js

@@ -0,0 +1,36 @@
+//放程序的你如接口地址
+
+var config = {
+    devBaserl: 'http://127.0.0.1:3000/api/json',          //开发阶段
+    testBaserl: 'http://127.0.0.1:3000/api/json/',    //测试阶段
+    pordBaserl: 'http://127.0.0.1:3000/api/json',         //上线阶段
+    stage: 'pord',                                        //用以筛选是什么阶段
+    urlList:{                                             //不同接口调用不同字段
+        classList:"/classList",
+        info: '/info',                                  //url(confi.getBaseUrl)
+        index:"/index",
+        type:"/class",
+        mechanism:"/mechanism",
+        mechanismList:"/mechanismList",
+        allModel:"/allModel",
+        modelList:"/modelList",
+        search:"/search"
+        
+    },
+    getBaseUrl: function () {                             
+        switch (this.stage) {
+            case "dev":
+                return this.devBaserl
+                break;
+            case "test":
+                return this.testBaserl
+                break;
+            case "pord":
+                return this.pordBaserl
+                break;
+
+            default:
+                break;
+        }
+    }
+}

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/http/index.js

@@ -0,0 +1,145 @@
+
+
+class html {
+    //默认head
+    timeout=10000
+    Headermr={
+        'Content-Type': 'application/json;charset=utf-8'
+    }
+    constructor() {
+        //创建 XMLHttpRequest 对象
+        this.xhr = new XMLHttpRequest()
+    }
+
+    /*html.get({
+        url()                   --  请求的地址
+        method:                 --  请求的类型
+        data{                   --  数据    get 传输方式是在地址后拼接传输的   post 是在  send()里面传输的
+            id="1" 
+            text="好的"
+        }
+        timeout:                --  网络请求超时间
+        header:{}               --  请求头
+    })*/
+
+
+    //promise
+    get(par) {
+        return new Promise((success,error)=>{    
+        this.timeoutm(par)
+        let urldata = ""    //创建一个变量储存数据 用来拼接
+        //遍历data 
+        for (const key in par.data) {
+            urldata += `&${key}=${par.data[key]}` //进行拼接
+        }
+        console.log(urldata)
+        urldata = urldata.replace("&", "");       //将第一个开头的&替换成空
+
+        //创建一个新的HTTP请求，并指定该请求的方法、URL及验证信息
+        this.xhr.open("GET", `${config.getBaseUrl()}${par.url}?${urldata}`)
+        console.log("GET", `${config.getBaseUrl()}${par.url}?${urldata}`)
+
+        this.xhr.timeout=this.timeout;
+
+        this.RequestHeader(par.Header)
+        //将请求发送出去
+        this.xhr.send()
+        //回调函数对不同状态进行处理
+        this.statechange(success, error)
+        })
+    }
+
+
+    //callback
+
+    /*get传值方法
+    get(par) {
+        this.timeoutm(par)
+        let urldata = ""    //创建一个变量储存数据 用来拼接
+        //遍历data 
+        for (const key in par.data) {
+            urldata = `&${key}=${par.data[key]}` //进行拼接
+        }
+        urldata = urldata.replace("&", "");       //将第一个开头的&替换成空
+
+        //创建一个新的HTTP请求，并指定该请求的方法、URL及验证信息
+        this.xhr.open("GET", `${par.url}?${urldata}`)
+
+        this.xhr.timeout=this.timeout;
+
+        this.RequestHeader(par.Header)
+        //将请求发送出去
+        this.xhr.send()
+        //回调函数对不同状态进行处理
+        this.statechange(par.success, par.error)
+
+    }
+    //post传值方法
+    post(par) {
+        this.timeout(par)
+        //创建一个新的HTTP请求，并指定该请求的方法、URL及验证信息
+        this.xhr.open("POST", `${par.url}`)
+
+        this.RequestHeader(par.Header)
+        //将请求发送出去
+        this.xhr.send(JSON.stringify(par.data))
+        //回调函数对不同状态进行处理
+        this.statechange(par.success, par.error)
+    }*/
+
+
+    //回调函数
+    statechange(success, error) {
+        this.xhr.onreadystatechange = () => {
+            if (this.xhr.readyState == 4) {
+                if (this.xhr.status == 200) {
+                    let data = JSON.parse(this.xhr.response)
+                    switch (data.status) {
+                        case 200:
+                            success(data)
+                            break;
+                        case 404:
+                            alert(data.msg)
+                            console.error(this.xhr);
+                            throw new Error(data.msg)
+                            break;
+                        default:
+                            break;
+                    }
+
+                } else {
+                    error(this.xhr)
+                }
+            }
+        }
+    }
+
+    //多个请求头遍历
+    RequestHeader(Header={}){
+        Object.assign(Header,this.Headermr)
+        for (const key in Header) {
+           this.xhr.setRequestHeader(key,Header[key]);
+        }
+    }
+
+    timeoutm(par){
+        this.timeout=par.timeout||this.timeout;
+    }
+}
+var http = new html()
+
+/*
+        let xhr = new XMLHttpRequest();
+
+        xhr.open("GET", "http://127.0.0.1:3000/api/json/index")
+        xhr.setRequestHeader()
+        xhr.timeout()
+        xhr.send()
+
+        xhr.onreadystatechange = () => {
+            if (xhr.readyState == "4") {
+                if (xhr.status == "200") {
+                    
+                }
+            }
+        } */

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/pagge/Institutiondetails.js

@@ -0,0 +1,79 @@
+class Institutiondetails {
+    constructor() {
+        header(query("title"))
+        this.details()
+        this.errr()
+    }
+    max = 0
+    page = 1;
+    //获取数据
+    async details() {
+        
+        $(".swiper-slide1").onscroll = (v) => {
+            
+            const { clientHeight, scrollHeight, scrollTop } = $(".swiper-slide1");
+
+            let distance = scrollHeight - scrollTop - clientHeight;
+            console.log(distance)
+            if (distance <=1) {
+                if (this.page < this.max - 1) {
+                   
+                    this.page += 1;
+                    this.errr()
+                    console.log(this.page)
+                    
+                } else {
+
+                }
+            } else {
+
+            }
+        }
+    }
+
+    async errr(){
+        let id = query("id");
+        let data = {
+            id: id,
+            page: this.page
+        }
+        console.log( this.page)
+        let details = await indexserve.mechanismList(data);
+        this.max = details.result.total_page;
+        console.log(details)
+        item($(".swiper-slide1"), details.result.data,2)
+    }
+    // boot = true;
+    // //机构移动
+    // Mechanismmovement() {
+    //     $("body").ontouchmove = (e) => {
+    //         // console.log(e.touches[0].pageY)
+    //         //e.touches[0].pageY  获取当前手指在页面中的位置
+    //         //document.body.offsetHeight   获取当前页面中的高度
+    //         //手指在页面中的位置>= 获取当前页面中的高度-浏览器的高度
+    //         if (e.touches[0].pageY >= document.body.offsetHeight - window.innerHeight - 300) {
+    //             if (this.boot == false) {
+    //                 if (this.page >= this.max) {
+
+    //                     this.page = this.max;
+    //                     alert("到底了")
+    //                 } else {
+    //                     this.page += 1;
+    //                     console.log(this.page)
+    //                     console.log(this.max)
+    //                     this.details();
+    //                 }
+
+
+    //                 this.boot = true;
+    //             }
+    //             // alert("到底了")
+
+    //         } else {
+    //             this.boot = false;
+    //         }
+    //     }
+    // }
+}
+
+new Institutiondetails()

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/pagge/index.js

@@ -0,0 +1,154 @@
+class Index {
+    constructor() {
+        footer()
+        
+        this.classifyindex()
+        this.initSwiper()
+        this.Home()
+        this.index = 0
+        this.principal = []
+        this.onbeforeunload()
+    }
+
+    onbeforeunload() {
+       
+        window.onbeforeunload =  ()=> {
+           let ee= getItem("principalIII")
+          setItem("principal",ee)
+        }
+    }
+    //首页分类
+    async classifyindex() {
+        console.log("首页")
+
+        if (!getItem("principal")) {
+            let principalh = await indexserve.type()
+
+            let { additional, principal } = principalh.result
+            this.principal = principal;
+            //已选
+            setItem("principal", principal)
+            //刷新
+            setItem("principalIII", principal)
+            //未选
+            setItem("additional", additional)
+            //收藏
+            setItem("like",[])
+            //历史记录
+            setItem("History",[])
+        } else {
+            this.principal = getItem("principal")
+            console.log()
+        }
+        this.principal.forEach((v, i) => {
+            //添加分类Li
+            $(".header_menu ul").html(`
+                 <li class="${i == 0 ? "active" : ""}">${v.title} </li>
+            `)
+            $(".swiper-wrapper").html(`
+               <div class="swiper-slide">
+                     <ul class="qwe${i}"></ul>
+               </div>
+        `)
+        });
+
+        _(".header_menu ul li").tap(({ v, i }) => {
+            this.swiper.slideTo(i)
+
+        })
+
+        _(".swiper-wrapper .swiper-slide").forEach(v => {
+            v.onscroll = () => {
+                const { clientHeight, scrollHeight, scrollTop } = v;
+
+                let distance = scrollHeight - scrollTop - clientHeight;
+                if (distance <= 1) {
+                    if (this.index != 0) {
+                        this.principal[this.index].page += 1;
+                        setItem("principal", this.principal)
+                        if (this.principal[this.index].page <= this.principal[this.index].total_page) {
+                            this.classifications('ko')
+
+                        }
+                    }
+                } else {
+
+                }
+            }
+        })
+
+    }
+
+    initSwiper() {
+        let self = this
+        this.swiper = new Swiper('.swiper', {
+            direction: 'horizontal',
+            on: {
+                slideChangeTransitionStart: function () {
+                    self.index = this.activeIndex
+                    _(".header_menu ul li")[this.activeIndex].appClass("active")
+                        .siblings().removeClass("active");
+                    console.log("中")
+                    self.classifications()
+
+                },
+            },
+        })
+    }
+    //首页
+     ddf
+    async Home() {
+        let xq = await indexserve.index();
+        console.log( xq.result.list)
+        this.ddf=()=>{
+            item(_(".swiper-wrapper .swiper-slide ul")[0], xq.result.list)
+        }
+       this.ddf();
+        clicka(".swiper-wrapper .swiper-slide ul li", xq.result.list, "detail.html")
+    }
+
+    async classifications(type = "click") {
+        console.log("未")
+        console.log(this.principal)
+        this.principal = getItem("principal")
+        let loadData = async () => {
+            let red = await indexserve.mechanismList({
+                id: this.principal[this.index].id,
+                page: this.principal[this.index].page
+            })
+            console.log(red)
+            //将值赋给分类中的变量
+            // console.log(red)
+            red.result.data.forEach(v=>{
+                this.principal[this.index].content.push(v);
+            })
+            this.principal[this.index].total_page = red.result.total_page;
+            console.log(this.principal[this.index].content)
+            setItem("principal", this.principal)
+            // console.log(this.principal.result.principal[this.index].content)
+            item(
+                _(".swiper-wrapper .swiper-slide ul")[this.index],
+                this.principal[this.index].content
+             )
+            
+            console.log(this.principal[this.index].content)
+            let fff = `.swiper-wrapper .swiper-slide .qwe${this.index} li`
+           clicka(fff, this.principal[this.index].content, "detail.html")
+            this.ddf();
+        }
+
+        if (type == "click") {
+            if (this.principal[this.index].content.length == 0) {
+                this.principal[this.index].page += 1
+                loadData()
+                
+            }
+        } else {
+            loadData()
+            
+        }
+        
+    }
+}
+
+new Index()

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/pagge/mechanism.js

@@ -0,0 +1,25 @@
+class mechanism {
+    constructor() {
+        footer()
+        this.institutions();
+    }
+
+    async institutions() {
+        let insti = await indexserve.mechanism()
+        console.log(insti.result)
+        insti.result.forEach((v) => {
+            console.log(v)
+            $(".content").html(`
+            <li>
+                 <a href="./Institutiondetails.html?id=${v.id}&page=${v.page}&title=${v.title}">
+                     <p>${v.title}</p>
+                     <p>${v.id}套</p>
+                 </a>
+             </li>
+            `);
+        })
+
+    }
+}
+
+new mechanism()

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/serve/index.js

@@ -0,0 +1,100 @@
+
+
+class IndexServe {
+
+    async type(data = {}, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            url: config.urlList.type,
+            data
+        })
+
+        re.result.principal.unshift({
+            id: -1,
+            page: -1,
+            title: "首页"
+        })
+        re.result.principal.forEach(v => {
+            v.content = []
+            v.total_page = 0
+        });
+        re.result.additional.forEach(v => {
+            v.content = []
+            v.total_page = 0
+        });
+        http = null
+        console.log(re)
+        return re
+    }
+    //机构
+    async mechanism(data = {}, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            url: config.urlList.mechanism,
+            data
+        })
+        http = null
+        return re
+    }
+    //分类详情
+    async mechanismList(data, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            url: config.urlList.classList,
+            data
+        })
+        http = null
+        return re
+    }
+
+    async allModel(data = {}, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            url: config.urlList.allModel,
+        })
+        http = null
+        return re
+    }
+    async index(data = {}, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            url: config.urlList.index,
+        })
+        http = null
+        return re
+    }
+
+    //详情
+    async info(data = {}, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            data,
+            url: config.urlList.info,
+        })
+        http = null
+        return re
+    }
+
+    //模特详情页
+    async  modelList(data = {}, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            data,
+            url: config.urlList.modelList,
+        })
+        http = null
+        return re
+    }
+    //搜索
+    async search(data = {}, headers = {}) {
+        let http = new html()
+        let re = await http.get({
+            data,
+            url: config.urlList.search,
+        })
+        http = null
+        return re
+    }
+}
+
+var indexserve = new IndexServe();

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/utils/index.js

@@ -0,0 +1,223 @@
+class Utils {
+
+
+    footer() {
+        let curretHref = location.href
+        let list = [
+            { title: "首页", icon: "home", href: "index.html" },
+            { title: "机构", icon: "jigou", href: "mechanism.html" },
+            { title: "模特", icon: "me", href: "mannequin.html" },
+            { title: "我的", icon: "wo", href: "Itsmine.html" },
+        ]
+
+        let html =
+            `
+           <ul class="footer">
+               ${list.map((v) => {
+                return `
+                    <li class="${curretHref.includes(v.href) ? "active" : ""}">
+                        <a href="${v.href}">
+                             <i class="iconfont icon-${v.icon}"></i>
+                             <p>${v.title}</p>
+                        </a>
+                    </li>
+                    `
+            })
+            }
+           </ul>
+        `
+        $("body").insertAdjacentHTML("beforeend", html)
+    }
+
+
+    customMethods() {
+        Array.prototype.map = function (callback) {
+            let result = []
+            for (let index = 0; index < this.length; index++) {
+                result.push(callback(this[index], index, this))
+            }
+            return result.toString().replaceAll(",", "");
+        }
+
+        Element.prototype.html = function (name) {
+            this.innerHTML += name;
+        }
+
+        //为单个多个元素绑定 click事件
+
+        //Eventcode是点击事件里所写的代码  例如：sss.onclick=()=>{   Eventcode是这里面的方法  }
+        NodeList.prototype.tap = function (Eventcode) {
+
+            this.forEach((v, i) => ClickTransfer(v, Eventcode, i))
+
+        }
+
+        //为单个元素绑定 click事件
+        Element.prototype.tap = function (Eventcode) {
+            ClickTransfer(this, Eventcode)
+
+        }
+
+        //
+
+        let ClickTransfer = (v, Eventcode, i) => {
+            v.onclick = (e) => {
+                console.log()
+                Eventcode({ v, i, e })
+            }
+        }
+        //添加类
+        Element.prototype.appClass = function (name) {
+            this.classList.add(name)
+            return this
+        }
+
+        Element.prototype.siblings = function () {
+            return Array.from(this.parentElement.children).filter(v => v != this)
+        }
+        //循环删除
+        Array.prototype.removeClass = function (name) {
+            this.forEach(v => bindElementRemoveClass(v, name))
+            return this;
+        }
+        //删除单个类
+        Element.prototype.removeClass = function (name) {
+            bindElementRemoveClass(this, name)
+            return this;
+        }
+
+        var bindElementRemoveClass = (v, name) => {
+            v.classList.remove(name)
+        }
+    }
+
+    //详情头部
+    header(title = "", like = "") {
+        $("body").html(`
+            <div class="header_pub">
+                <div class="left">
+                    <i class="iconfont icon-back1"></i>
+                    <span class="ellipsis">${title}</span>
+                </div>
+                ${like}
+                
+            </div>
+        `);
+
+        $(".header_pub .icon-back1").tap(() => {
+            history.back()
+        })
+    }
+
+
+
+    $(className) {
+        return document.querySelector(className);
+    }
+
+    _(className) {
+        return document.querySelectorAll(className);
+    }
+
+    query(name) {
+        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
+        var r = window.location.search.substr(1).match(reg);
+        if (r != null)
+            return decodeURIComponent(r[2]);
+        return null;
+    }
+    item(dom, data, type = 1) {
+        console.log(type)
+        if (type == 1 || type) {
+            dom.innerHTML = ""
+        }
+
+        data.forEach((v, i) => {
+            dom.html(`
+            <li>
+                 <a>
+                     <div class="img">
+                        <img src="${v.img_src || v.preview}" alt="">
+                        <span>${v.total || v.shuliang || v.quantity}P</span>
+                     </div>
+                     <div class="title ellipsis">${v.title}</div>
+                     ${type == 3 ? "" : `<div class="model ellipsis">${v.user || `模特：${(v?.renwulist.length != 0 ? v.renwulist[0].name : '')||(v.renwulist.length != 0 ? v.renwulist[0].name : '')}`}</div>
+                     <div class="jg ellipsis"> ${v.source || `机构：${v.jigoulist[0].name}`}</div>`}
+                     
+                </a>
+                ${type == 3 ? "" : `<div class="tag">${(v.biaoqianlist || v.tags).map(item => { return `<a href="">${item.name || item.title}</a>` })}</div>`}
+                
+        </li>
+            `)
+        })
+    }
+
+    //添加到浏览器
+    setItem(key, value) {
+
+        localStorage.setItem(key, value.constructor == Object || value.constructor == Array ? JSON.stringify(value) : value)
+    }
+
+    //从浏览器获取数据
+    getItem(key) {
+        return localStorage.getItem(key) == null ? false : JSON.parse(localStorage.getItem(key))
+    }
+
+    //添加a标签点击
+    clicka(dom, data, href) {
+        console.log(data)
+
+        _(dom).tap(({ v, i }) => {
+
+            let clickaadd = () => {
+                let sss = {
+                    id: data[i].id,
+                    img_src: data[i].img_src || data[i].preview,
+                    title: data[i].title,
+                    renwulist: data[i].renwulist || data[i].user,
+                    jigoulist: data[i].jigoulist || data[i].source,
+                    biaoqianlist: data[i].biaoqianlist || data[i].tags,
+                    shuliang: data[i].shuliang || data[i].total
+                }
+                let ddd = getItem("History")
+                ddd.unshift(sss)
+                //添加到浏览器
+                setItem("History", ddd)
+                window.location.href = `${href}?id=${data[i].id}&quantity=${data[i].total || data[i].shuliang||data[i].quantity}&title=${encodeURIComponent(data[i].title)}&img_src=${data[i].preview || data[i].img_src}`
+            }
+            // window.location.href = `${href}?id=${data[i].id}&quantity=${data[i].total || data[i].shuliang}&title=${encodeURIComponent(data[i].title)}&img_src=${data[i].preview || data[i].img_src}`
+
+            // 添加历史记录
+            let ty = false;
+            try {
+
+                getItem("History").forEach(v => {
+                    if (data[i].id == v.id) {
+                        let data1 = getItem("History").filter(item => item.id != data[i].id)
+                        
+                        setItem("History", data1)
+                        
+                        clickaadd()
+                        ty = true
+                    }
+                })
+
+            } catch (e) {
+                if (e.message != "第三") throw e;
+            };
+
+            if (ty == false) {
+                clickaadd()
+            }
+
+        })
+    }
+
+}
+
+let {
+    $, _,
+    customMethods, footer,
+    query, item, header, setItem, getItem, clicka,
+} = new Utils()
+customMethods()

历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/得到/js/utils/rem.js

@@ -0,0 +1,10 @@
+((w, d) => {
+    function setSize() {
+        var screenWidth = d.documentElement.clientWidth;
+        var currentFontSize = screenWidth * 100 / 750;
+        d.documentElement.style.fontSize = currentFontSize + 'px';
+    }
+    w.addEventListener('resize', setSize);
+    w.addEventListener('pageShow', setSize)
+    w.addEventListener('DOMContentLoaded', setSize)
+})(window, document)