Merge pull request 'dengjie' (#9) from dengjie into dev
Reviewed-on: http://git.hchyun.com/feashow/pupil/pulls/9
4
App.vue
@@ -16,4 +16,8 @@
|
||||
/*每个页面公共css */
|
||||
@import "@/static/styles/main.css";
|
||||
@import "uview-ui/index.scss";
|
||||
|
||||
page {
|
||||
background-color: #F8F8F8;
|
||||
}
|
||||
</style>
|
||||
|
||||
27
components/u-parse/components/wxParseAudio.vue
Normal file
@@ -0,0 +1,27 @@
|
||||
<template>
|
||||
<!--增加audio标签支持-->
|
||||
<audio
|
||||
:id="node.attr.id"
|
||||
:class="node.classStr"
|
||||
:style="node.styleStr"
|
||||
:src="node.attr.src"
|
||||
:loop="node.attr.loop"
|
||||
:poster="node.attr.poster"
|
||||
:name="node.attr.name"
|
||||
:author="node.attr.author"
|
||||
controls></audio>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'wxParseAudio',
|
||||
props: {
|
||||
node: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {};
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
86
components/u-parse/components/wxParseImg.vue
Normal file
@@ -0,0 +1,86 @@
|
||||
<template>
|
||||
<image
|
||||
:mode="node.attr.mode"
|
||||
:lazy-load="node.attr.lazyLoad"
|
||||
:class="node.classStr"
|
||||
:style="newStyleStr || node.styleStr"
|
||||
:data-src="node.attr.src"
|
||||
:src="node.attr.src"
|
||||
@tap="wxParseImgTap"
|
||||
@load="wxParseImgLoad"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'wxParseImg',
|
||||
data() {
|
||||
return {
|
||||
newStyleStr: '',
|
||||
preview: true,
|
||||
};
|
||||
},
|
||||
props: {
|
||||
node: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {};
|
||||
},
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
wxParseImgTap(e) {
|
||||
if (!this.preview) return;
|
||||
const { src } = e.currentTarget.dataset;
|
||||
if (!src) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {// TODO 遍历获取父节点执行方法
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.preview(src, e);
|
||||
},
|
||||
// 图片视觉宽高计算函数区
|
||||
wxParseImgLoad(e) {
|
||||
const { src } = e.currentTarget.dataset;
|
||||
if (!src) return;
|
||||
const { width, height } = e.mp.detail;
|
||||
const recal = this.wxAutoImageCal(width, height);
|
||||
const { imageheight, imageWidth } = recal;
|
||||
const { padding, mode } = this.node.attr;
|
||||
const { styleStr } = this.node;
|
||||
const imageHeightStyle = mode === 'widthFix' ? '' : `height: ${imageheight}px;`;
|
||||
this.newStyleStr = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px; padding: 0 ${+padding}px;`;
|
||||
},
|
||||
// 计算视觉优先的图片宽高
|
||||
wxAutoImageCal(originalWidth, originalHeight) {
|
||||
// 获取图片的原始长宽
|
||||
const { padding } = this.node.attr;
|
||||
const windowWidth = this.node.$screen.width - (2 * padding);
|
||||
const results = {};
|
||||
|
||||
if (originalWidth < 60 || originalHeight < 60) {
|
||||
const { src } = this.node.attr;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.removeImageUrl(src);
|
||||
this.preview = false;
|
||||
}
|
||||
|
||||
// 判断按照那种方式进行缩放
|
||||
if (originalWidth > windowWidth) {
|
||||
// 在图片width大于手机屏幕width时候
|
||||
results.imageWidth = windowWidth;
|
||||
results.imageheight = windowWidth * (originalHeight / originalWidth);
|
||||
} else {
|
||||
// 否则展示原来的数据
|
||||
results.imageWidth = originalWidth;
|
||||
results.imageheight = originalHeight;
|
||||
}
|
||||
|
||||
return results;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
107
components/u-parse/components/wxParseTemplate0.vue
Normal file
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--table类型-->
|
||||
<block v-else-if="node.tag == 'table'">
|
||||
<view :class="node.classStr" class="table" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate1';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate0',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;// TODO currentTarget才有dataset
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {// TODO 遍历获取父节点执行方法
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
99
components/u-parse/components/wxParseTemplate1.vue
Normal file
@@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<view :class="(node.tag == 'li' ? node.classStr : (node.node==='text'?'text':''))">
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<!-- <view :class="node.classStr" :style="node.styleStr"> -->
|
||||
<view :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate2';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate1',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
97
components/u-parse/components/wxParseTemplate10.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate11';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate10',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
87
components/u-parse/components/wxParseTemplate11.vue
Normal file
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<!--button类型-->
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
{{node.text}}
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
{{node.text}}
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
{{node.text}}
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate11',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate2.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate3';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate2',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate3.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate4';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate3',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate4.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate5';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate4',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate5.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate6';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate5',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate6.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate7';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate6',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate7.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate8';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate7',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate8.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate9';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate8',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
98
components/u-parse/components/wxParseTemplate9.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--判断是否是标签节点-->
|
||||
<block v-if="node.node == 'element'">
|
||||
<block v-if="node.tag == 'button'">
|
||||
<button type="default" size="mini">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</button>
|
||||
</block>
|
||||
|
||||
<!--li类型-->
|
||||
<block v-else-if="node.tag == 'li'">
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--video类型-->
|
||||
<block v-else-if="node.tag == 'video'">
|
||||
<wx-parse-video :node="node" />
|
||||
</block>
|
||||
|
||||
<!--audio类型-->
|
||||
<block v-else-if="node.tag == 'audio'">
|
||||
<wx-parse-audio :node="node" />
|
||||
</block>
|
||||
|
||||
<!--img类型-->
|
||||
<block v-else-if="node.tag == 'img'">
|
||||
<wx-parse-img :node="node" />
|
||||
</block>
|
||||
|
||||
<!--a类型-->
|
||||
<block v-else-if="node.tag == 'a'">
|
||||
<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!--br类型-->
|
||||
<block v-else-if="node.tag == 'br'">
|
||||
<text>\n</text>
|
||||
</block>
|
||||
|
||||
<!--其他标签-->
|
||||
<block v-else>
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<block v-for="(node, index) of node.nodes" :key="index">
|
||||
<wx-parse-template :node="node" />
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</block>
|
||||
|
||||
<!--判断是否是文本节点-->
|
||||
<block v-else-if="node.node == 'text'">{{node.text}}</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wxParseTemplate from './wxParseTemplate10';
|
||||
import wxParseImg from './wxParseImg';
|
||||
import wxParseVideo from './wxParseVideo';
|
||||
import wxParseAudio from './wxParseAudio';
|
||||
|
||||
export default {
|
||||
name: 'wxParseTemplate9',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
wxParseImg,
|
||||
wxParseVideo,
|
||||
wxParseAudio,
|
||||
},
|
||||
methods: {
|
||||
wxParseATap(e) {
|
||||
const {
|
||||
href
|
||||
} = e.currentTarget.dataset;
|
||||
if (!href) return;
|
||||
let parent = this.$parent;
|
||||
while(!parent.preview || typeof parent.preview !== 'function') {
|
||||
parent = parent.$parent;
|
||||
}
|
||||
parent.navigate(href, e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
15
components/u-parse/components/wxParseVideo.vue
Normal file
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<!--增加video标签支持,并循环添加-->
|
||||
<view :class="node.classStr" :style="node.styleStr">
|
||||
<video :class="node.classStr" class="video-video" :src="node.attr.src"></video>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'wxParseVideo',
|
||||
props: {
|
||||
node: {},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
261
components/u-parse/libs/html2json.js
Normal file
@@ -0,0 +1,261 @@
|
||||
/**
|
||||
* html2Json 改造来自: https://github.com/Jxck/html2json
|
||||
*
|
||||
*
|
||||
* author: Di (微信小程序开发工程师)
|
||||
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
||||
* 垂直微信小程序开发交流社区
|
||||
*
|
||||
* github地址: https://github.com/icindy/wxParse
|
||||
*
|
||||
* for: 微信小程序富文本解析
|
||||
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
||||
*/
|
||||
|
||||
import wxDiscode from './wxDiscode';
|
||||
import HTMLParser from './htmlparser';
|
||||
|
||||
function makeMap(str) {
|
||||
const obj = {};
|
||||
const items = str.split(',');
|
||||
for (let i = 0; i < items.length; i += 1) obj[items[i]] = true;
|
||||
return obj;
|
||||
}
|
||||
|
||||
// Block Elements - HTML 5
|
||||
const block = makeMap('br,code,address,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video');
|
||||
|
||||
// Inline Elements - HTML 5
|
||||
const inline = makeMap('a,abbr,acronym,applet,b,basefont,bdo,big,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var');
|
||||
|
||||
// Elements that you can, intentionally, leave open
|
||||
// (and which close themselves)
|
||||
const closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr');
|
||||
|
||||
function removeDOCTYPE(html) {
|
||||
const isDocument = /<body.*>([^]*)<\/body>/.test(html);
|
||||
return isDocument ? RegExp.$1 : html;
|
||||
}
|
||||
|
||||
function trimHtml(html) {
|
||||
return html
|
||||
.replace(/<!--.*?-->/gi, '')
|
||||
.replace(/\/\*.*?\*\//gi, '')
|
||||
.replace(/[ ]+</gi, '<')
|
||||
.replace(/<script[^]*<\/script>/gi, '')
|
||||
.replace(/<style[^]*<\/style>/gi, '');
|
||||
}
|
||||
|
||||
function getScreenInfo() {
|
||||
const screen = {};
|
||||
wx.getSystemInfo({
|
||||
success: (res) => {
|
||||
screen.width = res.windowWidth;
|
||||
screen.height = res.windowHeight;
|
||||
},
|
||||
});
|
||||
return screen;
|
||||
}
|
||||
|
||||
function html2json(html, customHandler, imageProp, host) {
|
||||
// 处理字符串
|
||||
html = removeDOCTYPE(html);
|
||||
html = trimHtml(html);
|
||||
html = wxDiscode.strDiscode(html);
|
||||
// 生成node节点
|
||||
const bufArray = [];
|
||||
const results = {
|
||||
nodes: [],
|
||||
imageUrls: [],
|
||||
};
|
||||
|
||||
const screen = getScreenInfo();
|
||||
function Node(tag) {
|
||||
this.node = 'element';
|
||||
this.tag = tag;
|
||||
|
||||
this.$screen = screen;
|
||||
}
|
||||
|
||||
HTMLParser(html, {
|
||||
start(tag, attrs, unary) {
|
||||
// node for this element
|
||||
const node = new Node(tag);
|
||||
|
||||
if (bufArray.length !== 0) {
|
||||
const parent = bufArray[0];
|
||||
if (parent.nodes === undefined) {
|
||||
parent.nodes = [];
|
||||
}
|
||||
}
|
||||
|
||||
if (block[tag]) {
|
||||
node.tagType = 'block';
|
||||
} else if (inline[tag]) {
|
||||
node.tagType = 'inline';
|
||||
} else if (closeSelf[tag]) {
|
||||
node.tagType = 'closeSelf';
|
||||
}
|
||||
|
||||
node.attr = attrs.reduce((pre, attr) => {
|
||||
const { name } = attr;
|
||||
let { value } = attr;
|
||||
if (name === 'class') {
|
||||
node.classStr = value;
|
||||
}
|
||||
// has multi attibutes
|
||||
// make it array of attribute
|
||||
if (name === 'style') {
|
||||
node.styleStr = value;
|
||||
}
|
||||
if (value.match(/ /)) {
|
||||
value = value.split(' ');
|
||||
}
|
||||
|
||||
// if attr already exists
|
||||
// merge it
|
||||
if (pre[name]) {
|
||||
if (Array.isArray(pre[name])) {
|
||||
// already array, push to last
|
||||
pre[name].push(value);
|
||||
} else {
|
||||
// single value, make it array
|
||||
pre[name] = [pre[name], value];
|
||||
}
|
||||
} else {
|
||||
// not exist, put it
|
||||
pre[name] = value;
|
||||
}
|
||||
|
||||
return pre;
|
||||
}, {});
|
||||
|
||||
// 优化样式相关属性
|
||||
if (node.classStr) {
|
||||
node.classStr += ` ${node.tag}`;
|
||||
} else {
|
||||
node.classStr = node.tag;
|
||||
}
|
||||
if (node.tagType === 'inline') {
|
||||
node.classStr += ' inline';
|
||||
}
|
||||
|
||||
// 对img添加额外数据
|
||||
if (node.tag === 'img') {
|
||||
let imgUrl = node.attr.src;
|
||||
imgUrl = wxDiscode.urlToHttpUrl(imgUrl, imageProp.domain);
|
||||
Object.assign(node.attr, imageProp, {
|
||||
src: imgUrl || '',
|
||||
});
|
||||
if (imgUrl) {
|
||||
results.imageUrls.push(imgUrl);
|
||||
}
|
||||
}
|
||||
|
||||
// 处理a标签属性
|
||||
if (node.tag === 'a') {
|
||||
node.attr.href = node.attr.href || '';
|
||||
}
|
||||
|
||||
// 处理font标签样式属性
|
||||
if (node.tag === 'font') {
|
||||
const fontSize = [
|
||||
'x-small',
|
||||
'small',
|
||||
'medium',
|
||||
'large',
|
||||
'x-large',
|
||||
'xx-large',
|
||||
'-webkit-xxx-large',
|
||||
];
|
||||
const styleAttrs = {
|
||||
color: 'color',
|
||||
face: 'font-family',
|
||||
size: 'font-size',
|
||||
};
|
||||
if (!node.styleStr) node.styleStr = '';
|
||||
Object.keys(styleAttrs).forEach((key) => {
|
||||
if (node.attr[key]) {
|
||||
const value = key === 'size' ? fontSize[node.attr[key] - 1] : node.attr[key];
|
||||
node.styleStr += `${styleAttrs[key]}: ${value};`;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 临时记录source资源
|
||||
if (node.tag === 'source') {
|
||||
results.source = node.attr.src;
|
||||
}
|
||||
|
||||
if (customHandler.start) {
|
||||
customHandler.start(node, results);
|
||||
}
|
||||
|
||||
if (unary) {
|
||||
// if this tag doesn't have end tag
|
||||
// like <img src="hoge.png"/>
|
||||
// add to parents
|
||||
const parent = bufArray[0] || results;
|
||||
if (parent.nodes === undefined) {
|
||||
parent.nodes = [];
|
||||
}
|
||||
parent.nodes.push(node);
|
||||
} else {
|
||||
bufArray.unshift(node);
|
||||
}
|
||||
},
|
||||
end(tag) {
|
||||
// merge into parent tag
|
||||
const node = bufArray.shift();
|
||||
if (node.tag !== tag) {
|
||||
console.error('invalid state: mismatch end tag');
|
||||
}
|
||||
|
||||
// 当有缓存source资源时于于video补上src资源
|
||||
if (node.tag === 'video' && results.source) {
|
||||
node.attr.src = results.source;
|
||||
delete results.source;
|
||||
}
|
||||
|
||||
if (customHandler.end) {
|
||||
customHandler.end(node, results);
|
||||
}
|
||||
|
||||
if (bufArray.length === 0) {
|
||||
results.nodes.push(node);
|
||||
} else {
|
||||
const parent = bufArray[0];
|
||||
if (!parent.nodes) {
|
||||
parent.nodes = [];
|
||||
}
|
||||
parent.nodes.push(node);
|
||||
}
|
||||
},
|
||||
chars(text) {
|
||||
if (!text.trim()) return;
|
||||
|
||||
const node = {
|
||||
node: 'text',
|
||||
text,
|
||||
};
|
||||
|
||||
if (customHandler.chars) {
|
||||
customHandler.chars(node, results);
|
||||
}
|
||||
|
||||
if (bufArray.length === 0) {
|
||||
results.nodes.push(node);
|
||||
} else {
|
||||
const parent = bufArray[0];
|
||||
if (parent.nodes === undefined) {
|
||||
parent.nodes = [];
|
||||
}
|
||||
parent.nodes.push(node);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
return results;
|
||||
}
|
||||
|
||||
export default html2json;
|
||||
156
components/u-parse/libs/htmlparser.js
Normal file
@@ -0,0 +1,156 @@
|
||||
/**
|
||||
*
|
||||
* htmlParser改造自: https://github.com/blowsie/Pure-JavaScript-HTML5-Parser
|
||||
*
|
||||
* author: Di (微信小程序开发工程师)
|
||||
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
||||
* 垂直微信小程序开发交流社区
|
||||
*
|
||||
* github地址: https://github.com/icindy/wxParse
|
||||
*
|
||||
* for: 微信小程序富文本解析
|
||||
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
||||
*/
|
||||
// Regular Expressions for parsing tags and attributes
|
||||
|
||||
const startTag = /^<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z0-9_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/;
|
||||
const endTag = /^<\/([-A-Za-z0-9_]+)[^>]*>/;
|
||||
const attr = /([a-zA-Z0-9_:][-a-zA-Z0-9_:.]*)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|([^>\s]+)))?/g;
|
||||
|
||||
function makeMap(str) {
|
||||
const obj = {};
|
||||
const items = str.split(',');
|
||||
for (let i = 0; i < items.length; i += 1) obj[items[i]] = true;
|
||||
return obj;
|
||||
}
|
||||
|
||||
// Empty Elements - HTML 5
|
||||
const empty = makeMap('area,base,basefont,br,col,frame,hr,img,input,link,meta,param,embed,command,keygen,source,track,wbr');
|
||||
|
||||
// Block Elements - HTML 5
|
||||
const block = makeMap('address,code,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video');
|
||||
|
||||
// Inline Elements - HTML 5
|
||||
const inline = makeMap('a,abbr,acronym,applet,b,basefont,bdo,big,br,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var');
|
||||
|
||||
// Elements that you can, intentionally, leave open
|
||||
// (and which close themselves)
|
||||
const closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr');
|
||||
|
||||
// Attributes that have their values filled in disabled="disabled"
|
||||
const fillAttrs = makeMap('checked,compact,declare,defer,disabled,ismap,multiple,nohref,noresize,noshade,nowrap,readonly,selected');
|
||||
|
||||
function HTMLParser(html, handler) {
|
||||
let index;
|
||||
let chars;
|
||||
let match;
|
||||
let last = html;
|
||||
const stack = [];
|
||||
|
||||
stack.last = () => stack[stack.length - 1];
|
||||
|
||||
function parseEndTag(tag, tagName) {
|
||||
// If no tag name is provided, clean shop
|
||||
let pos;
|
||||
if (!tagName) {
|
||||
pos = 0;
|
||||
} else {
|
||||
// Find the closest opened tag of the same type
|
||||
tagName = tagName.toLowerCase();
|
||||
for (pos = stack.length - 1; pos >= 0; pos -= 1) {
|
||||
if (stack[pos] === tagName) break;
|
||||
}
|
||||
}
|
||||
if (pos >= 0) {
|
||||
// Close all the open elements, up the stack
|
||||
for (let i = stack.length - 1; i >= pos; i -= 1) {
|
||||
if (handler.end) handler.end(stack[i]);
|
||||
}
|
||||
|
||||
// Remove the open elements from the stack
|
||||
stack.length = pos;
|
||||
}
|
||||
}
|
||||
|
||||
function parseStartTag(tag, tagName, rest, unary) {
|
||||
tagName = tagName.toLowerCase();
|
||||
|
||||
if (block[tagName]) {
|
||||
while (stack.last() && inline[stack.last()]) {
|
||||
parseEndTag('', stack.last());
|
||||
}
|
||||
}
|
||||
|
||||
if (closeSelf[tagName] && stack.last() === tagName) {
|
||||
parseEndTag('', tagName);
|
||||
}
|
||||
|
||||
unary = empty[tagName] || !!unary;
|
||||
|
||||
if (!unary) stack.push(tagName);
|
||||
|
||||
if (handler.start) {
|
||||
const attrs = [];
|
||||
|
||||
rest.replace(attr, function genAttr(matches, name) {
|
||||
const value = arguments[2] || arguments[3] || arguments[4] || (fillAttrs[name] ? name : '');
|
||||
|
||||
attrs.push({
|
||||
name,
|
||||
value,
|
||||
escaped: value.replace(/(^|[^\\])"/g, '$1\\"'), // "
|
||||
});
|
||||
});
|
||||
|
||||
if (handler.start) {
|
||||
handler.start(tagName, attrs, unary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
while (html) {
|
||||
chars = true;
|
||||
|
||||
if (html.indexOf('</') === 0) {
|
||||
match = html.match(endTag);
|
||||
|
||||
if (match) {
|
||||
html = html.substring(match[0].length);
|
||||
match[0].replace(endTag, parseEndTag);
|
||||
chars = false;
|
||||
}
|
||||
|
||||
// start tag
|
||||
} else if (html.indexOf('<') === 0) {
|
||||
match = html.match(startTag);
|
||||
|
||||
if (match) {
|
||||
html = html.substring(match[0].length);
|
||||
match[0].replace(startTag, parseStartTag);
|
||||
chars = false;
|
||||
}
|
||||
}
|
||||
|
||||
if (chars) {
|
||||
index = html.indexOf('<');
|
||||
let text = '';
|
||||
while (index === 0) {
|
||||
text += '<';
|
||||
html = html.substring(1);
|
||||
index = html.indexOf('<');
|
||||
}
|
||||
text += index < 0 ? html : html.substring(0, index);
|
||||
html = index < 0 ? '' : html.substring(index);
|
||||
|
||||
if (handler.chars) handler.chars(text);
|
||||
}
|
||||
|
||||
if (html === last) throw new Error(`Parse Error: ${html}`);
|
||||
last = html;
|
||||
}
|
||||
|
||||
// Clean up any remaining tags
|
||||
parseEndTag();
|
||||
}
|
||||
|
||||
export default HTMLParser;
|
||||
195
components/u-parse/libs/wxDiscode.js
Normal file
@@ -0,0 +1,195 @@
|
||||
// HTML 支持的数学符号
|
||||
function strNumDiscode(str) {
|
||||
str = str.replace(/∀/g, '∀');
|
||||
str = str.replace(/∂/g, '∂');
|
||||
str = str.replace(/∃/g, '∃');
|
||||
str = str.replace(/∅/g, '∅');
|
||||
str = str.replace(/∇/g, '∇');
|
||||
str = str.replace(/∈/g, '∈');
|
||||
str = str.replace(/∉/g, '∉');
|
||||
str = str.replace(/∋/g, '∋');
|
||||
str = str.replace(/∏/g, '∏');
|
||||
str = str.replace(/∑/g, '∑');
|
||||
str = str.replace(/−/g, '−');
|
||||
str = str.replace(/∗/g, '∗');
|
||||
str = str.replace(/√/g, '√');
|
||||
str = str.replace(/∝/g, '∝');
|
||||
str = str.replace(/∞/g, '∞');
|
||||
str = str.replace(/∠/g, '∠');
|
||||
str = str.replace(/∧/g, '∧');
|
||||
str = str.replace(/∨/g, '∨');
|
||||
str = str.replace(/∩/g, '∩');
|
||||
str = str.replace(/∪/g, '∪');
|
||||
str = str.replace(/∫/g, '∫');
|
||||
str = str.replace(/∴/g, '∴');
|
||||
str = str.replace(/∼/g, '∼');
|
||||
str = str.replace(/≅/g, '≅');
|
||||
str = str.replace(/≈/g, '≈');
|
||||
str = str.replace(/≠/g, '≠');
|
||||
str = str.replace(/≤/g, '≤');
|
||||
str = str.replace(/≥/g, '≥');
|
||||
str = str.replace(/⊂/g, '⊂');
|
||||
str = str.replace(/⊃/g, '⊃');
|
||||
str = str.replace(/⊄/g, '⊄');
|
||||
str = str.replace(/⊆/g, '⊆');
|
||||
str = str.replace(/⊇/g, '⊇');
|
||||
str = str.replace(/⊕/g, '⊕');
|
||||
str = str.replace(/⊗/g, '⊗');
|
||||
str = str.replace(/⊥/g, '⊥');
|
||||
str = str.replace(/⋅/g, '⋅');
|
||||
return str;
|
||||
}
|
||||
|
||||
// HTML 支持的希腊字母
|
||||
function strGreeceDiscode(str) {
|
||||
str = str.replace(/Α/g, 'Α');
|
||||
str = str.replace(/Β/g, 'Β');
|
||||
str = str.replace(/Γ/g, 'Γ');
|
||||
str = str.replace(/Δ/g, 'Δ');
|
||||
str = str.replace(/Ε/g, 'Ε');
|
||||
str = str.replace(/Ζ/g, 'Ζ');
|
||||
str = str.replace(/Η/g, 'Η');
|
||||
str = str.replace(/Θ/g, 'Θ');
|
||||
str = str.replace(/Ι/g, 'Ι');
|
||||
str = str.replace(/Κ/g, 'Κ');
|
||||
str = str.replace(/Λ/g, 'Λ');
|
||||
str = str.replace(/Μ/g, 'Μ');
|
||||
str = str.replace(/Ν/g, 'Ν');
|
||||
str = str.replace(/Ξ/g, 'Ν');
|
||||
str = str.replace(/Ο/g, 'Ο');
|
||||
str = str.replace(/Π/g, 'Π');
|
||||
str = str.replace(/Ρ/g, 'Ρ');
|
||||
str = str.replace(/Σ/g, 'Σ');
|
||||
str = str.replace(/Τ/g, 'Τ');
|
||||
str = str.replace(/Υ/g, 'Υ');
|
||||
str = str.replace(/Φ/g, 'Φ');
|
||||
str = str.replace(/Χ/g, 'Χ');
|
||||
str = str.replace(/Ψ/g, 'Ψ');
|
||||
str = str.replace(/Ω/g, 'Ω');
|
||||
|
||||
str = str.replace(/α/g, 'α');
|
||||
str = str.replace(/β/g, 'β');
|
||||
str = str.replace(/γ/g, 'γ');
|
||||
str = str.replace(/δ/g, 'δ');
|
||||
str = str.replace(/ε/g, 'ε');
|
||||
str = str.replace(/ζ/g, 'ζ');
|
||||
str = str.replace(/η/g, 'η');
|
||||
str = str.replace(/θ/g, 'θ');
|
||||
str = str.replace(/ι/g, 'ι');
|
||||
str = str.replace(/κ/g, 'κ');
|
||||
str = str.replace(/λ/g, 'λ');
|
||||
str = str.replace(/μ/g, 'μ');
|
||||
str = str.replace(/ν/g, 'ν');
|
||||
str = str.replace(/ξ/g, 'ξ');
|
||||
str = str.replace(/ο/g, 'ο');
|
||||
str = str.replace(/π/g, 'π');
|
||||
str = str.replace(/ρ/g, 'ρ');
|
||||
str = str.replace(/ς/g, 'ς');
|
||||
str = str.replace(/σ/g, 'σ');
|
||||
str = str.replace(/τ/g, 'τ');
|
||||
str = str.replace(/υ/g, 'υ');
|
||||
str = str.replace(/φ/g, 'φ');
|
||||
str = str.replace(/χ/g, 'χ');
|
||||
str = str.replace(/ψ/g, 'ψ');
|
||||
str = str.replace(/ω/g, 'ω');
|
||||
str = str.replace(/ϑ/g, 'ϑ');
|
||||
str = str.replace(/ϒ/g, 'ϒ');
|
||||
str = str.replace(/ϖ/g, 'ϖ');
|
||||
str = str.replace(/·/g, '·');
|
||||
return str;
|
||||
}
|
||||
|
||||
function strcharacterDiscode(str) {
|
||||
// 加入常用解析
|
||||
str = str.replace(/ /g, ' ');
|
||||
str = str.replace(/ /g, ' ');
|
||||
str = str.replace(/ /g, ' ');
|
||||
str = str.replace(/"/g, "'");
|
||||
str = str.replace(/&/g, '&');
|
||||
str = str.replace(/</g, '<');
|
||||
str = str.replace(/>/g, '>');
|
||||
str = str.replace(/•/g, '•');
|
||||
|
||||
return str;
|
||||
}
|
||||
|
||||
// HTML 支持的其他实体
|
||||
function strOtherDiscode(str) {
|
||||
str = str.replace(/Œ/g, 'Œ');
|
||||
str = str.replace(/œ/g, 'œ');
|
||||
str = str.replace(/Š/g, 'Š');
|
||||
str = str.replace(/š/g, 'š');
|
||||
str = str.replace(/Ÿ/g, 'Ÿ');
|
||||
str = str.replace(/ƒ/g, 'ƒ');
|
||||
str = str.replace(/ˆ/g, 'ˆ');
|
||||
str = str.replace(/˜/g, '˜');
|
||||
str = str.replace(/ /g, '');
|
||||
str = str.replace(/ /g, '');
|
||||
str = str.replace(/ /g, '');
|
||||
str = str.replace(/‌/g, '');
|
||||
str = str.replace(/‍/g, '');
|
||||
str = str.replace(/‎/g, '');
|
||||
str = str.replace(/‏/g, '');
|
||||
str = str.replace(/–/g, '–');
|
||||
str = str.replace(/—/g, '—');
|
||||
str = str.replace(/‘/g, '‘');
|
||||
str = str.replace(/’/g, '’');
|
||||
str = str.replace(/‚/g, '‚');
|
||||
str = str.replace(/“/g, '“');
|
||||
str = str.replace(/”/g, '”');
|
||||
str = str.replace(/„/g, '„');
|
||||
str = str.replace(/†/g, '†');
|
||||
str = str.replace(/‡/g, '‡');
|
||||
str = str.replace(/•/g, '•');
|
||||
str = str.replace(/…/g, '…');
|
||||
str = str.replace(/‰/g, '‰');
|
||||
str = str.replace(/′/g, '′');
|
||||
str = str.replace(/″/g, '″');
|
||||
str = str.replace(/‹/g, '‹');
|
||||
str = str.replace(/›/g, '›');
|
||||
str = str.replace(/‾/g, '‾');
|
||||
str = str.replace(/€/g, '€');
|
||||
str = str.replace(/™/g, '™');
|
||||
|
||||
str = str.replace(/←/g, '←');
|
||||
str = str.replace(/↑/g, '↑');
|
||||
str = str.replace(/→/g, '→');
|
||||
str = str.replace(/↓/g, '↓');
|
||||
str = str.replace(/↔/g, '↔');
|
||||
str = str.replace(/↵/g, '↵');
|
||||
str = str.replace(/⌈/g, '⌈');
|
||||
str = str.replace(/⌉/g, '⌉');
|
||||
|
||||
str = str.replace(/⌊/g, '⌊');
|
||||
str = str.replace(/⌋/g, '⌋');
|
||||
str = str.replace(/◊/g, '◊');
|
||||
str = str.replace(/♠/g, '♠');
|
||||
str = str.replace(/♣/g, '♣');
|
||||
str = str.replace(/♥/g, '♥');
|
||||
|
||||
str = str.replace(/♦/g, '♦');
|
||||
str = str.replace(/'/g, "'");
|
||||
return str;
|
||||
}
|
||||
|
||||
function strDiscode(str) {
|
||||
str = strNumDiscode(str);
|
||||
str = strGreeceDiscode(str);
|
||||
str = strcharacterDiscode(str);
|
||||
str = strOtherDiscode(str);
|
||||
return str;
|
||||
}
|
||||
|
||||
function urlToHttpUrl(url, domain) {
|
||||
if (/^\/\//.test(url)) {
|
||||
return `https:${url}`;
|
||||
} else if (/^\//.test(url)) {
|
||||
return `https://${domain}${url}`;
|
||||
}
|
||||
return url;
|
||||
}
|
||||
|
||||
export default {
|
||||
strDiscode,
|
||||
urlToHttpUrl,
|
||||
};
|
||||
102
components/u-parse/readme.md
Normal file
@@ -0,0 +1,102 @@
|
||||
## uParse 适用于 uni-app/mpvue 的富文本解析组件
|
||||
|
||||
> 支持 Html、Markdown 解析,Fork自: [mpvue-wxParse](https://github.com/F-loat/mpvue-wxParse)
|
||||
|
||||
|
||||
## 属性
|
||||
|
||||
| 名称 | 类型 | 默认值 | 描述 |
|
||||
| -----------------|--------------- | ------------- | ---------------- |
|
||||
| loading | Boolean | false | 数据加载状态 |
|
||||
| className | String | — | 自定义 class 名称 |
|
||||
| content | String | — | 渲染内容 |
|
||||
| noData | String | 数据不能为空 | 空数据时的渲染展示 |
|
||||
| startHandler | Function | 见源码 | 自定义 parser 函数 |
|
||||
| endHandler | Function | null | 自定义 parser 函数 |
|
||||
| charsHandler | Function | null | 自定义 parser 函数 |
|
||||
| imageProp | Object | 见下文 | 图片相关参数 |
|
||||
|
||||
### 自定义 parser 函数具体介绍
|
||||
|
||||
* 传入的参数为当前节点 `node` 对象及解析结果 `results` 对象,例如 `startHandler(node, results)`
|
||||
* 无需返回值,通过对传入的参数直接操作来完成需要的改动
|
||||
* 自定义函数会在原解析函数处理之后执行
|
||||
|
||||
### imageProp 对象具体属性
|
||||
|
||||
| 名称 | 类型 | 默认值 | 描述 |
|
||||
| -----------------|--------------- | ------------- | ------------------ |
|
||||
| mode | String | 'aspectFit' | 图片裁剪、缩放的模式 |
|
||||
| padding | Number | 0 | 图片内边距 |
|
||||
| lazyLoad | Boolean | false | 图片懒加载 |
|
||||
| domain | String | '' | 图片服务域名 |
|
||||
|
||||
## 事件
|
||||
|
||||
| 名称 | 参数 | 描述 |
|
||||
| -----------------|----------------- | ---------------- |
|
||||
| preview | 图片地址,原始事件 | 预览图片时触发 |
|
||||
| navigate | 链接地址,原始事件 | 点击链接时触发 |
|
||||
|
||||
## 基本使用方法
|
||||
|
||||
|
||||
``` vue
|
||||
<template>
|
||||
<div>
|
||||
<u-parse :content="article" @preview="preview" @navigate="navigate" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uParse from '@/components/u-parse/u-parse.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
uParse
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
article: '<div>我是HTML代码</div>'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
preview(src, e) {
|
||||
// do something
|
||||
},
|
||||
navigate(href, e) {
|
||||
// do something
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("@/components/u-parse/u-parse.css");
|
||||
</style>
|
||||
```
|
||||
|
||||
|
||||
## 渲染 Markdown
|
||||
|
||||
> 先将 markdown 转换为 html 即可
|
||||
|
||||
```
|
||||
npm install marked
|
||||
```
|
||||
|
||||
``` js
|
||||
import marked from 'marked'
|
||||
import uParse from '@/components/u-parse/u-parse.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
uParse
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
article: marked(`#hello, markdown!`)
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
232
components/u-parse/u-parse.css
Normal file
@@ -0,0 +1,232 @@
|
||||
/**
|
||||
* author: Di (微信小程序开发工程师)
|
||||
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
||||
* 垂直微信小程序开发交流社区
|
||||
*
|
||||
* github地址: https://github.com/icindy/wxParse
|
||||
*
|
||||
* for: 微信小程序富文本解析
|
||||
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
||||
*/
|
||||
|
||||
.wxParse {
|
||||
width: 100%;
|
||||
font-family: Helvetica, sans-serif;
|
||||
font-size: 30upx;
|
||||
color: #666;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.wxParse view {
|
||||
word-break: hyphenate;
|
||||
}
|
||||
|
||||
.wxParse .inline {
|
||||
display: inline;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.wxParse .div {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.wxParse .h1 .text {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
.wxParse .h2 .text {
|
||||
font-size: 1.5em;
|
||||
margin: 0.83em 0;
|
||||
}
|
||||
.wxParse .h3 .text {
|
||||
font-size: 1.17em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
.wxParse .h4 .text {
|
||||
margin: 1.33em 0;
|
||||
}
|
||||
.wxParse .h5 .text {
|
||||
font-size: 0.83em;
|
||||
margin: 1.67em 0;
|
||||
}
|
||||
.wxParse .h6 .text {
|
||||
font-size: 0.67em;
|
||||
margin: 2.33em 0;
|
||||
}
|
||||
|
||||
.wxParse .h1 .text,
|
||||
.wxParse .h2 .text,
|
||||
.wxParse .h3 .text,
|
||||
.wxParse .h4 .text,
|
||||
.wxParse .h5 .text,
|
||||
.wxParse .h6 .text,
|
||||
.wxParse .b,
|
||||
.wxParse .strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
|
||||
.wxParse .p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.wxParse .i,
|
||||
.wxParse .cite,
|
||||
.wxParse .em,
|
||||
.wxParse .var,
|
||||
.wxParse .address {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.wxParse .pre,
|
||||
.wxParse .tt,
|
||||
.wxParse .code,
|
||||
.wxParse .kbd,
|
||||
.wxParse .samp {
|
||||
font-family: monospace;
|
||||
}
|
||||
.wxParse .pre {
|
||||
overflow: auto;
|
||||
background: #f5f5f5;
|
||||
padding: 16upx;
|
||||
white-space: pre;
|
||||
margin: 1em 0upx;
|
||||
}
|
||||
.wxParse .code {
|
||||
display: inline;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.wxParse .big {
|
||||
font-size: 1.17em;
|
||||
}
|
||||
|
||||
.wxParse .small,
|
||||
.wxParse .sub,
|
||||
.wxParse .sup {
|
||||
font-size: 0.83em;
|
||||
}
|
||||
|
||||
.wxParse .sub {
|
||||
vertical-align: sub;
|
||||
}
|
||||
.wxParse .sup {
|
||||
vertical-align: super;
|
||||
}
|
||||
|
||||
.wxParse .s,
|
||||
.wxParse .strike,
|
||||
.wxParse .del {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.wxParse .strong,
|
||||
.wxParse .s {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.wxParse .a {
|
||||
color: deepskyblue;
|
||||
}
|
||||
|
||||
.wxParse .video {
|
||||
text-align: center;
|
||||
margin: 22upx 0;
|
||||
}
|
||||
|
||||
.wxParse .video-video {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.wxParse .img {
|
||||
display: inline-block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.wxParse .blockquote {
|
||||
margin: 10upx 0;
|
||||
padding: 22upx 0 22upx 22upx;
|
||||
font-family: Courier, Calibri, "宋体";
|
||||
background: #f5f5f5;
|
||||
border-left: 6upx solid #dbdbdb;
|
||||
}
|
||||
.wxParse .blockquote .p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.wxParse .ul, .wxParse .ol {
|
||||
display: block;
|
||||
margin: 1em 0;
|
||||
padding-left: 33upx;
|
||||
}
|
||||
.wxParse .ol {
|
||||
list-style-type: disc;
|
||||
}
|
||||
.wxParse .ol {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
.wxParse .ol>weixin-parse-template,.wxParse .ul>weixin-parse-template {
|
||||
display: list-item;
|
||||
align-items: baseline;
|
||||
text-align: match-parent;
|
||||
}
|
||||
|
||||
.wxParse .ol>.li,.wxParse .ul>.li {
|
||||
display: list-item;
|
||||
align-items: baseline;
|
||||
text-align: match-parent;
|
||||
}
|
||||
.wxParse .ul .ul, .wxParse .ol .ul {
|
||||
list-style-type: circle;
|
||||
}
|
||||
.wxParse .ol .ol .ul, .wxParse .ol .ul .ul, .wxParse .ul .ol .ul, .wxParse .ul .ul .ul {
|
||||
list-style-type: square;
|
||||
}
|
||||
|
||||
.wxParse .u {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.wxParse .hide {
|
||||
display: none;
|
||||
}
|
||||
.wxParse .del {
|
||||
display: inline;
|
||||
}
|
||||
.wxParse .figure {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.wxParse .table {
|
||||
width: 100%;
|
||||
}
|
||||
.wxParse .thead, .wxParse .tfoot, .wxParse .tr {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.wxParse .tr {
|
||||
width:100%;
|
||||
display: flex;
|
||||
border-right: 2upx solid #e0e0e0;
|
||||
border-bottom: 2upx solid #e0e0e0;
|
||||
}
|
||||
.wxParse .th,
|
||||
.wxParse .td {
|
||||
display: flex;
|
||||
width: 1276upx;
|
||||
overflow: auto;
|
||||
flex: 1;
|
||||
padding: 11upx;
|
||||
border-left: 2upx solid #e0e0e0;
|
||||
}
|
||||
.wxParse .td:last {
|
||||
border-top: 2upx solid #e0e0e0;
|
||||
}
|
||||
.wxParse .th {
|
||||
background: #f0f0f0;
|
||||
border-top: 2upx solid #e0e0e0;
|
||||
}
|
||||
118
components/u-parse/u-parse.vue
Normal file
@@ -0,0 +1,118 @@
|
||||
<!--**
|
||||
* forked from:https://github.com/F-loat/mpvue-wxParse
|
||||
*
|
||||
* github地址: https://github.com/dcloudio/uParse
|
||||
*
|
||||
* for: uni-app框架下 富文本解析
|
||||
*/-->
|
||||
|
||||
<template>
|
||||
<!--基础元素-->
|
||||
<div class="wxParse" :class="className" v-if="!loading">
|
||||
<block v-for="(node,index) of nodes" :key="index">
|
||||
<wxParseTemplate :node="node" />
|
||||
</block>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import HtmlToJson from './libs/html2json';
|
||||
import wxParseTemplate from './components/wxParseTemplate0';
|
||||
|
||||
export default {
|
||||
name: 'wxParse',
|
||||
props: {
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
className: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
content: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
noData: {
|
||||
type: String,
|
||||
default: '<div style="color: red;">数据不能为空</div>',
|
||||
},
|
||||
startHandler: {
|
||||
type: Function,
|
||||
default() {
|
||||
return (node) => {
|
||||
node.attr.class = null;
|
||||
node.attr.style = null;
|
||||
};
|
||||
},
|
||||
},
|
||||
endHandler: {
|
||||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
charsHandler: {
|
||||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
imageProp: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {
|
||||
mode: 'aspectFit',
|
||||
padding: 0,
|
||||
lazyLoad: false,
|
||||
domain: '',
|
||||
};
|
||||
},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
wxParseTemplate,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imageUrls: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
nodes() {
|
||||
const {
|
||||
content,
|
||||
noData,
|
||||
imageProp,
|
||||
startHandler,
|
||||
endHandler,
|
||||
charsHandler,
|
||||
} = this;
|
||||
const parseData = content || noData;
|
||||
const customHandler = {
|
||||
start: startHandler,
|
||||
end: endHandler,
|
||||
chars: charsHandler,
|
||||
};
|
||||
const results = HtmlToJson(parseData, customHandler, imageProp, this);
|
||||
this.imageUrls = results.imageUrls;
|
||||
console.log(results)
|
||||
return results.nodes;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
navigate(href, $event) {
|
||||
this.$emit('navigate', href, $event);
|
||||
},
|
||||
preview(src, $event) {
|
||||
if (!this.imageUrls.length) return;
|
||||
wx.previewImage({
|
||||
current: src,
|
||||
urls: this.imageUrls,
|
||||
});
|
||||
this.$emit('preview', src, $event);
|
||||
},
|
||||
removeImageUrl(src) {
|
||||
const { imageUrls } = this;
|
||||
imageUrls.splice(imageUrls.indexOf(src), 1);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name" : "shitong-app",
|
||||
"appid": "",
|
||||
"appid" : "__UNI__807D381",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
|
||||
51
pages.json
@@ -2,7 +2,9 @@
|
||||
"easycom": {
|
||||
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
|
||||
},
|
||||
"pages": [{
|
||||
"pages": [
|
||||
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "食瞳",
|
||||
@@ -11,7 +13,7 @@
|
||||
//导航栏取消
|
||||
// "navigationStyle": "custom",
|
||||
//是否开启下拉刷新
|
||||
"enablePullDownRefresh": false
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -37,9 +39,54 @@
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationStyle": "custom",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/news/news",
|
||||
"style": {
|
||||
"navigationBarTitleText": "行内新闻",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarBackgroundColor": "#12CA64",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}, {
|
||||
"path": "pages/certifiedCj/certifiedCj",
|
||||
"style": {
|
||||
"navigationBarTitleText": "认证厂家",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarBackgroundColor": "#12CA64",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}, {
|
||||
"path": "pages/detail/xwDetail/xwDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "行业新闻详情",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarBackgroundColor": "#12CA64",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}, {
|
||||
"path": "pages/detail/productsDetail/productsDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商品详情",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarBackgroundColor": "#12CA64",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}, {
|
||||
"path": "pages/detail/certifiedCjDetail/certifiedCjDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "厂家信息",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarBackgroundColor": "#12CA64",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}
|
||||
],
|
||||
"tabBar": {
|
||||
|
||||
117
pages/certifiedCj/certifiedCj.vue
Normal file
@@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<view style="margin-top: 20rpx; height: 1176rpx;background: #FFFFFF;">
|
||||
<view class="xw_content" v-for="(item,index) in cjsList" :key="index" @click="click(index)">
|
||||
<u--image :src="item.src" width="112rpx" height="112rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<view class="xw_right">
|
||||
<view class="xw_title">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view style="display: flex;">
|
||||
<text class="cj_tags" v-for="(tagsItem,tagsIndex) in item.tags" :key="tagsIndex">
|
||||
{{tagsItem.tag}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="cjsShow" class="no-data">已经到底啦!</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
cjsShow: true,
|
||||
cjsList: [{
|
||||
src: '/static/report/zhanwei_xf(1).png',
|
||||
title: '西安兴沃丰餐饮管理有限责任公司',
|
||||
tags: [{
|
||||
tag: '咖啡'
|
||||
},
|
||||
{
|
||||
tag: '饮品'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
src: '/static/report/zhanwei_xf(2).png',
|
||||
title: '福建省海纳川食品有限公司',
|
||||
tags: [{
|
||||
tag: '活冻鲍鱼'
|
||||
},
|
||||
{
|
||||
tag: '鲍鱼罐头'
|
||||
},
|
||||
{
|
||||
tag: '佛跳墙'
|
||||
},
|
||||
{
|
||||
tag: '海螺片'
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
click(index) {
|
||||
if (index == 0) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/detail/certifiedCjDetail/certifiedCjDetail'
|
||||
})
|
||||
}
|
||||
}
|
||||
// this.cjsShow = this.list.length === 0 ? true : false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.no-data {
|
||||
text-align: center;
|
||||
margin-top: 29rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #BBBBBB;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
|
||||
.xw_content {
|
||||
background: #FFFFFF;
|
||||
border: 1rpx solid #EEEEEE;
|
||||
display: flex;
|
||||
padding: 29rpx 19rpx;
|
||||
|
||||
.xw_right {
|
||||
padding-left: 19rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.xw_title {
|
||||
font-size: 30rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #3E3E3E;
|
||||
line-height: 42rpx;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.cj_tags {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #969696;
|
||||
line-height: 33rpx;
|
||||
padding-right: 10rpx;
|
||||
margin-top: 35rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
145
pages/detail/certifiedCjDetail/certifiedCjDetail.vue
Normal file
@@ -0,0 +1,145 @@
|
||||
<template>
|
||||
<view>
|
||||
<u--image :src="src" width="750rpx" height="290rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<view class="feature">
|
||||
<text class="one_title">经营范围及特色</text>
|
||||
<view class="green_block">
|
||||
<text class="green_features">{{features}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="introduce">
|
||||
<view class="introduce_title">企业介绍</view>
|
||||
<text class="business_introduce">{{business_introduce}}</text>
|
||||
</view>
|
||||
<view class="show">
|
||||
<view class="introduce_title">企业展示</view>
|
||||
<u-grid :border="false" col="4">
|
||||
<u-grid-item v-for="(listItem,listIndex) in showList" :key="listIndex">
|
||||
<u--image :src="listItem.src" width="170rpx" height="170rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
<view class="footer">
|
||||
<u-icon name="kefu-ermai" color="#fff" size="30rpx"></u-icon>
|
||||
<text>联系客服</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
src: '/static/detail/cj_bg.png',
|
||||
features: '活冻鲍鱼,冻煮鲍鱼,鲍鱼罐头 佛跳墙,海螺片',
|
||||
business_introduce: '福建省海纳川食品有限公司是一家从事水产养殖,加工与销售为一体的现代化企业,公司主要加工:活冻鲍鱼,溏心皇金鲍,兰花蟹,黄金鲍片,佛跳墙,大盆菜,火锅小章鱼,鲨鱼礼盒等系列产品。公司位于福建省自由贸易试验区马尾片区,离全国大的水产交易市场--马尾名成水产市场不到一公里,这里交通方便,商贾云集,冷链物流通达全国。',
|
||||
showList: [{
|
||||
src: '/static/report/zhanwei_xf(1).png'
|
||||
}, {
|
||||
src: '/static/report/zhanwei_xf(1).png'
|
||||
}, {
|
||||
src: '/static/report/zhanwei_xf(1).png'
|
||||
},
|
||||
{
|
||||
src: '/static/report/zhanwei_xf(1).png'
|
||||
},
|
||||
]
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.feature {
|
||||
padding: 20rpx 16rpx;
|
||||
background-color: #fff;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.one_title {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #3E3E3E;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.green_block {
|
||||
background-color: #16CA65;
|
||||
margin-top: 20rpx;
|
||||
|
||||
height: 139rpx;
|
||||
border-radius: 6rpx;
|
||||
|
||||
.green_features {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
line-height: 33rpx;
|
||||
margin-left: 20rpx;
|
||||
margin-top: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.introduce {
|
||||
padding: 20rpx 16rpx;
|
||||
background-color: #fff;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.introduce_title {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #3E3E3E;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.business_introduce {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
line-height: 33rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.show {
|
||||
padding: 20rpx 16rpx;
|
||||
background-color: #fff;
|
||||
margin-bottom: 78rpx;
|
||||
|
||||
.u-grid {
|
||||
padding-top: 22rpx !important;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
height: 100rpx;
|
||||
background: #0EBB5B;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
text-align: center;
|
||||
|
||||
.u-icon {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
text {
|
||||
font-size: 20rpx;
|
||||
font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
line-height: 26rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
175
pages/detail/productsDetail/productsDetail.vue
Normal file
@@ -0,0 +1,175 @@
|
||||
<template>
|
||||
<view>
|
||||
<view v-for="(item,index) in detailList" :key="index">
|
||||
<u-image :src="item.src" width="750rpx" height="530rpx" :lazy-load="true">
|
||||
</u-image>
|
||||
<view class="collect">
|
||||
<u-icon :name="like?'heart-fill':'heart'" color="#FEAA19" size="23" @click.stop="likeTap"></u-icon>
|
||||
<view class="collect_text">收藏</view>
|
||||
</view>
|
||||
|
||||
<view class="content">
|
||||
<view class="title_box">
|
||||
<text class="title">{{item.title}}</text>
|
||||
<view class="title_tag">{{item.tag}}</view>
|
||||
</view>
|
||||
<view class="desc">
|
||||
{{item.desc}}
|
||||
</view>
|
||||
<view class="classify">
|
||||
{{item.classify}}
|
||||
</view>
|
||||
<view class="tagOne">{{item.tagOne}}</view>
|
||||
<view class="tagTwo">{{item.tagTwo}}</view>
|
||||
</view>
|
||||
|
||||
<view class="releaseDate">
|
||||
<u-image src="/static/products/sy_icon_sjf.png" width="24rpx" height="24rpx" :lazy-load="true">
|
||||
</u-image>
|
||||
<text class="release">发布日期:</text>
|
||||
<text>{{item.time}}</text>
|
||||
</view>
|
||||
<u-parse :content="item.content" @preview="preview" @navigate="navigate"></u-parse>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
like: false,
|
||||
detailList: [{
|
||||
src: '/static/detail/zhanwei_xppx.png',
|
||||
title: '锅巴',
|
||||
tag: '零食铺子',
|
||||
desc: '糯米蟹黄锅巴散装,非油炸绿色健康食品',
|
||||
classify: '薯片膨化',
|
||||
tagOne: '无添加剂',
|
||||
tagTwo: '无添加剂',
|
||||
time: '2022年12月04日',
|
||||
content: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
|
||||
}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
likeTap() {
|
||||
this.like = !this.like
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.collect {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
top: 16rpx;
|
||||
right: 0;
|
||||
background-color: #a6a6a6;
|
||||
color: #fff;
|
||||
border-radius: 54rpx 0px 0px 54rpx;
|
||||
padding: 2px 2px 2px 3px;
|
||||
|
||||
.collect_text {
|
||||
font-size: 26rpx;
|
||||
padding: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 20rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.title_box {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 400;
|
||||
color: #0EBB5B;
|
||||
line-height: 50rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.title_tag {
|
||||
height: 30rpx;
|
||||
background: #0EBB5B;
|
||||
border-radius: 7rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
line-height: 28rpx;
|
||||
padding: 1rpx 15rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 30rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #3E3E3E;
|
||||
line-height: 34rpx;
|
||||
padding: 15rpx 0;
|
||||
}
|
||||
|
||||
.classify {
|
||||
width: 80rpx;
|
||||
height: 30rpx;
|
||||
border-radius: 6rpx;
|
||||
border: 1rpx solid #EEEEEE;
|
||||
font-size: 20rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
line-height: 28rpx;
|
||||
padding: 1rpx 15rpx;
|
||||
}
|
||||
|
||||
.tagOne {
|
||||
font-size: 20rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #CCCCCC;
|
||||
line-height: 28rpx;
|
||||
float: left;
|
||||
padding-top: 14rpx;
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
|
||||
.tagTwo {
|
||||
font-size: 20rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #CCCCCC;
|
||||
line-height: 28rpx;
|
||||
padding-top: 14rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.releaseDate {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
line-height: 33rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 24rpx 20rpx;
|
||||
margin-top: 20rpx;
|
||||
background-color: #fff;
|
||||
|
||||
|
||||
.release {
|
||||
padding: 0 10rpx 0 6rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
67
pages/detail/xwDetail/xwDetail.vue
Normal file
@@ -0,0 +1,67 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="xw_title">
|
||||
{{title}}
|
||||
</view>
|
||||
<view style="display: flex;">
|
||||
<text class="xw_time">
|
||||
{{time}}
|
||||
</text>
|
||||
<text class="xw_time xw_place">
|
||||
{{place}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="xw_content">
|
||||
<u-parse :content="news" @preview="preview" @navigate="navigate"></u-parse>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title: '2022近50款食品饮料新品,创新的方向都在这里',
|
||||
time: '2022-12-03 09:59',
|
||||
place: '第一食品资讯官方账号',
|
||||
news: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
padding: 12rpx 16rpx;
|
||||
}
|
||||
|
||||
.xw_title {
|
||||
font-size: 38rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #3E3E3E;
|
||||
line-height: 53rpx;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
|
||||
.xw_time {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #969696;
|
||||
line-height: 33rpx;
|
||||
margin-top: 6rpx;
|
||||
}
|
||||
|
||||
.xw_place {
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.xw_content {
|
||||
margin-top: 38rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -1,33 +1,192 @@
|
||||
<!-- 首页 -->
|
||||
<template>
|
||||
<view>
|
||||
<view class="input_block">
|
||||
<view class="input_block_border">
|
||||
<!-- 搜索框 -->
|
||||
<view class="search_box">
|
||||
<view class="search_box_border">
|
||||
<u-input placeholder="搜索优质产品" placeholder-style="color: #969696" prefixIcon="search"
|
||||
prefixIconStyle="font-size: 22px;color: #909399;margin-left:30rpx">
|
||||
</u-input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<!-- 分类模块 -->
|
||||
<view class="classify">
|
||||
<u-grid :border="false" col="5">
|
||||
<u-grid-item v-for="(listItem,listIndex) in classifyList" :key="listIndex"
|
||||
@click="click(listIndex)">
|
||||
<!-- 懒加载 :lazy-load="true" -->
|
||||
<u--image :src="listItem.src" width="86rpx" height="86rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<text class="grid-text">{{listItem.title}}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
<u-toast ref="uToast" />
|
||||
</view>
|
||||
<!-- 分类模块下的轮播图 -->
|
||||
<view>
|
||||
<u-swiper :list="swiperList" indicatorMode="line" radius="0" circular></u-swiper>
|
||||
</view>
|
||||
<!-- 选项卡: 上架时间和点赞量 -->
|
||||
<view>
|
||||
<u-tabs :list="tabList" lineColor="#15CA65" :is-scroll="false"
|
||||
activeStyle="color:#15CA65;font-weight: bold;">
|
||||
</u-tabs>
|
||||
</view>
|
||||
<!-- 产品 -->
|
||||
<view class="products_box">
|
||||
<u-grid :border="false" col="2">
|
||||
<u-grid-item v-for="(item,index) in productList" :key="index">
|
||||
<u-image src="/static/products/sy_bb.png" width="354rpx" height="539rpx" :lazy-load="true">
|
||||
</u-image>
|
||||
<view class="bgContent">
|
||||
<view>
|
||||
<u-image :src="item.src" width="346rpx" height="320rpx" :lazy-load="true"
|
||||
@click="toDetailPage()">
|
||||
</u-image>
|
||||
<view class="img_tag">{{item.img_tag}}</view>
|
||||
</view>
|
||||
<view style="padding: 16rpx;">
|
||||
<view class="title_box">
|
||||
<text class="title">{{item.title}}</text>
|
||||
<u-tag :text="item.tag" type="warning" shape="circle"></u-tag>
|
||||
</view>
|
||||
|
||||
<view class="product_desc">
|
||||
{{item.desc}}
|
||||
</view>
|
||||
<view class="releaseDate">
|
||||
<u-image src="/static/products/sy_icon_sjf.png" width="22rpx" height="22rpx"
|
||||
:lazy-load="true">
|
||||
</u-image>
|
||||
<text class="release">发布日期:</text>
|
||||
<text>{{item.time}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
classifyList: [{
|
||||
src: '/static/classify/sy_icon_hp.png',
|
||||
title: '烘培宝典'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_ls.png',
|
||||
title: '零食铺子'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_yp.png',
|
||||
title: '饮品大全'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_tw.png',
|
||||
title: '调味菜单'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_rs.png',
|
||||
title: '肉食荟萃'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_np.png',
|
||||
title: '乳品手册'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_gs.png',
|
||||
title: '果蔬地图'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_sj.png',
|
||||
title: '食界新贵'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_hz.png',
|
||||
title: '欢喜盒子'
|
||||
},
|
||||
{
|
||||
src: '/static/classify/sy_icon_cy.png',
|
||||
title: '创意工具'
|
||||
},
|
||||
],
|
||||
tabList: [{
|
||||
name: '上架时间'
|
||||
},
|
||||
{
|
||||
name: '点赞量'
|
||||
},
|
||||
],
|
||||
swiperList: [
|
||||
'/static/products/sy_bg.png',
|
||||
'https://cdn.uviewui.com/uview/swiper/swiper3.png'
|
||||
],
|
||||
productList: [{
|
||||
src: '/static/products/zhanwei_dg.png',
|
||||
title: '锅巴',
|
||||
tag: '无添加剂',
|
||||
img_tag: '零食铺子',
|
||||
desc: '糯米蟹黄锅巴散装,非油炸绿色健康食品',
|
||||
time: '2022-12-04'
|
||||
},
|
||||
{
|
||||
src: '/static/products/zhanwei_dg(2).png',
|
||||
title: '干吃汤圆',
|
||||
tag: '天然原料',
|
||||
img_tag: '糕点卷酥',
|
||||
desc: '休闲食品厂家甜品糯米食品零食闽南特产宵夜好吃糍粑',
|
||||
time: '2022-12-04'
|
||||
},
|
||||
{
|
||||
src: '/static/products/zhanwei_dg(1).png',
|
||||
title: '紫薯魔芋人参魔芋人参魔芋人参…',
|
||||
tag: '天然原料',
|
||||
img_tag: '健康创新',
|
||||
desc: '紫薯魔芋人参代餐粉 冲调饮品贴牌加工 五谷杂粮粉代餐',
|
||||
time: '2022-12-04'
|
||||
},
|
||||
{
|
||||
src: '/static/products/zhanwei_dg(3).png',
|
||||
title: '焦糖饼干',
|
||||
tag: '无防腐剂',
|
||||
img_tag: '饼干曲奇',
|
||||
desc: '比利时风味焦糖饼干代餐小吃零食品',
|
||||
time: '2022-12-04'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
//关闭下拉刷新
|
||||
uni.stopPullDownRefresh()
|
||||
},
|
||||
methods: {
|
||||
|
||||
//点击一级分类
|
||||
click(listIndex) {
|
||||
this.$refs.uToast.success(`点击了第${listIndex}个`)
|
||||
},
|
||||
//点击图片跳转到详情页
|
||||
toDetailPage() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/detail/productsDetail/productsDetail'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.input_block {
|
||||
// 搜索框样式
|
||||
.search_box {
|
||||
background: linear-gradient(135deg, #12CA64 0%, #1ACA67 100%);
|
||||
|
||||
.input_block_border {
|
||||
.search_box_border {
|
||||
width: 94.6%;
|
||||
height: 124rpx;
|
||||
background: linear-gradient(320deg, #36E182 0%, #26DD76 100%, #26DD76 100%);
|
||||
@@ -43,8 +202,154 @@
|
||||
height: 64rpx;
|
||||
border-radius: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.u-input__content__field-wrapper__field {
|
||||
font-size: 26rpx !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
|
||||
//分类模块
|
||||
.classify {
|
||||
height: 350rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
|
||||
box-shadow: 0px 2px 4px 0px rgba(206, 206, 206, 0.5);
|
||||
|
||||
.u-grid {
|
||||
padding-top: 30rpx;
|
||||
|
||||
.grid-text {
|
||||
padding-top: 8rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.u-grid-item {
|
||||
padding-bottom: 38rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//轮播图
|
||||
.u-swiper__wrapper__item__wrapper {
|
||||
margin-top: 20rpx;
|
||||
height: 290rpx;
|
||||
}
|
||||
|
||||
.u-swiper-indicator__wrapper {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
// 选项卡
|
||||
.u-tabs__wrapper__nav {
|
||||
background-color: #FFFFFF;
|
||||
|
||||
.u-tabs__wrapper__nav__item {
|
||||
padding: 0 !important;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.products_box {
|
||||
padding: 10rpx;
|
||||
|
||||
.u-grid-item {
|
||||
|
||||
.bgContent {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
||||
.u-image__image {
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.img_tag {
|
||||
position: absolute;
|
||||
padding: 2rpx 8rpx;
|
||||
right: 5px;
|
||||
top: 30rpx;
|
||||
border-radius: 54rpx 0px 0px 54rpx;
|
||||
box-shadow: 0px 2rpx 4rpx 0px #078C42;
|
||||
background: linear-gradient(135deg, #0DB658 0%, #16DD6D 100%);
|
||||
font-size: 20rpx;
|
||||
color: #FFFFFF;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
|
||||
|
||||
.title_box {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.title {
|
||||
width: 186rpx;
|
||||
font-size: 26rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #0EBB5B;
|
||||
line-height: 37rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.u-tag {
|
||||
height: 26rpx;
|
||||
line-height: 26rpx;
|
||||
background: linear-gradient(124deg, #FEAA19 0%, #FDCF3A 100%);
|
||||
|
||||
.u-tag__text {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.product_desc {
|
||||
font-size: 22rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #3E3E3E;
|
||||
line-height: 26rpx;
|
||||
margin-top: 24rpx;
|
||||
margin-bottom: 20rpx;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.releaseDate {
|
||||
font-size: 22rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A3A3A3;
|
||||
line-height: 26rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 25rpx;
|
||||
|
||||
image {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.release {
|
||||
padding: 0 10rpx 0 5rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,76 @@
|
||||
<!-- 个人中心 -->
|
||||
<template>
|
||||
<view class="components-theme">
|
||||
我的
|
||||
<view>
|
||||
<u-navbar :autoBack="false" title="我的"></u-navbar>
|
||||
<u--image src="/static/my/wo_icon_bj1.png" width="750rpx" height="349rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<view class="my_avatar">
|
||||
<view style="border: 1px solid #EEEEEE;border-radius: 50rpx;">
|
||||
<u--image :src="avatar" width="100rpx" height="100rpx" :lazy-load="true" shape="circle">
|
||||
</u--image>
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;margin-bottom: 4rpx;">
|
||||
<u--image v-if="show==false" :src="normal" width="84rpx" height="30rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<u--image v-else :src="VIP" width="84rpx" height="30rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
</view>
|
||||
<text>顾发航</text>
|
||||
</view>
|
||||
<view class="table">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
avatar: '/static/my/avatar.png',
|
||||
normal: '/static/my/wo_icon_pthy.png',
|
||||
VIP: '/static/my/wo_icon_vip.png'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.u-status-bar {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.u-navbar__content {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.u-navbar__content__title {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.u-icon__icon {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.my_avatar {
|
||||
position: absolute;
|
||||
right: 325rpx;
|
||||
top: 148rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
|
||||
text {
|
||||
font-size: 26rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
line-height: 37rpx;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
118
pages/news/news.vue
Normal file
@@ -0,0 +1,118 @@
|
||||
<template>
|
||||
<view style="margin-top: 20rpx; height: 1176rpx;background: #FFFFFF;">
|
||||
<view class="xw_content" v-for="(item,index) in newsList" :key="index" @click="clickNews(index)">
|
||||
<u--image :src="item.src" width="192rpx" height="122rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<view class="xw_right">
|
||||
<view class="xw_title">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view style="display: flex;">
|
||||
<text class="xw_time">
|
||||
{{item.time}}
|
||||
</text>
|
||||
<text class="xw_time xw_place">
|
||||
{{item.place}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="newsShow" class="no-data">已经到底啦!</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
newsShow: true,
|
||||
newsList: [{
|
||||
src: '/static/report/zhanwei_xf.png',
|
||||
title: '2022近50款食品饮料新品,创新的方向都在这里',
|
||||
time: '2022-12-03 09:59',
|
||||
place: '第一食品资讯官方账号'
|
||||
},
|
||||
{
|
||||
src: '/static/report/zhanwei_zh.png',
|
||||
title: '食品企业如何开发新产品?创新思维又发挥着怎样的效应呢?',
|
||||
time: '2022-10-18 14:43',
|
||||
place: '腾讯新闻 '
|
||||
},
|
||||
{
|
||||
src: '/static/report/zhanwei_zh.png',
|
||||
title: '食品企业如何开发新产品?创新思维又发挥着怎样的效应呢?',
|
||||
time: '2022-10-18 14:43',
|
||||
place: '腾讯新闻'
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 跳转到新闻详情页
|
||||
clickNews(index) {
|
||||
if (index == 0) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/detail/xwDetail/xwDetail'
|
||||
})
|
||||
}
|
||||
},
|
||||
// this.newsShow = this.list.length === 0 ? true : false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.no-data {
|
||||
text-align: center;
|
||||
margin-top: 29rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #BBBBBB;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
|
||||
.xw_content {
|
||||
background: #FFFFFF;
|
||||
border: 1rpx solid #EEEEEE;
|
||||
display: flex;
|
||||
padding: 29rpx 19rpx;
|
||||
|
||||
.xw_right {
|
||||
padding-left: 19rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.xw_title {
|
||||
font-size: 30rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #3E3E3E;
|
||||
line-height: 42rpx;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.xw_time {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #969696;
|
||||
line-height: 33rpx;
|
||||
padding-top: 3rpx;
|
||||
}
|
||||
|
||||
.xw_place {
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -1,5 +1,442 @@
|
||||
<template>
|
||||
<view style="padding-bottom: 50rpx;">
|
||||
<!-- classify -->
|
||||
<view class="classify">
|
||||
<u-grid :border="false" col="3">
|
||||
<u-grid-item v-for="(listItem,listIndex) in classifyList" :key="listIndex" @click="click(listIndex)">
|
||||
<!-- 懒加载 :lazy-load="true" -->
|
||||
<u--image :src="listItem.src" width="86rpx" height="86rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<text class="grid-text">{{listItem.title}}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
|
||||
<!-- 行业新闻 -->
|
||||
<view>
|
||||
行业报告
|
||||
<view class="subtitle">
|
||||
<u--image src="/static/report/hy_icon_xwx.png" width="24rpx" height="24rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<text class="xw_text text">行业新闻</text>
|
||||
</view>
|
||||
<view class="xw_content" v-for="(item,index) in newsList" :key="index" @click="clickNews(index)">
|
||||
<u--image :src="item.src" width="192rpx" height="122rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<view class="xw_right">
|
||||
<view class="xw_title">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view style="display: flex;">
|
||||
<text class="xw_time">
|
||||
{{item.time}}
|
||||
</text>
|
||||
<text class="xw_time xw_place">
|
||||
{{item.place}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 新品发布 -->
|
||||
<view>
|
||||
<view class="subtitle">
|
||||
<u--image src="/static/report/hy_icon_fux.png" width="24rpx" height="24rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<text class="xpfb_text text">新品发布</text>
|
||||
</view>
|
||||
<view class="products_box">
|
||||
<u-grid :border="false" col="2">
|
||||
<u-grid-item v-for="(item,index) in productList" :key="index">
|
||||
<u-image src="/static/products/sy_bb.png" width="354rpx" height="539rpx" :lazy-load="true">
|
||||
</u-image>
|
||||
<view class="bgContent">
|
||||
<view>
|
||||
<u-image :src="item.src" width="346rpx" height="320rpx" :lazy-load="true"
|
||||
@click="toDetailPage()">
|
||||
</u-image>
|
||||
<view class="img_tag">{{item.img_tag}}</view>
|
||||
</view>
|
||||
<view style="padding: 18rpx;">
|
||||
<view class="title_box">
|
||||
<text class="title">{{item.title}}</text>
|
||||
<u-tag :text="item.tag" type="warning" shape="circle"></u-tag>
|
||||
</view>
|
||||
|
||||
<view class="product_desc">
|
||||
{{item.desc}}
|
||||
</view>
|
||||
<view class="releaseDate">
|
||||
<u-image src="/static/products/sy_icon_sjf.png" width="22rpx" height="22rpx"
|
||||
:lazy-load="true">
|
||||
</u-image>
|
||||
<text class="release">发布日期:</text>
|
||||
<text>{{item.time}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 认证厂家 -->
|
||||
<view>
|
||||
<view class="subtitle">
|
||||
<u--image src="/static/report/hy_icon_cjx.png" width="24rpx" height="24rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<text class="rzcj_text text">认证厂家</text>
|
||||
</view>
|
||||
<view class="xw_content" v-for="(item,index) in cjsList" :key="index" @click="clickCj(index)">
|
||||
<u--image :src="item.src" width="112rpx" height="112rpx" :lazy-load="true">
|
||||
</u--image>
|
||||
<view class="xw_right">
|
||||
<view class="xw_title">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view style="display: flex;">
|
||||
<text class="cj_tags" v-for="(tagsItem,tagsIndex) in item.tags" :key="tagsIndex">
|
||||
{{tagsItem.tag}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
classifyList: [{
|
||||
src: '/static/report/hy_icon_xw.png',
|
||||
title: '行业新闻'
|
||||
},
|
||||
{
|
||||
src: '/static/report/hy_icon_fu.png',
|
||||
title: '新品发布'
|
||||
},
|
||||
{
|
||||
src: '/static/report/hy_icon_cj.png',
|
||||
title: '认证厂家'
|
||||
},
|
||||
],
|
||||
productList: [{
|
||||
src: '/static/products/zhanwei_dg.png',
|
||||
title: '锅巴',
|
||||
tag: '无添加剂',
|
||||
img_tag: '零食铺子',
|
||||
desc: '糯米蟹黄锅巴散装,非油炸绿色健康食品',
|
||||
time: '2022-12-04'
|
||||
},
|
||||
{
|
||||
src: '/static/products/zhanwei_dg(2).png',
|
||||
title: '干吃汤圆',
|
||||
tag: '天然原料',
|
||||
img_tag: '糕点卷酥',
|
||||
desc: '休闲食品厂家甜品糯米食品零食闽南特产宵夜好吃糍粑',
|
||||
time: '2022-12-04'
|
||||
},
|
||||
{
|
||||
src: '/static/products/zhanwei_dg(1).png',
|
||||
title: '紫薯魔芋人参魔芋人参魔芋人参…',
|
||||
tag: '天然原料',
|
||||
img_tag: '健康创新',
|
||||
desc: '紫薯魔芋人参代餐粉 冲调饮品贴牌加工 五谷杂粮粉代餐',
|
||||
time: '2022-12-04'
|
||||
},
|
||||
{
|
||||
src: '/static/products/zhanwei_dg(3).png',
|
||||
title: '焦糖饼干',
|
||||
tag: '无防腐剂',
|
||||
img_tag: '饼干曲奇',
|
||||
desc: '比利时风味焦糖饼干代餐小吃零食品',
|
||||
time: '2022-12-04'
|
||||
}
|
||||
],
|
||||
newsList: [{
|
||||
src: '/static/report/zhanwei_xf.png',
|
||||
title: '2022近50款食品饮料新品,创新的方向都在这里',
|
||||
time: '2022-12-03 09:59',
|
||||
place: '第一食品资讯官方账号'
|
||||
},
|
||||
{
|
||||
src: '/static/report/zhanwei_zh.png',
|
||||
title: '食品企业如何开发新产品?创新思维又发挥着怎样的效应呢?',
|
||||
time: '2022-10-18 14:43',
|
||||
place: '腾讯新闻 '
|
||||
},
|
||||
{
|
||||
src: '/static/report/zhanwei_zh.png',
|
||||
title: '食品企业如何开发新产品?创新思维又发挥着怎样的效应呢?',
|
||||
time: '2022-10-18 14:43',
|
||||
place: '腾讯新闻'
|
||||
},
|
||||
],
|
||||
cjsList: [
|
||||
|
||||
{
|
||||
src: '/static/report/zhanwei_xf(1).png',
|
||||
title: '西安兴沃丰餐饮管理有限责任公司',
|
||||
tags: [{
|
||||
tag: '咖啡'
|
||||
},
|
||||
{
|
||||
tag: '饮品'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
src: '/static/report/zhanwei_xf(2).png',
|
||||
title: '福建省海纳川食品有限公司',
|
||||
tags: [{
|
||||
tag: '活冻鲍鱼'
|
||||
},
|
||||
{
|
||||
tag: '鲍鱼罐头'
|
||||
},
|
||||
{
|
||||
tag: '佛跳墙'
|
||||
},
|
||||
{
|
||||
tag: '海螺片'
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//点击一级分类
|
||||
click(listIndex) {
|
||||
//点击行内新闻时
|
||||
if (listIndex == 0) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/news/news'
|
||||
})
|
||||
} else if (listIndex == 2) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/certifiedCj/certifiedCj'
|
||||
})
|
||||
}
|
||||
},
|
||||
// 跳转到新闻详情页
|
||||
clickNews(index) {
|
||||
if (index == 0) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/detail/xwDetail/xwDetail'
|
||||
})
|
||||
}
|
||||
},
|
||||
//点击图片跳转到详情页
|
||||
toDetailPage() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/detail/productsDetail/productsDetail'
|
||||
})
|
||||
},
|
||||
// 跳转到认证厂家详情页
|
||||
clickCj(index) {
|
||||
if (index == 0) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/detail/certifiedCjDetail/certifiedCjDetail'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
//分类模块
|
||||
.classify {
|
||||
background: #FFFFFF;
|
||||
border-radius: 0 0 24rpx 24rpx;
|
||||
box-shadow: 0px 2px 4px 0px rgba(206, 206, 206, 0.5);
|
||||
padding-bottom: 30rpx;
|
||||
margin: 0 16rpx;
|
||||
|
||||
.u-grid {
|
||||
padding-top: 22rpx;
|
||||
|
||||
.grid-text {
|
||||
padding-top: 8rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
margin: 24rpx 0 16rpx 16rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.text {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
line-height: 40rpx;
|
||||
padding-left: 4rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.xw_text {
|
||||
color: #5ACCF0;
|
||||
}
|
||||
|
||||
|
||||
.xw_content {
|
||||
background: #FFFFFF;
|
||||
border: 1rpx solid #EEEEEE;
|
||||
display: flex;
|
||||
padding: 29rpx 19rpx;
|
||||
|
||||
.xw_right {
|
||||
padding-left: 19rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.xw_title {
|
||||
font-size: 30rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #3E3E3E;
|
||||
line-height: 42rpx;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.xw_time {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #969696;
|
||||
line-height: 33rpx;
|
||||
|
||||
}
|
||||
|
||||
.xw_place {
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.cj_tags {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #969696;
|
||||
line-height: 33rpx;
|
||||
padding-right: 10rpx;
|
||||
margin-top: 35rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.xpfb_text {
|
||||
color: #FCAC18;
|
||||
}
|
||||
|
||||
.rzcj_text {
|
||||
color: #78E13A;
|
||||
}
|
||||
|
||||
.products_box {
|
||||
padding: 10rpx;
|
||||
|
||||
.u-grid-item {
|
||||
|
||||
.bgContent {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
||||
.u-image__image {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.img_tag {
|
||||
position: absolute;
|
||||
padding: 2rpx 8rpx;
|
||||
right: 5px;
|
||||
top: 30rpx;
|
||||
border-radius: 54rpx 0px 0px 54rpx;
|
||||
box-shadow: 0px 2rpx 4rpx 0px #078C42;
|
||||
background: linear-gradient(135deg, #0DB658 0%, #16DD6D 100%);
|
||||
font-size: 20rpx;
|
||||
color: #FFFFFF;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
|
||||
|
||||
.title_box {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.title {
|
||||
width: 186rpx;
|
||||
font-size: 26rpx;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #0EBB5B;
|
||||
line-height: 37rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.u-tag {
|
||||
height: 26rpx;
|
||||
line-height: 26rpx;
|
||||
background: linear-gradient(124deg, #FEAA19 0%, #FDCF3A 100%);
|
||||
|
||||
.u-tag__text {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.product_desc {
|
||||
font-size: 22rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #3E3E3E;
|
||||
line-height: 26rpx;
|
||||
margin-top: 24rpx;
|
||||
margin-bottom: 20rpx;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.releaseDate {
|
||||
font-size: 22rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A3A3A3;
|
||||
line-height: 26rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 25rpx;
|
||||
|
||||
image {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.release {
|
||||
padding: 0 10rpx 0 5rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
BIN
static/classify/sy_icon_cy.png
Normal file
|
After Width: | Height: | Size: 5.5 KiB |
BIN
static/classify/sy_icon_gs.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
static/classify/sy_icon_hp.png
Normal file
|
After Width: | Height: | Size: 6.3 KiB |
BIN
static/classify/sy_icon_hz.png
Normal file
|
After Width: | Height: | Size: 5.9 KiB |
BIN
static/classify/sy_icon_ls.png
Normal file
|
After Width: | Height: | Size: 6.0 KiB |
BIN
static/classify/sy_icon_np.png
Normal file
|
After Width: | Height: | Size: 6.6 KiB |
BIN
static/classify/sy_icon_rs.png
Normal file
|
After Width: | Height: | Size: 5.8 KiB |
BIN
static/classify/sy_icon_sj.png
Normal file
|
After Width: | Height: | Size: 7.2 KiB |
BIN
static/classify/sy_icon_tw.png
Normal file
|
After Width: | Height: | Size: 5.9 KiB |
BIN
static/classify/sy_icon_yp.png
Normal file
|
After Width: | Height: | Size: 6.0 KiB |
BIN
static/detail/cj_bg.png
Normal file
|
After Width: | Height: | Size: 127 KiB |
BIN
static/detail/xiangqing_icon_shoucang.png
Normal file
|
After Width: | Height: | Size: 4.4 KiB |
BIN
static/detail/xp_icon_ysc.png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
static/detail/zhanwei_xppx.png
Normal file
|
After Width: | Height: | Size: 694 KiB |
BIN
static/my/avatar.png
Normal file
|
After Width: | Height: | Size: 92 KiB |
BIN
static/my/wo_icon_bj1.png
Normal file
|
After Width: | Height: | Size: 90 KiB |
BIN
static/my/wo_icon_pthy.png
Normal file
|
After Width: | Height: | Size: 3.7 KiB |
BIN
static/my/wo_icon_vip.png
Normal file
|
After Width: | Height: | Size: 3.0 KiB |
BIN
static/products/sy_bb(1).png
Normal file
|
After Width: | Height: | Size: 8.5 KiB |
BIN
static/products/sy_bb.png
Normal file
|
After Width: | Height: | Size: 8.5 KiB |
BIN
static/products/sy_bg.png
Normal file
|
After Width: | Height: | Size: 134 KiB |
BIN
static/products/sy_icon_sjf.png
Normal file
|
After Width: | Height: | Size: 640 B |
BIN
static/products/zhanwei_dg(1).png
Normal file
|
After Width: | Height: | Size: 154 KiB |
BIN
static/products/zhanwei_dg(2).png
Normal file
|
After Width: | Height: | Size: 122 KiB |
BIN
static/products/zhanwei_dg(3).png
Normal file
|
After Width: | Height: | Size: 248 KiB |
BIN
static/products/zhanwei_dg.png
Normal file
|
After Width: | Height: | Size: 271 KiB |
BIN
static/report/hy_icon_cj.png
Normal file
|
After Width: | Height: | Size: 6.0 KiB |
BIN
static/report/hy_icon_cjx.png
Normal file
|
After Width: | Height: | Size: 847 B |
BIN
static/report/hy_icon_fu.png
Normal file
|
After Width: | Height: | Size: 5.8 KiB |
BIN
static/report/hy_icon_fux.png
Normal file
|
After Width: | Height: | Size: 764 B |
BIN
static/report/hy_icon_xw.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
static/report/hy_icon_xwx.png
Normal file
|
After Width: | Height: | Size: 478 B |
BIN
static/report/zhanwei_xf(1).png
Normal file
|
After Width: | Height: | Size: 26 KiB |
BIN
static/report/zhanwei_xf(2).png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
static/report/zhanwei_xf.png
Normal file
|
After Width: | Height: | Size: 57 KiB |
BIN
static/report/zhanwei_zh.png
Normal file
|
After Width: | Height: | Size: 59 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 5.5 KiB |
|
Before Width: | Height: | Size: 848 B |
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 5.7 KiB |
|
Before Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 3.9 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 3.0 KiB |