74 lines
3.1 KiB
HTML
74 lines
3.1 KiB
HTML
{{template "header" }}
|
||
<style>
|
||
body{background: #fff;}
|
||
.el-descriptions{
|
||
margin: 10px 0px;
|
||
}
|
||
</style>
|
||
<div id="app" style="width:100%">
|
||
<el-descriptions direction="vertical" :column="4" border v-for="item in order_list">
|
||
<el-descriptions-item label="商品" :span="3"><{item.商品}></el-descriptions-item>
|
||
<el-descriptions-item ><el-button @click="postMessage(item)">发送</el-button></el-descriptions-item>
|
||
<el-descriptions-item label="用户名" :span="2"><{item.用户名}></el-descriptions-item>
|
||
<el-descriptions-item label="手机号" :span="2"><{item.手机}></el-descriptions-item>
|
||
<el-descriptions-item label="联系地址"><{item.联系地址}></el-descriptions-item>
|
||
</el-descriptions>
|
||
|
||
</div>
|
||
</body>
|
||
</html>
|
||
<script>
|
||
new Vue({
|
||
el: '#app',
|
||
delimiters:["<{","}>"],
|
||
data: {
|
||
order_list:[
|
||
{
|
||
用户名:"kooriookami",
|
||
手机:"18100000000",
|
||
联系地址:"江苏省苏州市吴中区吴中大道 1188 号",
|
||
商品:"REVAN芮范2024夏季新品设计师款度假风牛仔印花两件套RM32401305",
|
||
url:"http://www.baidu.com",
|
||
img:"https://tse2-mm.cn.bing.net/th/id/OIP-C.NgP62UVQDAui3hJ3j5c7nwHaHa?rs=1&pid=ImgDetMain",
|
||
price:"100"
|
||
},
|
||
{
|
||
用户名:"kooriookami",
|
||
手机:"18100000000",
|
||
联系地址:"江苏省苏州市吴中区吴中大道 1188 号",
|
||
商品:"REVAN芮范2024夏季新品设计师款度假风牛仔印花两件套RM32401305",
|
||
url:"http://www.baidu.com",
|
||
img:"https://tse2-mm.cn.bing.net/th/id/OIP-C.NgP62UVQDAui3hJ3j5c7nwHaHa?rs=1&pid=ImgDetMain",
|
||
price:"100"
|
||
},
|
||
{
|
||
用户名:"kooriookami",
|
||
手机:"18100000000",
|
||
联系地址:"江苏省苏州市吴中区吴中大道 1188 号",
|
||
商品:"REVAN芮范2024夏季新品设计师款度假风牛仔印花两件套RM32401305",
|
||
url:"http://www.baidu.com",
|
||
img:"https://tse2-mm.cn.bing.net/th/id/OIP-C.NgP62UVQDAui3hJ3j5c7nwHaHa?rs=1&pid=ImgDetMain",
|
||
price:"100"
|
||
},
|
||
]
|
||
},
|
||
methods: {
|
||
getOrders(){
|
||
//通过GET参数获取到 访客ID,企业ID,客服账号。通过这些信息与自己系统内的订单接口对接
|
||
let visitorId=getQuery("visitor_id");
|
||
let entId=getQuery("ent_id");
|
||
let kefuName=getQuery("kefu_name");
|
||
console.log(visitorId,entId,kefuName);
|
||
},
|
||
postMessage(item){
|
||
// 发送消息到父窗口
|
||
window.parent.postMessage({type: 'FROM_IFRAME1', data: item}, '*');
|
||
}
|
||
},
|
||
mounted:function(){
|
||
},
|
||
created: function () {
|
||
this.getOrders();
|
||
}
|
||
})
|
||
</script> |