From 8fdae7108a162cfe9c369d11fd33390014c74713 Mon Sep 17 00:00:00 2001 From: yr <1308291615@qq.com> Date: Thu, 21 May 2020 23:26:13 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E9=95=9C=E6=A1=86=E5=92=8C?= =?UTF-8?q?=E5=A4=AA=E9=98=B3=E9=95=9C=E7=9A=84=E9=80=89=E8=B4=AD=E9=A1=B5?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/UniSliper/UniSliper.vue | 184 +++---- src/pages.json | 6 - src/pages/detailStandard/detailStandard_k.vue | 243 +++++++--- src/pages/detailStandard/detailStandard_sun.vue | 428 ++++++++++------ src/pages/frameDetail/frameDetail.vue | 617 ------------------------ src/store/modules/detailStandard_k.js | 35 +- src/store/modules/myOrder.js | 2 +- src/store/modules/test.js | 4 +- src/store/url.js | 4 +- 9 files changed, 543 insertions(+), 980 deletions(-) delete mode 100644 src/pages/frameDetail/frameDetail.vue diff --git a/src/components/UniSliper/UniSliper.vue b/src/components/UniSliper/UniSliper.vue index 80fcf23..6796395 100644 --- a/src/components/UniSliper/UniSliper.vue +++ b/src/components/UniSliper/UniSliper.vue @@ -1,10 +1,12 @@ @@ -19,57 +21,15 @@ export default { name: 'CProgress', props: { - percent: { - type: Number, - default: 60 - }, - showSlider: { - type: Boolean, - default: true - }, - showPerText: { - type: Boolean, - default: true - }, - // 进度条的宽度 - width: { - type: Number, - default: 300 - }, - bgColor: { - type: String, - default: '#ebeef5' - }, - progressColor: { - type: String, - default: '#409EFF' - }, - // 滑块的宽度 - sliderWidth: { - type: Number, - default: 20 - }, - // 颜色的类型 - type: { - type: String, - default: colorTable.default - }, - //规格长度 - standard:{ - type: Number, - default: 1.4 - }, - //初始长度 - stand_width:{ - type: Number, - default: 0 - } + //inner的长度 + inner_widthProp: Number, + //调用接口的值 + contentProp: String }, data () { return { - sliderLeft: 0, // 滑块相对父元素发x坐标 - progressWidth: 0, // 进度条当前的的宽度 - tempPercent: 0, + inner_width: this.inner_widthProp, + content: this.contentProp } }, computed: { @@ -103,71 +63,71 @@ this.sliderLeft = this.width / 100 * this.percent this.progressWidth = this.sliderLeft + this.sliderWidth // 滑块的x坐标加上滑块的宽度 this.tempPercent = this.percent - this.addListener() + // this.addListener() }, - methods: { - addListener () { - const slider = this.$refs.slider - const progress = this.$refs.progress - let isClickSlider = false - let distance = 0 // 滑块与点击坐标的绝对距离 - progress.onclick = (e) => { - // 阻止事件冒泡 - if (e.target == slider) { - return - } - let curX = progress.offsetLeft - this.sliderLeft = e.pageX - curX - if (this.sliderLeft <= 0) { - this.sliderLeft = 0 - } - if (this.sliderLeft >= this.width) { - this.sliderLeft = this.width - } - this._countCurPercent() - } - // slider.onmousedown = (e) => { - // isClickSlider = true - // let curX = slider.offsetLeft - // distance = e.pageX - curX // 得出绝对距离 - // } - progress.onmousemove = (e) => { - if (isClickSlider) { - // 判断是否已经超出进度条的长度 - if ((e.pageX - distance) >= 0 && (e.pageX - distance) <= (this.width - 0)) { - this.sliderLeft = e.pageX - distance - this._countCurPercent() - } - } - } - progress.onmouseup = () => { - isClickSlider = false - } - }, - // 算出百分比 - _countCurPercent () { - this.tempPercent = Math.ceil(parseInt(this.sliderLeft / this.width * 100)) - this.progressWidth = this.sliderLeft + 20 - // 取整的时候宽度可能不为0,所以在0和100的时候也将宽度取整 - if (this.tempPercent <= 0) { - this.progressWidth = 0 - this.sliderLeft = 0 - } - if (this.tempPercent >= 100) { - this.progressWidth = this.width + 20 - this.sliderLeft = this.width - } - this.stand_width = this.tempPercent*this.standard - this.stand_width = parseInt(this.stand_width/1) //取整 - this.$emit('percentChange', this.tempPercent) - } - } + // methods: { + // addListener () { + // const slider = this.$refs.slider + // const progress = this.$refs.progress + // let isClickSlider = false + // let distance = 0 // 滑块与点击坐标的绝对距离 + // progress.onclick = (e) => { + // // 阻止事件冒泡 + // if (e.target == slider) { + // return + // } + // let curX = progress.offsetLeft + // this.sliderLeft = e.pageX - curX + // if (this.sliderLeft <= 0) { + // this.sliderLeft = 0 + // } + // if (this.sliderLeft >= this.width) { + // this.sliderLeft = this.width + // } + // this._countCurPercent() + // } + // // slider.onmousedown = (e) => { + // // isClickSlider = true + // // let curX = slider.offsetLeft + // // distance = e.pageX - curX // 得出绝对距离 + // // } + // progress.onmousemove = (e) => { + // if (isClickSlider) { + // // 判断是否已经超出进度条的长度 + // if ((e.pageX - distance) >= 0 && (e.pageX - distance) <= (this.width - 0)) { + // this.sliderLeft = e.pageX - distance + // this._countCurPercent() + // } + // } + // } + // progress.onmouseup = () => { + // isClickSlider = false + // } + // }, + // // 算出百分比 + // _countCurPercent () { + // this.tempPercent = Math.ceil(parseInt(this.sliderLeft / this.width * 100)) + // this.progressWidth = this.sliderLeft + 20 + // // 取整的时候宽度可能不为0,所以在0和100的时候也将宽度取整 + // if (this.tempPercent <= 0) { + // this.progressWidth = 0 + // this.sliderLeft = 0 + // } + // if (this.tempPercent >= 100) { + // this.progressWidth = this.width + 20 + // this.sliderLeft = this.width + // } + // this.stand_width = this.tempPercent*this.standard + // this.stand_width = parseInt(this.stand_width/1) //取整 + // this.$emit('percentChange', this.tempPercent) + // } + // } } \ No newline at end of file diff --git a/src/pages/frameDetail/frameDetail.vue b/src/pages/frameDetail/frameDetail.vue deleted file mode 100644 index af007b1..0000000 --- a/src/pages/frameDetail/frameDetail.vue +++ /dev/null @@ -1,617 +0,0 @@ - - - - \ No newline at end of file diff --git a/src/store/modules/detailStandard_k.js b/src/store/modules/detailStandard_k.js index c689eb3..39422ad 100644 --- a/src/store/modules/detailStandard_k.js +++ b/src/store/modules/detailStandard_k.js @@ -2,7 +2,7 @@ import urlAlias from '../url'; import request from '../request'; const { - detailStandardList + detailStandardUrl } = urlAlias const state = { @@ -10,29 +10,28 @@ const state = { }; const mutations = { - INIT: (state, detailStandardList) => { - state.detailStandardList = detailStandardList; + INIT: (state, data) => { + state.list = data; }, }; const actions = { - getList({ commit }, param){ + fetch({ commit }, param) { request({ - detailStandardList, - success: (res) => { - - commit('INIT', res.data.data) - console,log('success') - }, - fail: (res) => { - console.log("detail status === > ", res); - }, - complete: (res) => { - console.log("detail compete status === > ", res); - }, - }) + url: detailStandardUrl, + data: param, + success: (res) => { + commit('INIT', res.data); + }, + fail: (res) => { + console.log(" detail fail status === > ", res); + }, + complete: (res) => { + console.log(" detail complete status === > ", res); + }, + }) } -} + } export default { namespaced: true, diff --git a/src/store/modules/myOrder.js b/src/store/modules/myOrder.js index ed076ae..e312472 100644 --- a/src/store/modules/myOrder.js +++ b/src/store/modules/myOrder.js @@ -92,7 +92,7 @@ const actions = { ...res, data, } - console.log('data.data', resData.data.data); + console.log('data.data',res); commit("INIT", resData.data.data); }, }) diff --git a/src/store/modules/test.js b/src/store/modules/test.js index 9f66495..08f0592 100644 --- a/src/store/modules/test.js +++ b/src/store/modules/test.js @@ -10,8 +10,8 @@ const state = { }; const mutations = { - INIT: (state, list) => { - state.list = list; + INIT: (state, data) => { + state.list = data; }, }; diff --git a/src/store/url.js b/src/store/url.js index b4d15cb..38e9f9b 100644 --- a/src/store/url.js +++ b/src/store/url.js @@ -24,8 +24,8 @@ const urlAlias = { // 我的 recommandList:'/app/prod/recommand', // 获取用户个性化推荐商品 - // 镜框选购页 - detailStandardList: '/app/prod/read', //获取商品的详细信息 + // 选购页 + detailStandardUrl: '/app/prod/read', //获取商品的详细信息 } -- 2.0.0