Initial commit,修正

This commit is contained in:
2025-07-13 19:37:38 +08:00
parent 38ce288e27
commit 65bbd06981
12384 changed files with 3985464 additions and 8 deletions
+13
View File
@@ -0,0 +1,13 @@
/*
* @Author: fm453
* @Date: 2021-03-28 22:28:13
* @Last Modified by: fm453
* @Last Modified time: 2021-03-29 22:24:33
*/
p{
font-size: 1.2em;
}
.mui-bar-popover {
width: 30%;
}
+119
View File
@@ -0,0 +1,119 @@
<!DOCTYPE html>
<html>
<head>
<script src="../../vue/js/v2.6.10/vue.min.js" type="text/javascript" charset="utf-8"></script>
<meta charset="utf-8">
<title id="title">汽车托运管理系统</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="shortcut icon" href="../../static/favicon.ico">
<!--标准mui.css-->
<link rel="stylesheet" href="../../mui/css/mui.min.css">
<link rel="stylesheet" type="text/css" href="../../mui/css/icons-extra.css">
<!--App自定义的css-->
<!-- <link rel="stylesheet" type="text/css" href="../../mui/css/app.css"> -->
<!--页面内定义的css-->
<link rel="stylesheet" href="detail.css">
</head>
<body>
<section id="app">
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title" id="pagename">{{Page.title}}</h1>
</header>
<nav class="mui-bar mui-bar-tab ">
<a class="mui-tab-item" href="#Popover_0"><i class="mui-icon mui-icon-list"></i> 发车方</a>
<a class="mui-tab-item" href="#Popover_1"><i class="mui-icon mui-icon-list"></i> 接车方</a>
<a class="mui-tab-item" href="#Popover_2"><i class="mui-icon mui-icon-list"></i> 其他</a>
</nav>
<div class="mui-content">
<div class="mui-card">
<div class="mui-card-header ">
[{{oid}}]<h4>{{order.car_number}}</h4>
<h5 class="mui-pullright">{{order.car_title}}</h5>
</div>
<div class="mui-card-content mui-content-padded" >
<p> 运单号:{{order.sn}}</p>
<p> 日期:{{order.signdate}}</p>
<p>起运地:{{order.from_province}}-{{order.start_city}} => 目的地:{{order.to_province}}-{{order.aim_city}}</p>
<p> 随车物品:{{order.car_extra}}</p>
</div>
</div>
<div class="mui-card">
<div class="mui-card-header ">
<h4 class="mui-pullright">联系信息</h4>
</div>
<div class="mui-card-content mui-content-padded" >
<p> 发车人:{{order.sender_name}} <em> {{order.sender_mobiles}} </em></p>
<p> 接车人:{{order.receiver_name}}<em>{{order.receiver_mobiles}}</em></p>
<p>送车地址:{{order.aim_address}}</p>
</div>
</div>
<div class="mui-card">
<div class="mui-card-header ">
<h4 class="mui-pullright">费用信息</h4>
</div>
<div class="mui-card-content mui-content-padded" >
<p> 总运费:{{order.fee_total}} 元</p>
<p> 现付:<span class="red">{{order.pay_send}} </span>元</p>
<p> 到付:<span class="red">{{order.pay_receive}}</span> 元</p>
</div>
</div>
<!-- <div class="mui-card">
<div class="mui-card-header mui-card-media">
<div class="mui-card-media-body">
<p class="mui-ellipsis">验车照片</p>
</div>
</div>
<div class="mui-card-content mui-card-media" style="height:40vw;background-image:url('')">
<img :src="order.thumb_b">
</div>
</div> -->
<div class="mui-card">
<div class="mui-card-header ">
<h4 class="mui-pullright">关联信息</h4>
</div>
<div class="mui-card-content mui-content-padded" >
<p> 经办人:{{order.employee_title}} </p>
<p> 验车人:{{order.checker}} </p>
<p> 委托人:{{order.wtdw}}</p>
</div>
</div>
</div>
<div class="mui-content-padded mui-hidden" id="PrintError"></div>
<div id="Popover_0" class="mui-popover mui-bar-popover">
<div class="mui-popover-arrow"></div>
<ul class="mui-table-view">
<li class="mui-table-view-cell"><a :href="'tel:'+ order.sender_mobiles ">电话</a>
</li>
</ul>
</div>
<div id="Popover_1" class="mui-popover mui-bar-popover">
<div class="mui-popover-arrow"></div>
<ul class="mui-table-view">
<li class="mui-table-view-cell"><a :href="'tel:'+ order.receiver_mobiles ">电话</a>
</li>
</ul>
</div>
<div id="Popover_2" class="mui-popover mui-bar-popover">
<div class="mui-popover-arrow"></div>
<ul class="mui-table-view">
<li class="mui-table-view-cell"><a :href="'remark.html?oid=' + order.id ">详情备注</a>
</li>
</ul>
</div>
</section>
</body>
</html>
<script src="../../mui/js/mui.js"></script>
<script src="../../app.js" type="text/javascript" charset="utf-8"></script>
<script src="detail.js" type="text/javascript" charset="utf-8"></script>
+121
View File
@@ -0,0 +1,121 @@
/**
* @Author: 嗨噜客科技(www.hiluker.cn) <fm453>
* @Date: 2021-09-30T01:47:50+08:00
* @Email: fm453@hiluker.com
* @Last modified by: fm453
* @Last modified time: 2021-09-30T01:50:53+08:00
*/
//用户检测
// const User = checkUser();
/*————————vue预定义————————*/
var vm = new Vue({
el: '#app', //该ID元素必须被包含于body以内
data: {
ctms: params.ctms,
version: params.version,
Company: params.Company,
Page: {
title: '轿运物流信息系统',
menus: menus
},
oid: 0,
order: {
id: 1,
car_id: 1,
car_number: '车牌号',
car_title: '车型号',
start_city: "起运城市",
from_province: '起运省份',
aim_city: "目的城市",
to_province: '目标省份',
signdate: '下单日期',
car_extra: '随车物品',
checker: '验车人',
receiver_name: '收车人姓名',
receiver_mobiles: '收车人电话',
sender_name: '发车人姓名',
sender_mobiles: '发车人电话',
},
},
methods: {
//
},
created: function(o) { //实例创建完成时
console.log(o)
},
mounted: function(o) { //页面初始化方法
console.log(o)
this.oid = getUriQueryVariable('oid');
},
destroyed: function(o) { //实例销毁方法
console.log(o)
},
});
/*————————MUI操作————————*/
mui.init({
swipeBack: true, //启用右滑关闭功能
});
/*————————其他事件响应——————————*/
function openUrl(url, title) {
mui.openWindow({
url: url,
id: encodeURI(url),
styles: { // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置
}
});
}
//取运单信息
function getOrderDetail() {
var url = apis.domain + apis.OrderDetail;
var data = {
pid: apis.pid,
oid: vm.oid
};
mui.ajax(url, {
data: data,
dataType: 'json', //服务器返回json格式数据
type: 'post', //HTTP请求类型
timeout: 10000, //超时时间设置为10秒;
// crossDomain:true, //跨域
// headers:{'Content-Type':'application/json'},
success: function(res) {
switch (res.code) {
case 200:
//将查询结果缓存在本地
localStorage.setItem('orderDetail-' + vm.oid, JSON.stringify(res.data));
//显示数据
vm.order = res.data;
document.getElementById('pagename').innerText = res.data.car_title + '-' + res.data
.car_number;
document.title = res.data.car_title + '-' + res.data.car_number + '|' + res.data
.start_city + '=>' + res.data.aim_city;
break;
case 400:
default:
// document.getElementById('pagename').innerText = '未查询到结果!';
break;
}
},
error: function(xhr, type, errorThrown) {
console.log(type);
document.getElementById('pagename').innerText = '查询失败!';
document.getElementById('PrintError').innerText =
'您好,信息查询失败。如果可以,请您将此页截屏发送给我们(微信: sanyabaike ),以帮助我们找到问题并改进,感谢您的支持!' + errorThrown;
let classAtr = document.getElementById("PrintError").getAttribute("class");
let newClass = classAtr.replace("mui-hidden", "");
document.getElementById("PrintError").setAttribute("class", newClass);
}
});
return false;
}
mui.ready(function() {
mui.toast('数据加载中……');
getOrderDetail();
});
+6
View File
@@ -0,0 +1,6 @@
/*
* @Author: fm453
* @Date: 2021-03-28 22:26:35
* @Last Modified by: fm453
* @Last Modified time: 2021-03-28 22:28:07
*/
+143
View File
@@ -0,0 +1,143 @@
<!DOCTYPE html>
<html>
<head>
<script src="../../vue/js/v2.6.10/vue.min.js" type="text/javascript" charset="utf-8"></script>
<meta charset="utf-8">
<title id="title">汽车托运管理系统</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="pragma" content="no-cache">
<link rel="shortcut icon" href="../../static/favicon.ico">
<!--标准mui.css-->
<link rel="stylesheet" href="../../mui/css/mui.min.css">
<link rel="stylesheet" type="text/css" href="../../mui/css/icons-extra.css">
<!--App自定义的css-->
<link rel="stylesheet" type="text/css" href="../../mui/css/app.css">
<!--页面内定义的css-->
<link rel="stylesheet" href="index.css">
</head>
<body>
<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable mui-scalable">
<!--侧滑菜单部分-->
<aside id="offCanvasSide" class="mui-off-canvas-left mui-slide-in">
<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
<div class="mui-scroll">
<div class="title">{{ctms}}</div>
<div class="content">
本系统由{{Company.name}}开发推出,为您提供轿运物流订单信息管理等实用功能。
<span class="android-only">-Android Phone-
</span>
<p style="margin: 10px 15px;">
<button id="offCanvasHide" type="button" class="mui-btn mui-btn-danger mui-btn-block"
style="padding: 5px 20px;">关闭边栏</button>
</p>
</div>
<div class="title" style="margin-bottom: 25px;">功能列表</div>
<ul class="mui-table-view mui-table-view-chevron mui-table-view-inverted">
<li class="mui-table-view-cell" v-for="menu in Page.menus">
<a class="mui-navigate-right" :href="'../' + menu.link">
{{menu.title}}
</a>
</li>
</ul>
<div class="title"></div>
<div class="content">
Powered by {{Company.title}} {{version}}
</div>
</div>
</div>
</aside>
<!--主界面部分-->
<div class="mui-inner-wrap">
<header class="mui-bar mui-bar-nav">
<a href="#offCanvasSide" class="mui-icon mui-action-menu mui-icon-bars mui-pull-left"></a>
<h1 class="mui-title" id="pagename">{{Page.title}}</h1>
</header>
<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<div class="mui-content-padded">
<p style="padding: 5px 20px;margin-bottom: 5px;">
<button type="button" class="mui-btn mui-btn-success mui-btn-block"
style="padding: 10px;">
订单查询
</button>
</p>
</div>
<form class="mui-input-group" style="margin-bottom: 15px;" id="order-form">
<div class="mui-input-row">
<label>车牌号</label>
<input type="text" class="mui-input-clear" placeholder="如 LB163 ,无需号牌前缀"
v-model="search.carno" name="carno">
</div>
<div class="mui-input-row">
<label>手机号</label>
<input type="text" class="mui-input-clear" placeholder="可使用接车人/发车人手机号"
v-model="search.phone" name="phone">
</div>
<div class="mui-input-row">
<label>目的地</label>
<input type="text" class="mui-input-clear" placeholder="仅支持城市名称" v-model="search.city"
name="city">
</div>
<div class="mui-button-row" style="height:120px;">
<button type="button" class="mui-btn mui-btn-primary"
style="width:80px;height:80px;border-radius: 50%;margin-top: 20px;font-size:18px;"
onclick="checkOrder('order-form');" id="submit">查询</button>
</div>
</form>
<div class="mui-content" id="PrintError"></div>
<div class="mui-content-padded">
<p style="padding: 5px 20px;margin-bottom: 5px;">
<button type="button" class="mui-btn mui-btn-primary mui-btn-block"
style="padding: 10px;">
使用说明
</button>
</p>
<div id="infoHelp">
<h3>订单查询目前支持:</h3>
<p>(1)通过发车人/接车人手机号+车牌号(仅输入尾数串)/车架号(后5位数字),如"<span class="orange">琼B</span> <span
class="red">LB163</span>",仅输入'<span class="red">LB163</span>'即可进行查询。</p>
<p>(2)批量查询某同一目的地的运单。</p>
<h3>关于界面操作:</h3>
<p>本界面支持页面左右拖动手势、页面内容上下滑动;</p>
<p>您可通过以下方式打开侧滑边栏,查看更多功能链接:
<ol style="color:#555;">
<li>在当前页面向右拖动;</li>
<li>点击页面左上角<span class="mui-icon mui-icon-bars"></span> 图标;</li>
<li>点击左下角的主页按钮;</li>
</ol>
</p>
</div>
</div>
</div>
</div>
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item" href="../../index.html">
⇤ 首页
</a>
<span class="mui-tab-item mui-active" href="#" id="offCanvasShow">
<span class="mui-icon mui-icon-bars">
</span>
<span class="mui-tab-label">功能</span>
</span>
<span class="mui-tab-item" href="#" id="alertBtnHelp">
<span class="mui-icon mui-icon-extra mui-icon-extra-lamp">
</span>
<span class="mui-tab-label">帮助</span>
</span>
</nav>
<!-- off-canvas backdrop -->
<div class="mui-off-canvas-backdrop"></div>
</div>
</div>
<script src="../../mui/js/mui.js"></script>
</body>
</html>
<script src="../../app.js" type="text/javascript" charset="utf-8"></script>
<script src="index.js" type="text/javascript" charset="utf-8"></script>
+170
View File
@@ -0,0 +1,170 @@
//用户检测
const User = checkUser();
/*————————vue预定义————————*/
var vm = new Vue({
el: '#offCanvasWrapper', //该ID元素必须被包含于body以内
data: {
ctms: params.ctms,
version: params.version,
Company:params.Company,
Page:{
title:'运单查询',
menus: menus
},
search:{
carno:'',
phone:'',
city:''
}
},
methods:{
TestFunc(){
console.log('测试下添加个自定义函数方法')
}
},
created:function(o){ //实例创建完成时
// console.log(o)
},
mounted:function(o){ //页面初始化方法
// console.log(o)
},
destroyed:function(o){ //实例销毁方法
console.log(o)
}
});
/*————————MUI操作————————*/
mui.init();
//侧滑容器父节点
var offCanvasWrapper = mui('#offCanvasWrapper');
//主界面容器
var offCanvasInner = offCanvasWrapper[0].querySelector('.mui-inner-wrap');
//菜单容器
var offCanvasSide = document.getElementById("offCanvasSide");
if (!mui.os.android) {
var spans = document.querySelectorAll('.android-only');
for (var i = 0, len = spans.length; i < len; i++) {
spans[i].style.display = "none";
}
}
//移动效果是否为整体移动
var moveTogether = false;
//主界面‘显示侧滑菜单’按钮的点击事件
document.getElementById('offCanvasShow').addEventListener('tap', function() {
offCanvasWrapper.offCanvas('show');
});
//菜单界面,‘关闭侧滑菜单’按钮的点击事件
document.getElementById('offCanvasHide').addEventListener('tap', function() {
offCanvasWrapper.offCanvas('close');
});
//主界面和侧滑菜单界面均支持区域滚动;
mui('#offCanvasSideScroll').scroll();
mui('#offCanvasContentScroll').scroll();
//实现ios平台原生侧滑关闭页面;
if (mui.os.plus && mui.os.ios) {
mui.plusReady(function() { //5+ iOS暂时无法屏蔽popGesture时传递touch事件,故该demo直接屏蔽popGesture功能
plus.webview.currentWebview().setStyle({
'popGesture': 'none'
});
});
}
document.getElementById("alertBtnHelp").addEventListener('tap', function() {
mui.toast('感谢使用,请查看页面中的使用说明');
});
/*————————其他事件响应——————————*/
function checkOrder(formid){
var form = document.getElementById(formid);
var url = apis.domain+apis.OrderSearch;
var data = vm.search;
mui.post(url,{search:data,pid:apis.pid},function(res){
console.log(res);
if(res){
switch(res.code){
case 200 :
//将查询结果缓存在本地
var orders = res.data.data.orders;
var o = JSON.stringify(orders);
console.log(o);
localStorage.setItem('OrderList',o);
//跳转到列表页
mui.openWindow({
url:'list.html',
id:'OrderList',
styles:{
top:44, //新页面顶部位置
bottom:0, //新页面底部位置
width:'100%', //新页面宽度,默认为100%
height:'100%' //新页面高度,默认为100%
},
extras:{
orders:res.data.data.orders ,//自定义扩展参数,可以用来处理页面间传值
},
createNew:false,//是否重复创建同样id的webview,默认为false:不重复创建,直接显示
show:{
autoShow:true,//页面loaded事件发生后自动显示,默认为true
aniShow:'slide-in-right',//页面显示动画,默认为”slide-in-right“;
duration:200//页面动画持续时间,Android平台默认100毫秒,iOS平台默认200毫秒;
},
waiting:{
autoShow:true,//自动显示等待框,默认为true
title:'正在加载...',//等待对话框上显示的提示内容
options:{
width:'100%',//等待框背景区域宽度,默认根据内容自动计算合适宽度
height:'100%',//等待框背景区域高度,默认根据内容自动计算合适高度
}
}
});
break;
case 400:
default:
document.getElementById('pagename').innerText = '未查询到结果!';
break;
}
}else{
document.getElementById('pagename').innerText = '查询失败!';
document.getElementById('PrintError').innerText = '您好,系统查询失败。如果可以,请您将此页截屏发送给我们(微信: sanyabaike ),以帮助我们找到问题并改进,感谢您的支持!' + res ;
let classAtr = document.getElementById("PrintError").getAttribute("class");
let newClass = classAtr.replace("mui-hidden","");
document.getElementById("PrintError").setAttribute("class",newClass);
}
},'json');
return false;
}
function openUrl(url,title){
mui.openWindow({
url: url,
id: encodeURI(url),
styles: { // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置
// titleNView: { // 窗口的标题栏控件
// titleText:"", // 标题栏文字,当不设置此属性时,默认加载当前页面的标题,并自动更新页面的标题
// titleColor:"#000000", // 字体颜色,颜色值格式为"#RRGGBB",默认值为"#000000"
// titleSize:"17px", // 字体大小,默认17px
// backgroundColor:"#F7F7F7", // 控件背景颜色,颜色值格式为"#RRGGBB",默认值为"#F7F7F7"
// progress:{ // 标题栏控件的进度条样式
// color:"#00FF00", // 进度条颜色,默认值为"#00FF00"
// height:"2px" // 进度条高度,默认值为"2px"
// },
// splitLine:{ // 标题栏控件的底部分割线,类似borderBottom
// color:"#CCCCCC", // 分割线颜色,默认值为"#CCCCCC"
// height:"1px" // 分割线高度,默认值为"2px"
// }
// }
}
});
}
mui('body').on("tap",'a',function(e){
console.log(e.target);
var url = e.target.href;
var title = e.target.innerHTML;
console.log(url);
console.log(title);
openUrl(url,title);
});
+6
View File
@@ -0,0 +1,6 @@
/*
* @Author: fm453
* @Date: 2021-03-28 22:26:39
* @Last Modified by: fm453
* @Last Modified time: 2021-03-29 22:24:07
*/
+86
View File
@@ -0,0 +1,86 @@
<!DOCTYPE html>
<html>
<head>
<script src="../../vue/js/v2.6.10/vue.min.js" type="text/javascript" charset="utf-8"></script>
<meta charset="utf-8">
<title id="title">汽车托运管理系统</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="pragma" content="no-cache">
<link rel="shortcut icon" href="../../static/favicon.ico">
<!--标准mui.css-->
<link rel="stylesheet" href="../../mui/css/mui.min.css">
<!--App自定义的css-->
<link rel="stylesheet" type="text/css" href="../../mui/css/app.css">
<!--页面内定义的css-->
<link rel="stylesheet" href="list.css">
</head>
<body>
<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable mui-scalable">
<!--侧滑菜单部分-->
<aside id="offCanvasSide" class="mui-off-canvas-left mui-slide-in">
<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
<div class="mui-scroll">
<div class="title">{{ctms}}</div>
<div class="content">
本系统由{{Company.name}}开发推出,为您提供轿运物流订单信息管理等实用功能。
<span class="android-only">-Android Phone-
</span>
<p style="margin: 10px 15px;">
<button id="offCanvasHide" type="button" class="mui-btn mui-btn-danger mui-btn-block" style="padding: 5px 20px;">关闭边栏</button>
</p>
</div>
<div class="title" style="margin-bottom: 25px;">功能列表</div>
<ul class="mui-table-view mui-table-view-chevron mui-table-view-inverted">
<li class="mui-table-view-cell" v-for="menu in Page.menus">
<a class="mui-navigate-right" :href="'../' + menu.link">
{{menu.title}}
</a>
</li>
</ul>
<div class="title"></div>
<div class="content">
Powered by {{Company.title}} {{version}}
</div>
</div>
</div>
</aside>
<!--主界面部分-->
<div class="mui-inner-wrap">
<header class="mui-bar mui-bar-nav">
<a href="#offCanvasSide" class="mui-icon mui-action-menu mui-icon-bars mui-pull-left"></a>
<h1 class="mui-title" id="pagename">{{Page.title}}</h1>
</header>
<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<div class="mui-card" v-for="order in orders" :data-oid="order.id" :data-carid="order.car_id">
<div class="mui-card-header ">
<h3>{{order.car_number}}</h3>
<h4 class="mui-pullright">{{order.car_title}}</h4>
</div>
<div class="mui-card-content" >
<p> 日期:{{order.signdate}}</p>
<p>起运地:{{order.start_city}} => 目的地:{{order.aim_city}}</p>
</div>
<div class="mui-card-footer">
<a class="mui-card-link" :href="'detail.html?oid=' + order.id +''">在途跟踪</a>
<a class="mui-card-link" :href="'detail.html?oid=' + order.id +''">运单信息</a>
</div>
</div>
</div>
</div>
<!-- off-canvas backdrop -->
<div class="mui-off-canvas-backdrop"></div>
</div>
</div>
<script src="../../mui/js/mui.js"></script>
</body>
</html>
<script src="../../app.js" type="text/javascript" charset="utf-8"></script>
<script src="list.js" type="text/javascript" charset="utf-8"></script>
+104
View File
@@ -0,0 +1,104 @@
//用户检测
const User = checkUser();
/*————————vue预定义————————*/
var vm = new Vue({
el: '#offCanvasWrapper', //该ID元素必须被包含于body以内
data: {
ctms: params.ctms,
version: params.version,
Company:params.Company,
Page:{
title:'运单列表',
menus: menus
},
orders:{
0:{
id:1,
car_id:1,
car_number:'车牌号',
car_title:'车型号',
start_city:"起运城市",
from_province:'起运省份',
aim_city:"目的城市",
to_province:'目标省份',
signdate:'下单日期',
car_extra:'随车物品',
checker:'验车人',
receiver_name:'收车人姓名',
receiver_mobiles:'收车人电话',
sender_name:'发车人姓名',
sender_mobiles:'发车人电话',
},
},
total:0,
pager:1,
},
created:function(o){ //实例创建完成时
// console.log(o)
},
mounted:function(o){ //页面初始化方法
// console.log(o)
},
destroyed:function(o){ //实例销毁方法
// console.log(o)
}
})
/*————————MUI操作————————*/
mui.init();
//侧滑容器父节点
var offCanvasWrapper = mui('#offCanvasWrapper');
//主界面容器
var offCanvasInner = offCanvasWrapper[0].querySelector('.mui-inner-wrap');
//菜单容器
var offCanvasSide = document.getElementById("offCanvasSide");
if (!mui.os.android) {
var spans = document.querySelectorAll('.android-only');
for (var i = 0, len = spans.length; i < len; i++) {
spans[i].style.display = "none";
}
}
//菜单界面,‘关闭侧滑菜单’按钮的点击事件
document.getElementById('offCanvasHide').addEventListener('tap', function() {
offCanvasWrapper.offCanvas('close');
});
//主界面和侧滑菜单界面均支持区域滚动;
mui('#offCanvasSideScroll').scroll();
mui('#offCanvasContentScroll').scroll();
//实现ios平台原生侧滑关闭页面;
if (mui.os.plus && mui.os.ios) {
mui.plusReady(function() { //5+ iOS暂时无法屏蔽popGesture时传递touch事件,故该demo直接屏蔽popGesture功能
plus.webview.currentWebview().setStyle({
'popGesture': 'none'
});
});
}
/*————————其他事件响应——————————*/
function openUrl(url,title){
mui.openWindow({
url: url,
id: encodeURI(url),
styles: { // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置
}
});
}
mui('body').on("tap",'a',function(e){
var url = e.target.href;
var title = e.target.innerHTML;
openUrl(url,title);
});
//取运单列表缓存
function getOrderList(){
var orders = JSON.parse(localStorage.getItem('OrderList'));
vm.orders = orders;
}
mui.ready(function(){
mui.toast('数据加载中……');
getOrderList();
});
+13
View File
@@ -0,0 +1,13 @@
/*
* @Author: fm453
* @Date: 2021-03-28 22:28:13
* @Last Modified by: fm453
* @Last Modified time: 2021-03-29 22:24:33
*/
p{
font-size: 1.2em;
}
.mui-bar-popover {
width: 30%;
}
+54
View File
@@ -0,0 +1,54 @@
<!DOCTYPE html>
<html>
<head>
<script src="../../vue/js/v2.6.10/vue.min.js" type="text/javascript" charset="utf-8"></script>
<meta charset="utf-8">
<title id="title">汽车托运管理系统</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="shortcut icon" href="static/favicon.ico">
<!--标准mui.css-->
<link rel="stylesheet" href="../../mui/css/mui.min.css">
<link rel="stylesheet" href="orderremark.css">
</head>
<body>
<section id="app">
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title" id="pagename">{{Page.title}}</h1>
</header>
<div class="mui-content">
<div class="mui-card">
<div class="mui-card-header ">
[{{oid}}]<h3>{{order.car_number}}</h3>
<h4 class="mui-pullright">{{order.car_title}}</h4>
</div>
<div class="mui-card-content mui-content-padded" >
<p> 运单号:{{order.sn}}</p>
<p> 日期:{{order.signdate}}</p>
<p>起运地:{{order.from_province}}-{{order.start_city}} => 目的地:{{order.to_province}}-{{order.aim_city}}</p>
</div>
</div>
<div class="mui-card">
<div class="mui-card-header ">
<h4 class="mui-pullright">运单备注</h4>
</div>
<div class="mui-card-content mui-content-padded" >
<p v-html="order.remark"></p>
</div>
</div>
</div>
<div class="mui-content-padded" id="PrintError"></div>
</section>
</body>
</html>
<script src="../../mui/js/mui.js"></script>
<script src="../../app.js" type="text/javascript" charset="utf-8"></script>
<script src="remark.js" type="text/javascript" charset="utf-8"></script>
+65
View File
@@ -0,0 +1,65 @@
/**
* @Author: 嗨噜客科技(www.hiluker.cn) <fm453>
* @Date: 2021-09-30T01:33:43+08:00
* @Email: fm453@hiluker.com
* @Last modified by: fm453
* @Last modified time: 2021-09-30T01:51:35+08:00
*/
//用户检测
const User = checkUser();
/*————————vue预定义————————*/
var vm = new Vue({
el: '#app', //该ID元素必须被包含于body以内
data: {
ctms: params.ctms,
version: params.version,
Company:params.Company,
Page:{
title:'轿运物流信息系统',
menus: menus
},
oid:0,
order:{
id:1,
remark:'备注',
},
},
methods:{
//
},
created:function(o){ //实例创建完成时
console.log(o)
},
mounted:function(o){ //页面初始化方法
console.log(o)
this.oid = getUriQueryVariable('oid');
},
destroyed:function(o){ //实例销毁方法
console.log(o)
},
});
/*————————MUI操作————————*/
mui.init({
swipeBack:true, //启用右滑关闭功能
});
/*————————其他事件响应——————————*/
//取运单信息
function getOrderDetail(){
var data = {
pid: apis.pid,
oid: vm.oid
};
var order = JSON.parse(localStorage.getItem('orderDetail-'+vm.oid));
console.log(order);
vm.order = order;
return false;
}
mui.ready(function(){
mui.toast('数据加载中……');
getOrderDetail();
});