途宝报单新需求

api/particulars.js

@@ -3,7 +3,7 @@ import request from '@/utils/request'
 
 
 // 获取用户详细信息
-export function getOrderBillsPlansByid(entityId, sysId) {
+export function getOrderBillsPlansByid(entityId) {
   return request({
     'url': '/order-bills-plans/' + entityId,
     'method': 'get'
@@ -35,6 +35,15 @@ export function putOrderBillsPlansByid(data) {
   })
 }
 
+// 提交审核
+export function submitAudit(data) {
+  return request({
+    'url': '/order-bills-plans/submit-audit',
+    'method': 'post',
+    'data': data
+  })
+}
+
 // 主库添加图片数据
 export function insertTmsAttachMngs(data) {
   return request({
@@ -62,3 +71,11 @@ export function deleteTmsAttachMngs(attachId) {
   })
 }
 
+// 队长审核
+export function audit(data) {
+  return request({
+    'url': '/order-bills-plans/submit-audit/audit',
+    'method': 'post',
+    'data': data
+  })
+}

api/reimbursement.js

@@ -33,4 +33,12 @@ export function insertLoadFeeItems(data) {
     'data': data,
 	timeout: 50000
   })
-}
+}
+
+// 查询报销费用单选
+export function isMileage(orderNo) {
+  return request({
+    'url': '/order-bills-plans/ismileage/' + orderNo,
+    'method': 'get'
+  })
+}

font/demo.css

@@ -0,0 +1,539 @@
+/* Logo 字体 */
+@font-face {
+  font-family: "iconfont logo";
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
+}
+
+.logo {
+  font-family: "iconfont logo";
+  font-size: 160px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+/* tabs */
+.nav-tabs {
+  position: relative;
+}
+
+.nav-tabs .nav-more {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  height: 42px;
+  line-height: 42px;
+  color: #666;
+}
+
+#tabs {
+  border-bottom: 1px solid #eee;
+}
+
+#tabs li {
+  cursor: pointer;
+  width: 100px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  font-size: 16px;
+  border-bottom: 2px solid transparent;
+  position: relative;
+  z-index: 1;
+  margin-bottom: -1px;
+  color: #666;
+}
+
+
+#tabs .active {
+  border-bottom-color: #f00;
+  color: #222;
+}
+
+.tab-container .content {
+  display: none;
+}
+
+/* 页面布局 */
+.main {
+  padding: 30px 100px;
+  width: 960px;
+  margin: 0 auto;
+}
+
+.main .logo {
+  color: #333;
+  text-align: left;
+  margin-bottom: 30px;
+  line-height: 1;
+  height: 110px;
+  margin-top: -50px;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.main .logo a {
+  font-size: 160px;
+  color: #333;
+}
+
+.helps {
+  margin-top: 40px;
+}
+
+.helps pre {
+  padding: 20px;
+  margin: 10px 0;
+  border: solid 1px #e7e1cd;
+  background-color: #fffdef;
+  overflow: auto;
+}
+
+.icon_lists {
+  width: 100% !important;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.icon_lists li {
+  width: 100px;
+  margin-bottom: 10px;
+  margin-right: 20px;
+  text-align: center;
+  list-style: none !important;
+  cursor: default;
+}
+
+.icon_lists li .code-name {
+  line-height: 1.2;
+}
+
+.icon_lists .icon {
+  display: block;
+  height: 100px;
+  line-height: 100px;
+  font-size: 42px;
+  margin: 10px auto;
+  color: #333;
+  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
+  -moz-transition: font-size 0.25s linear, width 0.25s linear;
+  transition: font-size 0.25s linear, width 0.25s linear;
+}
+
+.icon_lists .icon:hover {
+  font-size: 100px;
+}
+
+.icon_lists .svg-icon {
+  /* 通过设置 font-size 来改变图标大小 */
+  width: 1em;
+  /* 图标和文字相邻时，垂直对齐 */
+  vertical-align: -0.15em;
+  /* 通过设置 color 来改变 SVG 的颜色/fill */
+  fill: currentColor;
+  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
+      normalize.css 中也包含这行 */
+  overflow: hidden;
+}
+
+.icon_lists li .name,
+.icon_lists li .code-name {
+  color: #666;
+}
+
+/* markdown 样式 */
+.markdown {
+  color: #666;
+  font-size: 14px;
+  line-height: 1.8;
+}
+
+.highlight {
+  line-height: 1.5;
+}
+
+.markdown img {
+  vertical-align: middle;
+  max-width: 100%;
+}
+
+.markdown h1 {
+  color: #404040;
+  font-weight: 500;
+  line-height: 40px;
+  margin-bottom: 24px;
+}
+
+.markdown h2,
+.markdown h3,
+.markdown h4,
+.markdown h5,
+.markdown h6 {
+  color: #404040;
+  margin: 1.6em 0 0.6em 0;
+  font-weight: 500;
+  clear: both;
+}
+
+.markdown h1 {
+  font-size: 28px;
+}
+
+.markdown h2 {
+  font-size: 22px;
+}
+
+.markdown h3 {
+  font-size: 16px;
+}
+
+.markdown h4 {
+  font-size: 14px;
+}
+
+.markdown h5 {
+  font-size: 12px;
+}
+
+.markdown h6 {
+  font-size: 12px;
+}
+
+.markdown hr {
+  height: 1px;
+  border: 0;
+  background: #e9e9e9;
+  margin: 16px 0;
+  clear: both;
+}
+
+.markdown p {
+  margin: 1em 0;
+}
+
+.markdown>p,
+.markdown>blockquote,
+.markdown>.highlight,
+.markdown>ol,
+.markdown>ul {
+  width: 80%;
+}
+
+.markdown ul>li {
+  list-style: circle;
+}
+
+.markdown>ul li,
+.markdown blockquote ul>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown>ul li p,
+.markdown>ol li p {
+  margin: 0.6em 0;
+}
+
+.markdown ol>li {
+  list-style: decimal;
+}
+
+.markdown>ol li,
+.markdown blockquote ol>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown code {
+  margin: 0 3px;
+  padding: 0 5px;
+  background: #eee;
+  border-radius: 3px;
+}
+
+.markdown strong,
+.markdown b {
+  font-weight: 600;
+}
+
+.markdown>table {
+  border-collapse: collapse;
+  border-spacing: 0px;
+  empty-cells: show;
+  border: 1px solid #e9e9e9;
+  width: 95%;
+  margin-bottom: 24px;
+}
+
+.markdown>table th {
+  white-space: nowrap;
+  color: #333;
+  font-weight: 600;
+}
+
+.markdown>table th,
+.markdown>table td {
+  border: 1px solid #e9e9e9;
+  padding: 8px 16px;
+  text-align: left;
+}
+
+.markdown>table th {
+  background: #F7F7F7;
+}
+
+.markdown blockquote {
+  font-size: 90%;
+  color: #999;
+  border-left: 4px solid #e9e9e9;
+  padding-left: 0.8em;
+  margin: 1em 0;
+}
+
+.markdown blockquote p {
+  margin: 0;
+}
+
+.markdown .anchor {
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  margin-left: 8px;
+}
+
+.markdown .waiting {
+  color: #ccc;
+}
+
+.markdown h1:hover .anchor,
+.markdown h2:hover .anchor,
+.markdown h3:hover .anchor,
+.markdown h4:hover .anchor,
+.markdown h5:hover .anchor,
+.markdown h6:hover .anchor {
+  opacity: 1;
+  display: inline-block;
+}
+
+.markdown>br,
+.markdown>p>br {
+  clear: both;
+}
+
+
+.hljs {
+  display: block;
+  background: white;
+  padding: 0.5em;
+  color: #333333;
+  overflow-x: auto;
+}
+
+.hljs-comment,
+.hljs-meta {
+  color: #969896;
+}
+
+.hljs-string,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-strong,
+.hljs-emphasis,
+.hljs-quote {
+  color: #df5000;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-type {
+  color: #a71d5d;
+}
+
+.hljs-literal,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-attribute {
+  color: #0086b3;
+}
+
+.hljs-section,
+.hljs-name {
+  color: #63a35c;
+}
+
+.hljs-tag {
+  color: #333333;
+}
+
+.hljs-title,
+.hljs-attr,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-selector-attr,
+.hljs-selector-pseudo {
+  color: #795da3;
+}
+
+.hljs-addition {
+  color: #55a532;
+  background-color: #eaffea;
+}
+
+.hljs-deletion {
+  color: #bd2c00;
+  background-color: #ffecec;
+}
+
+.hljs-link {
+  text-decoration: underline;
+}
+
+/* 代码高亮 */
+/* PrismJS 1.15.0
+https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
+/**
+ * prism.js default theme for JavaScript, CSS and HTML
+ * Based on dabblet (http://dabblet.com)
+ * @author Lea Verou
+ */
+code[class*="language-"],
+pre[class*="language-"] {
+  color: black;
+  background: none;
+  text-shadow: 0 1px white;
+  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+  word-wrap: normal;
+  line-height: 1.5;
+
+  -moz-tab-size: 4;
+  -o-tab-size: 4;
+  tab-size: 4;
+
+  -webkit-hyphens: none;
+  -moz-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+}
+
+pre[class*="language-"]::-moz-selection,
+pre[class*="language-"] ::-moz-selection,
+code[class*="language-"]::-moz-selection,
+code[class*="language-"] ::-moz-selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+pre[class*="language-"]::selection,
+pre[class*="language-"] ::selection,
+code[class*="language-"]::selection,
+code[class*="language-"] ::selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+@media print {
+
+  code[class*="language-"],
+  pre[class*="language-"] {
+    text-shadow: none;
+  }
+}
+
+/* Code blocks */
+pre[class*="language-"] {
+  padding: 1em;
+  margin: .5em 0;
+  overflow: auto;
+}
+
+:not(pre)>code[class*="language-"],
+pre[class*="language-"] {
+  background: #f5f2f0;
+}
+
+/* Inline code */
+:not(pre)>code[class*="language-"] {
+  padding: .1em;
+  border-radius: .3em;
+  white-space: normal;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: slategray;
+}
+
+.token.punctuation {
+  color: #999;
+}
+
+.namespace {
+  opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: #905;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: #690;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: #9a6e3a;
+  background: hsla(0, 0%, 100%, .5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: #07a;
+}
+
+.token.function,
+.token.class-name {
+  color: #DD4A68;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+  color: #e90;
+}
+
+.token.important,
+.token.bold {
+  font-weight: bold;
+}
+
+.token.italic {
+  font-style: italic;
+}
+
+.token.entity {
+  cursor: help;
+}

font/demo_index.html

@@ -0,0 +1,253 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8"/>
+  <title>iconfont Demo</title>
+  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
+  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
+  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
+  <link rel="stylesheet" href="demo.css">
+  <link rel="stylesheet" href="iconfont.css">
+  <script src="iconfont.js"></script>
+  <!-- jQuery -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
+  <!-- 代码高亮 -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
+  <style>
+    .main .logo {
+      margin-top: 0;
+      height: auto;
+    }
+
+    .main .logo a {
+      display: flex;
+      align-items: center;
+    }
+
+    .main .logo .sub-title {
+      margin-left: 0.5em;
+      font-size: 22px;
+      color: #fff;
+      background: linear-gradient(-45deg, #3967FF, #B500FE);
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: transparent;
+    }
+  </style>
+</head>
+<body>
+  <div class="main">
+    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
+      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
+      
+    </a></h1>
+    <div class="nav-tabs">
+      <ul id="tabs" class="dib-box">
+        <li class="dib active"><span>Unicode</span></li>
+        <li class="dib"><span>Font class</span></li>
+        <li class="dib"><span>Symbol</span></li>
+      </ul>
+      
+    </div>
+    <div class="tab-container">
+      <div class="content unicode" style="display: block;">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe640;</span>
+                <div class="name">费用02</div>
+                <div class="code-name">&amp;#xe640;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe6fb;</span>
+                <div class="name">货车</div>
+                <div class="code-name">&amp;#xe6fb;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe509;</span>
+                <div class="name">进程列表</div>
+                <div class="code-name">&amp;#xe509;</div>
+              </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="unicode-">Unicode 引用</h2>
+          <hr>
+
+          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
+          <ul>
+            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
+            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
+          </ul>
+          <blockquote>
+            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
+          </blockquote>
+          <p>Unicode 使用步骤如下：</p>
+          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
+<pre><code class="language-css"
+>@font-face {
+  font-family: 'iconfont';
+  src: url('iconfont.ttf?t=1692086384998') format('truetype');
+}
+</code></pre>
+          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
+<pre><code class="language-css"
+>.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
+<pre>
+<code class="language-html"
+>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
+</code></pre>
+          <blockquote>
+            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+          </blockquote>
+          </div>
+      </div>
+      <div class="content font-class">
+        <ul class="icon_lists dib-box">
+          
+          <li class="dib">
+            <span class="icon iconfont icon-feiyong"></span>
+            <div class="name">
+              费用02
+            </div>
+            <div class="code-name">.icon-feiyong
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icon-test"></span>
+            <div class="name">
+              货车
+            </div>
+            <div class="code-name">.icon-icon-test
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-jinchengliebiao"></span>
+            <div class="name">
+              进程列表
+            </div>
+            <div class="code-name">.icon-jinchengliebiao
+            </div>
+          </li>
+          
+        </ul>
+        <div class="article markdown">
+        <h2 id="font-class-">font-class 引用</h2>
+        <hr>
+
+        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
+        <p>与 Unicode 使用方式相比，具有如下特点：</p>
+        <ul>
+          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
+          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
+        </ul>
+        <p>使用步骤如下：</p>
+        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
+<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
+</code></pre>
+        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
+</code></pre>
+        <blockquote>
+          <p>"
+            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+        </blockquote>
+      </div>
+      </div>
+      <div class="content symbol">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-feiyong"></use>
+                </svg>
+                <div class="name">费用02</div>
+                <div class="code-name">#icon-feiyong</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icon-test"></use>
+                </svg>
+                <div class="name">货车</div>
+                <div class="code-name">#icon-icon-test</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-jinchengliebiao"></use>
+                </svg>
+                <div class="name">进程列表</div>
+                <div class="code-name">#icon-jinchengliebiao</div>
+            </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="symbol-">Symbol 引用</h2>
+          <hr>
+
+          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
+            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
+          <ul>
+            <li>支持多色图标了，不再受单色限制。</li>
+            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
+            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
+            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
+          </ul>
+          <p>使用步骤如下：</p>
+          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
+<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
+</code></pre>
+          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
+<pre><code class="language-html">&lt;style&gt;
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+&lt;/style&gt;
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
+  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
+&lt;/svg&gt;
+</code></pre>
+          </div>
+      </div>
+
+    </div>
+  </div>
+  <script>
+  $(document).ready(function () {
+      $('.tab-container .content:first').show()
+
+      $('#tabs li').click(function (e) {
+        var tabContent = $('.tab-container .content')
+        var index = $(this).index()
+
+        if ($(this).hasClass('active')) {
+          return
+        } else {
+          $('#tabs li').removeClass('active')
+          $(this).addClass('active')
+
+          tabContent.hide().eq(index).fadeIn()
+        }
+      })
+    })
+  </script>
+</body>
+</html>

font/iconfont.css

@@ -0,0 +1,25 @@
+@font-face {
+  font-family: "iconfont"; /* Project id  */
+  src: url('@/font/iconfont.ttf') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-feiyong:before {
+  content: "\e640";
+}
+
+.icon-icon-test:before {
+  content: "\e6fb";
+}
+
+.icon-jinchengliebiao:before {
+  content: "\e509";
+}
+

font/iconfont.json

@@ -0,0 +1,30 @@
+{
+  "id": "",
+  "name": "",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "7145680",
+      "name": "费用02",
+      "font_class": "feiyong",
+      "unicode": "e640",
+      "unicode_decimal": 58944
+    },
+    {
+      "icon_id": "9400571",
+      "name": "货车",
+      "font_class": "icon-test",
+      "unicode": "e6fb",
+      "unicode_decimal": 59131
+    },
+    {
+      "icon_id": "12924361",
+      "name": "进程列表",
+      "font_class": "jinchengliebiao",
+      "unicode": "e509",
+      "unicode_decimal": 58633
+    }
+  ]
+}

manifest.json

@@ -16,7 +16,8 @@
         },
         "modules" : {
             "Camera" : {},
-            "Contacts" : {}
+            "Contacts" : {},
+            "Geolocation" : {}
         },
         "distribute" : {
             "android" : {
@@ -45,7 +46,12 @@
                 "dSYMs" : false
             },
             "sdkConfigs" : {
-                "ad" : {}
+                "ad" : {},
+                "geolocation" : {
+                    "system" : {
+                        "__platform__" : [ "ios", "android" ]
+                    }
+                }
             },
             "icons" : {
                 "android" : {

pages.json

@@ -16,7 +16,7 @@
 		}, {
 			"path": "pages/index",
 			"style": {
-				"navigationBarTitleText": "运单列表",
+				"navigationBarTitleText": "报单",
 				"navigationBarBackgroundColor": "#3c9cff",
 				// "navigationStyle": "custom",
 				"navigationBarTextStyle": "white" //状态栏字体颜色
@@ -29,9 +29,19 @@
 			}
 		},
 		{
+			"path": "pages/listview",
+			"style": {
+				"navigationBarTitleText": "列表",
+				"navigationBarBackgroundColor": "#3c9cff",
+				"navigationBarTextStyle": "white" //状态栏字体颜色
+			}
+		},
+		{
 			"path": "pages/mine/index",
 			"style": {
-				"navigationBarTitleText": "我的"
+				"navigationBarTitleText": "我的",
+				"navigationBarBackgroundColor": "#3c9cff",
+				"navigationBarTextStyle": "white" //状态栏字体颜色
 			}
 		}, {
 			"path": "pages/mine/avatar/index",

pages/index.vue

@@ -1,128 +1,37 @@
 <template>
 	<view class="content">
 		<!-- 头部 -->
-		<view class="example-body vertical-layout">
+		<view class="head">
 			<!-- 用户头像 -->
-			<!-- <image :src="avatar" class="user" @click="userTo()">
-			</image> -->
-			<!-- <view style="width: 100%; height: 98rpx"></view> -->
-			<view class="falseSearch">
-				<u-search bgColor="#fff" hover-class="search" @search="getOrderBillsPlansList()" @confirm="getOrderBillsPlansList()" :showAction="false"
-					placeholder="请输入订单号码" v-model="condition.orderNo">
-				</u-search>
-				<text class="search" hover-class="search-click" @click="getOrderBillsPlansList()">搜索</text>
-			</view>
+			<image :src="avatar" class="user" @click="userTo()">
+				<text class="name">{{$store.state.user.name}}</text>
 		</view>
-		<!-- 日期 -->
-		<view style="position: sticky;top: 120rpx;">
-			<view style="background-color: white">
-				<uni-datetime-picker v-model="condition.range" type="daterange" />
+		<!-- 司机报单 -->
+		<view class="driverEntry" @click="driverClass('BD')">
+			<!-- 图标 -->
+			<span class="icon iconfont">&#xe509;</span>
+			<view class="message">
+				<text class="main">司机报单</text>
+				<!-- <text class="assist">司机报单</text> -->
 			</view>
 		</view>
-		<view class="dataList">
-
-			<!-- 列表 -->
-			<view class="list" v-for="(item,index) in orderBillsPlansList"
-				@click="jumpDetails(item.orderNo, item.status317, item.status376)">
-				<!-- 头部 -->
-				<view class="head vertical-layout">
-					<view class="no" style="font-size: 34rpx;">
-						<view class="blueStick-blue"></view>
-						<!-- <view class="blueStick-red" v-if="item.billStatus == 6"></view> -->
-						<!-- 订单号 -->
-						<text class="odd">订单号:&nbsp;{{ item.orderNo == null ? '' : item.orderNo }}</text>
-					</view>
-
-					<!-- <view class="date">
-						<text>{{ item.billDate }}</text>
-					</view> -->
-					<!-- {{item.status317}}
-					{{item.status376}} -->
-					<view class="date">
-						<text class="true" v-if="item.status317 == 2">{{ item.billStatusName }}</text>
-						<!-- item.status376 == 0 -->
-						<!-- item.status376 == 2  -->
-						<text class="yellow" v-if="item.status317 == 6 && (item.status376 == 0 || item.status376 == 2)">{{ item.billStatusName }}</text>
-						<text class="false" v-if="item.status317 == 6 && item.status376 == 6">{{ item.billStatusName }}</text>
-					</view>
-				</view>
-				<!-- <view class="details">
-					<view class="left vertical-layout">
-						<text class="data-left vertical-layout colorBlue">装车地</text>
-						<text class="data-right">{{ item.loadAddr == null ? '' : item.loadAddr }}</text>
-					</view>
-					<view class="right vertical-layout">
-						<text class="data-left vertical-layout colorBlue">卸车地&nbsp;</text>
-						<text>&nbsp;{{ item.unLoadAddr == null ? '' : item.unLoadAddr }}</text>
-					</view>
-				</view>
 
-				<view class="details">
-					<view class="left vertical-layout">
-						<text class="data-left vertical-layout colorBlue">装货品名&nbsp;</text>
-						<text>{{ item.goodsCName == null ? '' : item.goodsCName }}</text>
-					</view>
-					<view class="right">
-						<text class="data-left colorBlue">额定数量&nbsp;</text>
-						<text>{{ item.rightqty == null ? '' : item.rightqty }}</text>
-					</view>
-				</view>
-
-				<view class="details">
-					<view class="left vertical-layout">
-						<text class="data-left vertical-layout colorBlue">业务员&nbsp;</text>
-						<text>{{ item.transact == null ? '' : item.transact }}</text>
-					</view>
-					<view class="right vertical-layout">
-						<text class="data-left vertical-layout colorBlue">派单日期</text>
-						<text>{{ item.billDate == null ? '' : item.billDate}}</text>
-					</view>
-				</view> -->
-
-				<view class="details">
-					<view class="data">
-						<text class="key">装卸地点</text>
-						<text
-							class="value">{{ item.loadAddr == null ? '' : item.loadAddr }}--{{ item.unLoadAddr == null ? '' : item.unLoadAddr }}</text>
-					</view>
-					<view class="data">
-						<text class="key">装货品名</text>
-						<text class="value">{{ item.goodsCName == null ? '' : item.goodsCName }} {{ item.rightqty == null ? '' : item.rightqty + "吨" }}</text>
-					</view>
-					<view class="data vertical-layout">
-						<view class="a">
-							<text class="key">派单日期</text>
-							<text class="value">{{ item.billDate == null ? '' : item.billDate}}</text>
-						</view>
-						<view class="b">
-							<text class="key">业务员</text>
-							<text class="value">{{ item.transact == null ? '' : item.transact }}</text>
-						</view>
-					</view>
-				</view>
+		<!-- 费用报销 -->
+		<view class="driverEntry" @click="driverClass('BX')">
+			<!-- 图标 -->
+			<span class="icon iconfont">&#xe640;</span>
+			<view class="message">
+				<text class="main">费用报销</text>
+				<!-- <text class="assist">费用报销</text> -->
 			</view>
-
 		</view>
 	</view>
 </template>
 
 <script>
-	import {
-		orderBillsPlansList
-	} from "@/api/home"
-	import storage from '@/utils/storage'
 	export default {
 		data() {
 			return {
-				// 查询条件
-				condition: {
-					range: [],
-					head: 1,
-					tail: 9
-				},
-				// 数据
-				orderBillsPlansList: [],
-				show: false,
 
 			}
 		},
@@ -131,331 +40,104 @@
 				return this.$store.state.user.avatar
 			}
 		},
-		onLoad() {
-			this.getCurrentMonthFirst();
-			this.getOrderBillsPlansList();
-		},
-		onReachBottom() {
-			this.condition.head += 9;
-			this.condition.tail += 9;
-			orderBillsPlansList(this.condition).then(res => {
-				var next_data = res.data;
-				this.orderBillsPlansList = this.orderBillsPlansList.concat(next_data);
-			})
-		},
+		onLoad() {},
+		onReachBottom() {},
 		methods: {
-			// 查询主页数据
-			getOrderBillsPlansList() {
-				this.condition.head = 1;
-				this.condition.tail = 9;
-				orderBillsPlansList(this.condition).then(res => {
-					this.orderBillsPlansList = res.data;
-				})
-			},
-			// 跳转详情
-			jumpDetails(orderNo, status317, status376) {
+			driverClass(type) {
+				//跳转列表
 				uni.navigateTo({
-					url: 'particulars/index?orderNo=' + orderNo + '&status317=' + status317 + '&status376=' +
-						status376
+					url: '/pages/listview?type=' + type
 				});
-			},
-			// 跳转用户信息
-			userTo() {
-				// console.log("跳转用户信息");
-				uni.navigateTo({
-					url: 'mine/index'
-				});
-
-			},
-			//获取当前月份第一天和最后一天
-			getCurrentMonthFirst() {
-				var date = new Date();
-				var nowDate = new Date()
-				var fullYear = nowDate.getFullYear();
-				var month = nowDate.getMonth() + 1;
-				var endOfMonth = new Date(fullYear, month, 0).getDate(); // 获取本月最后一天
-				date.setDate(1);
-				var beginDate = date.toISOString().slice(0, 10);
-				var endDate = this.getFullDate(new Date().setDate(endOfMonth));
-
-
-				var date1 = new Date();
-				var date2 = new Date(date1);
-
-				//-30为30天前，+30可以获得30天后的日期
-				date2.setDate(date1.getDate() - 30);
-
-				//30天前（月份判断是否小于10，小于10的前面+0）
-				var agoDay =
-					`${date2.getFullYear()}-${date2.getMonth() + 1<10?`0${date2.getMonth() + 1}`:date2.getMonth() + 1}`;
-					
-					var date = date2.getDate() + "";
-					
-					if(date.length == 1) {
-						date = 0 + date
-					}
-					
-					agoDay += "-" + date
-					
-					
-					console.log(agoDay);
-					console.log(endDate);
-
-				this.condition.range.push(agoDay, endDate);
-
-			},
-			// 日期格式化
-			getFullDate(targetDate) {
-				var D, y, m, d;
-				if (targetDate) {
-					D = new Date(targetDate);
-					y = D.getFullYear();
-					m = D.getMonth() + 1;
-					d = D.getDate();
-				} else {
-					y = fullYear;
-					m = month;
-					d = date;
-				}
-				m = m > 9 ? m : '0' + m;
-				d = d > 9 ? d : '0' + d;
-				return y + '-' + m + '-' + d;
 			}
-
 		},
 	}
 </script>
 
 <style lang="scss">
-	// 修改布局方向为纵向布局
-	.vertical-layout {
-		display: flex;
-	}
-
-	// 文字浅蓝色
-	.colorBlue {
-		color: #3c9cff;
-	}
-
-	.blueStick-blue {
-		width: 10rpx;
-		height: 100%;
-		border-radius: 5rpx;
-		background-color: #3c9cff;
-	}
-
-	.blueStick-red {
-		width: 10rpx;
-		height: 100%;
-		border-radius: 5rpx;
-		background-color: red;
-	}
-
-	.img {
-		padding-left: 20rpx;
-		max-width: 30rpx;
-	}
-
-	// 头部
-	.example-body {
-
-		box-sizing: border-box;
-
-		width: 100%;
-		height: 120rpx;
-		position: -webkit-sticky;
-		position: sticky;
-		top: var(--window-top);
-		z-index: 99;
-		background-color: #3c9cff;
-
-		padding-left: 40rpx;
-
-		align-items: center;
-
-		// 用户头像
-		.user {
-			width: 90rpx;
-			height: 90rpx;
-			border-radius: 45rpx;
-			background-color: #c4c6c9;
-			margin-right: 40rpx;
-		}
-
-		// 搜索框
-		.falseSearch {
-			height: 80rpx;
-			border-radius: 35rpx;
-			
-			width: 680rpx;
-
-			display: flex;
-			background-color: #fff;
-
-			align-content: center;
-			align-items: center;
-
-			color: #c4c6c9;
-
-			// 搜索按钮
-			.search {
-				height: 100%;
-				border-radius: 35rpx;
-				color: #303133;
-				text-align: center;
-				line-height: 80rpx;
-				padding: 0 40rpx;
+	@import url("/font/iconfont.css");
+
+	.content {
+
+		// background-color: #f6f6f6;
+
+		// 头部
+		.head {
+			width: 100%;
+			height: 360rpx;
+			background-color: #3c9cff;
+			position: relative;
+
+			// 用户头像
+			.user {
+				width: 200rpx;
+				height: 200rpx;
+				border-radius: 100rpx;
+				position: absolute;
+				top: 40rpx;
+				left: calc(50% - 100rpx);
+				border-radius: 200rpx;
 			}
 
-			.search-click {
-				background-color: pink;
+			// 用户名字
+			.name {
+				color: #fff;
+				font-size: 40rpx;
+				position: absolute;
+				bottom: 40rpx;
+				left: 50%;
+				transform: translateX(-50%);
+				border-radius: 200rpx;
 			}
-
 		}
-	}
-
-	.dataList {
-
-		box-sizing: border-box;
-		padding-left: 10rpx;
-		padding-right: 10rpx;
-
-		.list {
-
-			padding-top: 5rpx;
 
+		// 司机报单
+		.driverEntry {
+			width: 90%;
+			height: 300rpx;
 			border-radius: 20rpx;
-			margin-top: 20rpx;
-			background-color: white;
-			padding-bottom: 15rpx;
-
-			box-shadow: 1px 1px 2px 2px rgba(76, 76, 76, 0.1);
-
-			.head {
-
-				
-
-				height: 50rpx;
-				margin: 10rpx 20rpx 20rpx 20rpx;
 
-				padding-top: 6rpx;
-				padding-bottom: 6rpx;
+			margin: 30rpx auto 0 auto;
+			// margin-top: 30rpx;
 
-				// margin-bottom: 20rpx;
+			position: relative;
 
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-
-				.no {
-
-					height: 100%;
-					display: flex;
-					align-items: center;
-
-					.odd {
-						height: 100%;
-						display: flex;
-						align-items: center;
-						padding-left: 15rpx;
-						font-weight: 700;
-					}
-				}
-
-				.date {
-					.true {
-						color: red;
-					}
+			background-color: #fff;
+			border: 4rpx solid #e6e6e6;
 
-					.yellow {
-						color: #3c9cff;
-					}
+			.icon {
+				position: absolute;
+				top: 50%;
+				transform: translateY(-50%);
+				left: 60rpx;
+				color: #377bdc;
 
-					.false {
-						color: green;
-					}
-				}
+				font-size: 160rpx;
 			}
 
-			.details {
-
-				// width: 100%;
-
-				// font-size: 30rpx;
-
-				// margin-left: 20rpx;
-				margin-right: 20rpx;
-				margin-bottom: 10rpx;
-
-				padding-bottom: 4rpx;
-
-
-				margin-left: 20rpx;
-				// border-top: 4rpx solid #f0f0f0ff;
-
-				// border-bottom: 2rpx dotted #000;
-
-				.left {
-					// text-align: right;
-					width: 35%;
-					float: left;
-
-				}
-
-				.right {
-					width: 50%;
-					margin-left: 30%;
-				}
-
-				.right-two {
-					// border-top: 4rpx solid #f0f0f0ff;\
-					margin-top: 10rpx;
-					padding-bottom: 10rpx;
+			.message {
+				width: 60%;
+				height: 100%;
 
-				}
+				position: absolute;
+				right: 0;
 
-				.data-left {
-					margin-right: 20rpx;
-					display: inline-block;
-					width: 50%;
-					text-align: right;
-				}
 
-				.data-right {
-					// width: 50%;
+				.main {
+					position: absolute;
+					font-size: 30rpx;
+					font-weight: 600;
+					color: #4d88de;
+					top: 100rpx;
 				}
 
-				.data {
-					
-					margin-bottom: 10rpx;
-
-					.key {
-						color: #3c9cff;
-					}
-
-					.value {
-						padding-left: 20rpx;
-					}
-
-					.a {
-						width: 50%;
-					}
-
-					.b {
-						width: 50%;
-					}
+				.assist {
+					position: absolute;
+					font-size: 30rpx;
+					color: #a0a0a0;
+					top: 160rpx;
 
 				}
 			}
-
-			.primary {
-				float: right;
-				line-height: 40rpx;
-				margin-top: 10rpx;
-				margin-right: 10rpx;
-				height: 40rpx;
-			}
-
 		}
 	}
 </style>

pages/listview.vue

@@ -0,0 +1,506 @@
+<template>
+	<view class="content">
+		<!-- 头部 -->
+		<view class="example-body vertical-layout">
+			<!-- 用户头像 -->
+			<!-- <image :src="avatar" class="user" @click="userTo()">
+			</image> -->
+			<!-- <view style="width: 100%; height: 98rpx"></view> -->
+			<view class="falseSearch">
+				<u-search bgColor="#fff" hover-class="search" @search="getOrderBillsPlansList()"
+					@confirm="getOrderBillsPlansList()" :showAction="false" placeholder="请输入"
+					v-model="condition.orderNo">
+				</u-search>
+				<text class="search" hover-class="search-click" @click="getOrderBillsPlansList()">搜索</text>
+			</view>
+		</view>
+		<!-- 日期 -->
+		<view style="position: sticky;top: 120rpx;">
+			<view style="background-color: white">
+				<uni-datetime-picker v-model="condition.range" type="daterange" />
+			</view>
+		</view>
+		<view class="dataList">
+
+			<!-- 列表 -->
+			<view class="list" v-for="(item,index) in orderBillsPlansList"
+				@click="jumpDetails(item.orderNo, item.status)">
+				<!-- 头部 -->
+				<view class="head vertical-layout">
+					<view class="no" style="font-size: 34rpx;">
+						<view class="blueStick-blue"></view>
+						<!-- 车号 -->
+						<text class="odd">{{ item.carRegNo == null ? '' : item.carRegNo }}</text>
+					</view>
+					<view class="date"><!-- 
+						<text class="true" v-if="item.status317 == 2">{{ item.billStatusName }}</text>
+						<text class="yellow"
+							v-if="item.status317 == 6 && (item.status376 == 0 || item.status376 == 2)">{{ item.billStatusName }}</text>
+						<text class="false"
+							v-if="item.status317 == 6 && item.status376 == 6">{{ item.billStatusName }}</text> -->
+						<!-- <text class="true" v-if="condition.type == 'BD'">{{ item.billStatusName }}</text>
+						<text class="yellow" v-if="condition.type == 'BX'">{{ item.billStatusName }}</text> -->
+						<text style="color: #3c9cff;" v-if="item.billStatusName == '费用已提交'">{{ item.billStatusName }}</text>
+						<text style="color: green;" v-if="item.billStatusName == '审核通过'">{{ item.billStatusName }}</text>
+						<text style="color: #fa4434;" v-if="item.billStatusName == '审核驳回'">{{ item.billStatusName }}</text>
+						<text style="color: #3c9cff;" v-if="item.billStatusName == '里程已提交'">{{ item.billStatusName }}</text>
+						<text style="color: #fcbd71;" v-if="item.billStatusName == '里程待提交'">{{ item.billStatusName }}</text>
+						<text style="color: #fcbd71;" v-if="item.billStatusName == '费用待提交'">{{ item.billStatusName }}</text>
+					</view>
+				</view>
+				<view class="details">
+
+					<view class="didian">
+						<view class="text">
+							<text>{{ item.loadAddr == null ? '' : item.loadAddr }}</text>
+						</view>
+						<view class="freight">
+							<view class="goods">
+								<text>{{ item.goodsCName == null ? '' : item.goodsCName }}</text>
+							</view>
+							<span class="icon iconfont"
+								style="font-size: 100rpx; color: #fcbd71; height: 80rpx;">&#xe6fb;</span>
+							<view class="rightqty" style="height: 50rpx;">
+								<text>{{ item.rightqty == null ? '' : item.rightqty + "吨" }}</text>
+							</view>
+						</view>
+						<view class="text">
+							<text>{{ item.unLoadAddr == null ? '' : item.unLoadAddr }}</text>
+						</view>
+					</view>
+					<view class="date-transact">
+						<view class="date">
+							<text>{{ item.billDate == null ? '' : item.billDate}}</text>
+						</view>
+						<view class="transact">
+							<text>{{ item.transact == null ? '' : item.transact}}</text>
+						</view>
+					</view>
+					<!-- <view class="data">
+						<text class="key">装货品名</text>
+						<text class="value">{{ item.goodsCName == null ? '' : item.goodsCName }}
+							{{ item.rightqty == null ? '' : item.rightqty + "吨" }}</text>
+					</view>
+					<view class="data vertical-layout">
+						<view class="a">
+							<text class="key">派单日期</text>
+							<text class="value">{{ item.billDate == null ? '' : item.billDate}}</text>
+						</view>
+						<view class="b">
+							<text class="key">业务员</text>
+							<text class="value">{{ item.transact == null ? '' : item.transact }}</text>
+						</view>
+					</view> -->
+				</view>
+			</view>
+
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		orderBillsPlansList
+	} from "@/api/home"
+	import storage from '@/utils/storage'
+	export default {
+		data() {
+			return {
+				// 查询条件
+				condition: {
+					range: [],
+					head: 1,
+					tail: 9
+				},
+				// 数据
+				orderBillsPlansList: [],
+				show: false,
+
+			}
+		},
+		computed: {
+			avatar() {
+				return this.$store.state.user.avatar
+			}
+		},
+		onLoad(option) {
+			this.condition.type = option.type;
+
+			if (option.type == 'BD') {
+				uni.setNavigationBarTitle({
+					title: '报单列表'
+				});
+			} else if (option.type == 'BX'){
+				uni.setNavigationBarTitle({
+					title: '报销列表'
+				});
+			}
+
+			this.getCurrentMonthFirst();
+			this.getOrderBillsPlansList();
+		},
+		onReachBottom() {
+			this.condition.head += 9;
+			this.condition.tail += 9;
+			orderBillsPlansList(this.condition).then(res => {
+				var next_data = res.data;
+				this.orderBillsPlansList = this.orderBillsPlansList.concat(next_data);
+			})
+		},
+		methods: {
+			// 查询主页数据
+			getOrderBillsPlansList(type) {
+				this.condition.head = 1;
+				this.condition.tail = 9;
+				orderBillsPlansList(this.condition).then(res => {
+					this.orderBillsPlansList = res.data;
+				})
+			},
+			// 跳转详情
+			jumpDetails(orderNo, status) {
+
+				if (this.condition.type == 'BD') {
+
+					uni.navigateTo({
+						url: 'particulars/index?orderNo=' + orderNo + '&status=' + status
+					});
+				} else if (this.condition.type == 'BX') {
+
+					uni.navigateTo({
+						url: '/pages/particulars/claimExpense/index?orderNo=' + orderNo + '&status=' + status
+					});
+
+				}
+
+			},
+			// 跳转用户信息
+			userTo() {
+				uni.navigateTo({
+					url: 'mine/index'
+				});
+
+			},
+			//获取当前月份第一天和最后一天
+			getCurrentMonthFirst() {
+				var date = new Date();
+				var nowDate = new Date()
+				var fullYear = nowDate.getFullYear();
+				var month = nowDate.getMonth() + 1;
+				var endOfMonth = new Date(fullYear, month, 0).getDate(); // 获取本月最后一天
+				date.setDate(1);
+				var beginDate = date.toISOString().slice(0, 10);
+				var endDate = this.getFullDate(new Date().setDate(endOfMonth));
+
+
+				var date1 = new Date();
+				var date2 = new Date(date1);
+
+				//-30为30天前，+30可以获得30天后的日期
+				date2.setDate(date1.getDate() - 30);
+
+				//30天前（月份判断是否小于10，小于10的前面+0）
+				var agoDay =
+					`${date2.getFullYear()}-${date2.getMonth() + 1<10?`0${date2.getMonth() + 1}`:date2.getMonth() + 1}`;
+
+				var date = date2.getDate() + "";
+
+				if (date.length == 1) {
+					date = 0 + date
+				}
+
+				agoDay += "-" + date
+
+				this.condition.range.push(agoDay, endDate);
+
+			},
+			// 日期格式化
+			getFullDate(targetDate) {
+				var D, y, m, d;
+				if (targetDate) {
+					D = new Date(targetDate);
+					y = D.getFullYear();
+					m = D.getMonth() + 1;
+					d = D.getDate();
+				} else {
+					y = fullYear;
+					m = month;
+					d = date;
+				}
+				m = m > 9 ? m : '0' + m;
+				d = d > 9 ? d : '0' + d;
+				return y + '-' + m + '-' + d;
+			}
+
+		},
+	}
+</script>
+
+<style lang="scss">
+	@import url("/font/iconfont.css");
+
+	// 修改布局方向为纵向布局
+	.vertical-layout {
+		display: flex;
+	}
+
+	// 文字浅蓝色
+	.colorBlue {
+		color: #3c9cff;
+	}
+
+	.blueStick-blue {
+		width: 10rpx;
+		height: 100%;
+		border-radius: 5rpx;
+		background-color: #3c9cff;
+	}
+
+	.blueStick-red {
+		width: 10rpx;
+		height: 100%;
+		border-radius: 5rpx;
+		background-color: red;
+	}
+
+	.img {
+		padding-left: 20rpx;
+		max-width: 30rpx;
+	}
+
+	// 头部
+	.example-body {
+
+		box-sizing: border-box;
+
+		width: 100%;
+		height: 120rpx;
+		position: -webkit-sticky;
+		position: sticky;
+		top: var(--window-top);
+		z-index: 99;
+		background-color: #3c9cff;
+
+		padding-left: 40rpx;
+
+		align-items: center;
+
+		// 用户头像
+		.user {
+			width: 90rpx;
+			height: 90rpx;
+			border-radius: 45rpx;
+			background-color: #c4c6c9;
+			margin-right: 40rpx;
+		}
+
+		// 搜索框
+		.falseSearch {
+			height: 80rpx;
+			border-radius: 35rpx;
+
+			width: 680rpx;
+
+			display: flex;
+			background-color: #fff;
+
+			align-content: center;
+			align-items: center;
+
+			color: #c4c6c9;
+
+			// 搜索按钮
+			.search {
+				height: 100%;
+				border-radius: 35rpx;
+				color: #303133;
+				text-align: center;
+				line-height: 80rpx;
+				padding: 0 40rpx;
+			}
+
+			.search-click {
+				background-color: pink;
+			}
+
+		}
+	}
+
+	.dataList {
+
+		box-sizing: border-box;
+		padding-left: 10rpx;
+		padding-right: 10rpx;
+
+		.list {
+
+			padding-top: 5rpx;
+
+			border-radius: 20rpx;
+			margin-top: 20rpx;
+			background-color: white;
+			padding-bottom: 15rpx;
+
+			box-shadow: 1px 1px 2px 2px rgba(76, 76, 76, 0.1);
+
+			.head {
+
+
+
+				height: 50rpx;
+				margin: 10rpx 20rpx 20rpx 20rpx;
+
+				padding-top: 6rpx;
+				padding-bottom: 6rpx;
+
+				// margin-bottom: 20rpx;
+
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+
+				.no {
+
+					height: 100%;
+					display: flex;
+					align-items: center;
+
+					.odd {
+						height: 100%;
+						display: flex;
+						align-items: center;
+						padding-left: 15rpx;
+						font-weight: 700;
+					}
+				}
+
+				.date {
+
+					font-weight: 600;
+
+					.true {
+						color: #fa4434;
+					}
+
+					.yellow {
+						color: #3c9cff;
+					}
+
+					.false {
+						color: green;
+					}
+				}
+			}
+
+			.details {
+				color: #3d3e41;
+
+				.didian {
+					display: flex;
+					justify-content: space-around;
+					align-items: center;
+
+					border-bottom: 2rpx solid #f2f2f0;
+
+					.text {
+						font-size: 36rpx;
+						font-weight: 600;
+					}
+
+					.freight {
+						display: flex;
+						flex-direction: column;
+						align-items: center;
+
+						.goods {
+							font-weight: 600;
+						}
+
+						.rightqty {
+							font-weight: 600;
+						}
+					}
+				}
+
+				.date-transact {
+					margin: 0 20rpx;
+					line-height: 100rpx;
+					font-size: 34rpx;
+					font-weight: 600;
+					// border-bottom: 2rpx solid #f2f2f0;
+
+					display: flex;
+					justify-content: space-between;
+				}
+
+				margin-right: 20rpx;
+				margin-bottom: 10rpx;
+
+				padding-bottom: 4rpx;
+
+
+				margin-left: 20rpx;
+
+				.left {
+					// text-align: right;
+					width: 35%;
+					float: left;
+
+				}
+
+				.right {
+					width: 50%;
+					margin-left: 30%;
+				}
+
+				.right-two {
+					// border-top: 4rpx solid #f0f0f0ff;\
+					margin-top: 10rpx;
+					padding-bottom: 10rpx;
+
+				}
+
+				.data-left {
+					margin-right: 20rpx;
+					display: inline-block;
+					width: 50%;
+					text-align: right;
+				}
+
+				.data-right {
+					// width: 50%;
+				}
+
+				.data {
+
+					margin-bottom: 10rpx;
+
+					.key {
+						color: #3c9cff;
+					}
+
+					.value {
+						padding-left: 20rpx;
+					}
+
+					.a {
+						width: 50%;
+					}
+
+					.b {
+						width: 50%;
+					}
+
+				}
+			}
+
+			.primary {
+				float: right;
+				line-height: 40rpx;
+				margin-top: 10rpx;
+				margin-right: 10rpx;
+				height: 40rpx;
+			}
+
+		}
+	}
+</style>

pages/login.vue

@@ -133,8 +133,6 @@
 						isKeepKey: false
 					};
 
-					console.log(this.loginForm.isKeepKey);
-
 					if (this.isKeepKey.length > 0) {
 						user.password = this.loginForm.password;
 						user.isKeepKey = true;

pages/mine/index.vue

@@ -2,7 +2,7 @@
 	<view class="mine-container" :style="{height: `${windowHeight}px`}">
 		<!--顶部个人信息栏-->
 		<view class="header-section">
-			<view class="flex padding justify-between">
+			<view class="flex padding justify-between" style="justify-content: flex-start !important;">
 				<view class="flex align-center">
 					<view v-if="!avatar" class="cu-avatar xl round bg-white">
 						<view class="iconfont icon-people text-gray icon"></view>
@@ -10,41 +10,29 @@
 					<image v-if="avatar" @click="handleToAvatar" :src="avatar" class="cu-avatar xl round"
 						mode="widthFix">
 					</image>
-					<view v-if="!name" @click="handleToLogin" class="login-tip">
+					<!-- <view v-if="!name" @click="handleToLogin" class="login-tip">
 						点击登录
-					</view>
+					</view> -->
+				</view>
+				<view @click="handleToInfo" class="flex align-center" style="position: absolute; left: 200rpx; top: 80rpx; width: 440rpx;">
 					<view v-if="name" @click="handleToInfo" class="user-info">
 						<view class="u_title">
 							用户名：{{ name }}
 						</view>
+						<view class="u_no">
+							身份证：{{ user.remark }}
+							<!-- 身份证：222222222222222222 -->
+						</view>
+					</view>
+					<view style="position: absolute; top: 8rpx; right: -80rpx;">
+						<text>个人信息</text>
+						<view class="iconfont icon-right"></view>
 					</view>
-				</view>
-				<view @click="handleToInfo" class="flex align-center">
-					<text>个人信息</text>
-					<view class="iconfont icon-right"></view>
 				</view>
 			</view>
 		</view>
 
 		<view class="content-section">
-			<!-- <view class="mine-actions grid col-4 text-center">
-        <view class="action-item" @click="handleJiaoLiuQun">
-          <view class="iconfont icon-friendfill text-pink icon"></view>
-          <text class="text">交流群</text>
-        </view>
-        <view class="action-item" @click="handleBuilding">
-          <view class="iconfont icon-service text-blue icon"></view>
-          <text class="text">在线客服</text>
-        </view>
-        <view class="action-item" @click="handleBuilding">
-          <view class="iconfont icon-community text-mauve icon"></view>
-          <text class="text">反馈社区</text>
-        </view>
-        <view class="action-item" @click="handleBuilding">
-          <view class="iconfont icon-dianzan text-green icon"></view>
-          <text class="text">点赞我们</text>
-        </view>
-      </view> -->
 
 			<view class="menu-list">
 				<view class="list-cell list-cell-arrow" @click="handleToEditInfo">
@@ -53,24 +41,6 @@
 						<view>编辑资料</view>
 					</view>
 				</view>
-				<!-- <view class="list-cell list-cell-arrow" @click="handleHelp">
-          <view class="menu-item-box">
-            <view class="iconfont icon-help menu-icon"></view>
-            <view>常见问题</view>
-          </view>
-        </view> -->
-				<!-- <view class="list-cell list-cell-arrow" @click="handleAbout">
-          <view class="menu-item-box">
-            <view class="iconfont icon-aixin menu-icon"></view>
-            <view>关于我们</view>
-          </view>
-        </view> -->
-				<!-- <view class="list-cell list-cell-arrow" @click="handleToSetting">
-          <view class="menu-item-box">
-            <view class="iconfont icon-setting menu-icon"></view>
-            <view>应用设置</view>
-          </view>
-        </view> -->
 
 				<view class="list-cell list-cell-arrow" @click="handleLogout">
 					<view class="menu-item-box">
@@ -86,14 +56,24 @@
 
 <script>
 	import storage from '@/utils/storage'
+	import {
+		getUserProfile
+	} from "@/api/system/user"
 
 	export default {
 		data() {
 			return {
 				name: this.$store.state.user.name,
-				version: getApp().globalData.config.appInfo.version
+				version: getApp().globalData.config.appInfo.version,
+				user: {}
 			}
 		},
+
+		onLoad() {
+			getUserProfile().then(response => {
+				this.user = response.data
+			})
+		},
 		computed: {
 			avatar() {
 				return this.$store.state.user.avatar
@@ -152,8 +132,8 @@
 
 
 		.header-section {
-			padding: 15px 15px 45px 15px;
-			background-color: #3c96f3;
+			padding: 15px 15px 15px 15px;
+			background-color: #3c9cff;
 			color: white;
 
 			.login-tip {
@@ -181,7 +161,7 @@
 
 		.content-section {
 			position: relative;
-			top: -50px;
+			// top: -50px;
 
 			.mine-actions {
 				margin: 15px 15px;

pages/particulars/index.vue

@@ -2,220 +2,247 @@
 	<view class="content">
 		<u-sticky>
 			<view class="head-no">
-				<text>订单号: {{formData.orderNo}}</text>
+				<!-- <text>订单号: {{formData.orderNo}}</text> -->
+				<view>
+					<text>{{ formData.carRegNo == null ? '' : formData.carRegNo }}</text>
+				</view>
+				<view>
+					<text>{{ formData.goodsCName == null ? '' : formData.goodsCName }}</text>
+				</view>
+			</view>
+			<view class="head-no-addr">
+				<view>
+					<text>{{formData.loadAddr}}</text>
+				</view>
+				<span class="icon iconfont" style="font-size: 100rpx; color: #fcbd71; height: 80rpx;">&#xe6fb;</span>
+				<view>
+					<text>{{formData.unLoadAddr}}</text>
+				</view>
 			</view>
 		</u-sticky>
+		<u-sticky>
+		</u-sticky>
 		<view class="striping"></view>
-		<view class="head a-blue" @click="telFun">
+		<!-- <view class="head a-blue" @click="telFun">
 			<text>驾驶员: {{formData.driver1Name == null ? '' : formData.driver1Name}}&nbsp;{{formData.driver1mobile == null ? '' : formData.driver1mobile}}</text>
-		</view>
-		<!-- <u-collapse :value="['Declaration information']"> -->
-		<!-- <u-collapse ref="xxxxxx111"> -->
-		<!-- <u-collapse-item title="报单信息" name="Declaration information"> -->
-		<view class="box-box">
+		</view> -->
+
+		<!-- <u-tabs :list="tabs" @change="change" :activeStyle="{
+				width: '180rpx',
+				height: '60rpx',
+				color: '#fff',
+				backgroundColor: '#3c9cff',
+				borderRadius: '80rpx',
+				lineHeight: '60rpx',
+				textAlign: 'center'
+				}" :inactiveStyle="{
+				width: '180rpx',
+				height: '60rpx',
+				color: '#3c9cff',
+				backgroundColor: '#f0f0f0f0',
+				borderRadius: '80rpx',
+				lineHeight: '60rpx',
+				textAlign: 'center'
+				}"></u-tabs> -->
+
+
+		<view v-if="isTabs == '装卸确认'">
+			<view class="box-box">
+				<view class="box-two">
+					<text class="key">装车吨位<text style="color: red;">*</text></text>
+					<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
+						@input="checkLoadQty" v-model="formData.loadQty" />
+				</view>
+
+				<view class="box-two">
+					<text class="key">装车时间<text style="color: red;">*</text></text>
+					<uni-datetime-picker class="value-two" :start="startDate" :end="new Date + ''" :disabled="disabled"
+						v-model="formData.loadDateString" :border="false" />
+				</view>
+
+				<view class="box-two">
+					<text class="key">卸车吨位<text style="color: red;">*</text></text>
+					<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
+						@input="checkUnLoadQty" v-model="formData.unLoadQty" />
+				</view>
+
+				<view class="box-two">
+					<text class="key">卸车时间<text style="color: red;">*</text></text>
+					<uni-datetime-picker class="value-two" :start="formData.loadDateString" :end="new Date + ''"
+						:disabled="disabled" :clear-icon="false" v-model="formData.unLoadDateString" :border="false" />
+				</view>
 
-			<!-- <view class="box">
+				<!-- <view class="box">
 					<view class="data">
-						<text class="key">装车吨位</text>
-						<input class="value" :disabled="disabled" type="digit" @input="checkLoadQty"
-							v-model="formData.loadQty" />
+						<text class="key">空载起点</text>
+						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
+							v-model="formData.emptyaddr1" />
 					</view>
 					<view class="data">
-						<text class="key-date">装车时间</text>
-						<uni-datetime-picker class="value" :disabled="disabled"
-							v-model="formData.loadDateString">{{formData.loadDateString == null ? "请选择日期" : formData.loadDateString }}</uni-datetime-picker>
+						<text class="key">空车里程</text>
+						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
+							v-model="formData.odometerstart" />
 					</view>
-				</view> -->
-
-			<view class="box-two">
-				<text class="key">装车吨位</text>
-				<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled"
-					type="digit" @input="checkLoadQty" v-model="formData.loadQty" />
-			</view>
-
-			<view class="box-two">
-				<text class="key">装车时间</text>
-				<uni-datetime-picker class="value-two" :disabled="disabled" v-model="formData.loadDateString"
-					:border="false" />
-
-				<!-- <uni-datetime-picker class="value-two" :disabled="disabled"
-						v-model="formData.loadDateString">{{formData.loadDateString == null ? "请选择日期" : formData.loadDateString }}</uni-datetime-picker> -->
-			</view>
-
+				</view>
 
-			<!-- <view class="box">
+				<view class="box">
 					<view class="data">
-						<text class="key">卸车吨位</text>
-						<input class="value" :disabled="disabled" type="digit" @input="checkUnLoadQty"
-							v-model="formData.unLoadQty" />
+						<text class="key">空载终点</text>
+						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
+							v-model="formData.emptyaddr2" />
 					</view>
 					<view class="data">
-						<text class="key-date">卸车时间</text>
-						<uni-datetime-picker class="value" :disabled="disabled"
-							v-model="formData.unLoadDateString">{{formData.unLoadDateString == null ? "请选择日期" : formData.unLoadDateString }}</uni-datetime-picker>
+						<text class="key">空车里程</text>
+						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
+							v-model="formData.odometerend" />
 					</view>
+				</view>
+
+				<view class="box-two">
+					<text class="key">重车里程</text>
+					<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
+						@input="checkUnLoadmile" v-model="formData.loadmile" />
 				</view> -->
+				<!-- ORDER BILLS PLANS -->
+				<!-- @change="checkboxChange" -->
+				<u-checkbox-group v-model="detour" style="margin-left: 20rpx;" placement="column">
+					<u-checkbox :customStyle="{marginBottom: '8px'}" key="1" label="行程绕路" name="行程绕路">
+					</u-checkbox>
+				</u-checkbox-group>
+				<view v-if="detour.length > 0">
+					<view class="box-two">
+						<text class="key">绕路里程</text>
+						<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled"
+							@input="checkUnDetourMile" v-model="formData.detourMile" />
+					</view>
+					<view class="box-two">
+						<text class="key">绕路原因</text>
+						<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled"
+							v-model="formData.detourDesc" />
+					</view>
+				</view>
 
-			<view class="box-two">
-				<text class="key">卸车吨位</text>
-				<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled"
-					type="digit" @input="checkUnLoadQty" v-model="formData.unLoadQty" />
-			</view>
 
-			<view class="box-two">
-				<text class="key">卸车时间</text>
 
-				<uni-datetime-picker class="value-two" :disabled="disabled" :clear-icon="false"
-					v-model="formData.unLoadDateString" :border="false" />
-				<!-- <uni-datetime-picker class="value-two" :disabled="disabled"
-						v-model="formData.unLoadDateString">{{formData.unLoadDateString == null ? "请选择日期" : formData.unLoadDateString }}</uni-datetime-picker> -->
 			</view>
-
-			<view class="box">
-				<view class="data">
-					<text class="key">空载起点</text>
-					<input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
-						v-model="formData.emptyaddr1" />
-				</view>
-				<view class="data">
-					<text class="key">空车里程</text>
-					<input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
-						type="digit" v-model="formData.odometerstart" />
+			<view class="box-box" style="margin-top: 40rpx;">
+				<view style="margin-bottom: 20rpx;">
+					<text style="color: #3c9cff;">单据拍照存档</text>
 				</view>
+				<u-upload :fileList="fileList1" accept="image" :sizeType="['compressed']" capture="camera"
+					@afterRead="imgUploading" @delete="deletePic" name="1" multiple :previewFullImage="true"
+					:disabled="disabled"></u-upload>
 			</view>
 
-			<view class="box">
-				<view class="data">
-					<text class="key">空载终点</text>
-					<input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
-						v-model="formData.emptyaddr2" />
-				</view>
-				<view class="data">
-					<text class="key">空车里程</text>
-					<input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
-						type="digit" v-model="formData.odometerend" />
+			<view class="box-box">
+				<view class="box-two">
+					<text class="key">备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</text>
+					<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled"
+						v-model="formData.driverassdesc" />
 				</view>
 			</view>
 
-			<view class="box-two">
-				<text class="key">重车里程</text>
-				<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled"
-					type="digit" @input="checkUnLoadmile" v-model="formData.loadmile" />
-			</view>
-			<view class="box-two">
-				<text class="key">备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</text>
-				<input class="value-two" selection-start="0" selection-end="9999" :disabled="disabled"
-					v-model="formData.driverassdesc" />
-			</view>
 
+			<view class="attention">
+				<!-- <text class="text-grey1">请查看</text>
+				<text @click="attention()" class="text-blue">注意事项</text> -->
+				{{this.formData.remarks}}
+			</view>
 		</view>
-		<!-- </u-collapse> -->
-		<!-- </u-collapse-item> -->
-
-		<!-- <u-collapse-item title="照片" name="img" ref="collapseHeight"> -->
-		<!-- @afterRead="imgUploading" -->
-		<view class="box-box" style="margin-top: 40rpx;">
-			<u-upload :fileList="fileList1" accept="image" :sizeType="['compressed']" capture="camera"
-				@afterRead="imgUploading" @delete="deletePic" name="1" multiple :previewFullImage="true"
-				:disabled="disabled"></u-upload>
-		</view>
-		<!-- </u-collapse-item> -->
-		<u-collapse>
-			<u-collapse-item title="订单信息" name="order information">
-				<view class="box-two textAlign">
-					<text class="key">货物名称</text>
-					<text class="value">{{formData.goodsCName == null ? "" : formData.goodsCName}}</text>
-				</view>
-				<view class="box-two textAlign">
-					<text class="key">装车地点</text>
-					<text class="value">{{formData.loadAddr == null ? "" : formData.loadAddr}}</text>
-				</view>
-				<view class="box-two textAlign">
-					<text class="key">装车厂家</text>
-					<text class="value">{{formData.loadFactory == null ? "" : formData.loadFactory}}</text>
-				</view>
-				<view class="box-two textAlign">
-					<text class="key">联系人电话</text>
-					<text
-						class="value">{{formData.loadAttn == null ? "" : formData.loadAttn}}&nbsp;{{formData.loadAttnTel == null ? "" : formData.loadAttnTel}}</text>
-				</view>
-				<view class="box-two textAlign">
-					<text class="key">卸车地点</text>
-					<text class="value">{{formData.unLoadAddr == null ? "" : formData.unLoadAddr}}</text>
-				</view>
-				<view class="box-two textAlign">
-					<text class="key">卸车厂家</text>
-					<text class="value">{{formData.unLoadFactory == null ? "" : formData.unLoadFactory}}</text>
-				</view>
-				<view class="box-two textAlign">
-					<text class="key">联系人电话</text>
-					<text
-						class="value">{{formData.unLoadAttn == null ? "" : formData.unLoadAttn}}&nbsp;{{formData.unLoadAttnTel == null ? "" : formData.unLoadAttnTel}}</text>
-				</view>
-			</u-collapse-item>
-		</u-collapse>
+		<!-- <view v-if="isTabs == '订单信息'">
+			<view class="box-two textAlign">
+				<text class="key">货物名称</text>
+				<text class="value">{{formData.goodsCName == null ? "" : formData.goodsCName}}</text>
+			</view>
+			<view class="box-two textAlign">
+				<text class="key">装车地点</text>
+				<text class="value">{{formData.loadAddr == null ? "" : formData.loadAddr}}</text>
+			</view>
+			<view class="box-two textAlign">
+				<text class="key">装车厂家</text>
+				<text class="value">{{formData.loadFactory == null ? "" : formData.loadFactory}}</text>
+			</view>
+			<view class="box-two textAlign">
+				<text class="key">联系人电话</text>
+				<text
+					class="value">{{formData.loadAttn == null ? "" : formData.loadAttn}}&nbsp;{{formData.loadAttnTel == null ? "" : formData.loadAttnTel}}</text>
+			</view>
+			<view class="box-two textAlign">
+				<text class="key">卸车地点</text>
+				<text class="value">{{formData.unLoadAddr == null ? "" : formData.unLoadAddr}}</text>
+			</view>
+			<view class="box-two textAlign">
+				<text class="key">卸车厂家</text>
+				<text class="value">{{formData.unLoadFactory == null ? "" : formData.unLoadFactory}}</text>
+			</view>
+			<view class="box-two textAlign">
+				<text class="key">联系人电话</text>
+				<text
+					class="value">{{formData.unLoadAttn == null ? "" : formData.unLoadAttn}}&nbsp;{{formData.unLoadAttnTel == null ? "" : formData.unLoadAttnTel}}</text>
+			</view>
 
-		<view class="attention">
-			<text class="text-grey1">请查看</text>
-			<text @click="attention()" class="text-blue">注意事项</text>
-		</view>
+			<view class="attention">
+				<text class="text-grey1">请查看</text>
+				<text @click="attention()" class="text-blue">注意事项</text>
+			</view>
+		</view> -->
 
 		<view class="cushion">
 		</view>
 
-		<view class="bottom" style="z-index: 4;">
-			<!-- <view style="height: 20rpx; background-color: #f0f0f0f0;"></view>
-			<view class="between vertical-layout">
-				<view class="onsubmit-script" @click="setOrderBillsPlansByid()">
-					<text v-if="status317 == 2">提交里程</text>
-					<text v-if="status317 == 6 || status317 == 0">里程信息</text>
-				</view>
-				<view class="claim-expense" @click="skipClaimExpense()">
-					<text v-if="status376 == 2 || status376 == 0">报销费用</text>
-					<text v-if="status376 == 6">查看报销</text>
-				</view>
-			</view>
-
-			<view style="height: 20rpx; background-color: #f0f0f0f0;"></view> -->
-
-
-
-			<!-- <u-row style="height: 100%; padding: 2.5% 0; margin: 0 40rpx;"> -->
-
+		<!-- <view class="bottom" style="z-index: 4;">
 			<view class="row">
-
 				<view class="button">
 					<u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="disabled"
-						@click="setOrderBillsPlansByid" text="提交里程"></u-button>
+						@click="submitShow = true" text="提交里程"></u-button>
 				</view>
-
 				<view class="button">
 					<u-button iconColor="#3c9cff" shape="circle" type="primary" @click="skipClaimExpense"
 						text="报销费用"></u-button>
 				</view>
-
 			</view>
+		</view> -->
+		<view class="bottom" style="z-index: 4;">
+			<view class="row">
+				<view class="button">
+					<u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="disabled"
+						@click="disabledClick" text="保存数据"></u-button>
+				</view>
+			</view>
+		</view>
 
-			<!-- </u-row> -->
-
-			<view>
 
+		<!-- <view class="bottom" style="z-index: 4;">
+			<view class="row">
+				<view class="button">
+					<u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="disabled"
+						@click="disabledClick" text="保存数据"></u-button>
+				</view>
+				<view class="button">
+					<u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="disabled" @click=""
+						@click="submitAudits" text="提交里程"></u-button>
+				</view>
 			</view>
+		</view> -->
 
-
-		</view>
 		<!-- 遮盖罩 -->
 		<u-loading-page :loading="loading" style="z-index: 999;"></u-loading-page>
 		<!-- 消息提示 -->
 		<u-toast ref="uToast"></u-toast>
 
 		<!-- 删除图片弹出框 -->
-
 		<u-modal :show="deleteShow" title="提示" showCancelButton @confirm="deleteImg" @cancel="deleteShow = false">
 			<view class="slot-content">
 				<rich-text nodes="确定删除这张图片吗?"></rich-text>
 			</view>
 		</u-modal>
+
+		<u-modal :show="submitShow" title="提示" showCancelButton @confirm="setOrderBillsPlansByid"
+			@cancel="submitShow = false">
+			<view class="slot-content">
+				<rich-text nodes="确定要提交里程吗?"></rich-text>
+			</view>
+		</u-modal>
 	</view>
 </template>
 
@@ -225,7 +252,9 @@
 		putOrderBillsPlansByid,
 		insertTmsAttachMngs,
 		pictureUploading,
-		deleteTmsAttachMngs
+		deleteTmsAttachMngs,
+		audit,
+		submitAudit
 	} from "@/api/particulars"
 
 	import {
@@ -234,6 +263,9 @@
 		insertLoadFeeItems,
 		getLoadFeeItems
 	} from "@/api/reimbursement"
+	import {
+		login
+	} from "../../api/login";
 	export default {
 		data() {
 			return {
@@ -246,10 +278,10 @@
 					loadDateString: '',
 					unLoadQty: '',
 					unLoadDateString: '',
-					emptyaddr1: '',
-					odometerstart: '',
-					emptyaddr2: '',
-					odometerend: '',
+					// emptyaddr1: '',
+					// odometerstart: '',
+					// emptyaddr2: '',
+					// odometerend: '',
 					loadmile: '',
 					remarks: ''
 				},
@@ -258,28 +290,31 @@
 				fileList1: [],
 				// 删除弹框
 				deleteShow: false,
+				// 提交里程弹窗
+				submitShow: false,
 				// 删除的图片
 				event: {},
 				// 输入框禁用
 				disabled: false,
 				status317: 0,
-				status376: 0
-
+				status376: 0,
+				// 当前时间的前60天
+				startDate: '',
+				tabs: [{
+					name: '装卸确认'
+				}, {
+					name: '订单信息'
+				}],
+				isTabs: '装卸确认',
+				// 绕路选项
+				detour: []
 			};
 		},
 		onLoad: function(option) {
-			this.status317 = option.status317;
-			this.status376 = option.status376;
-			getOrderBillsPlansByid(option.orderNo).then(res => {
-				this.orderNo = option.orderNo;
-				this.formData = res.data;
-				this.fileList1 = res.data.fileList1;
-				this.loading = false;
-
-				if (this.status317 == 6) {
-					this.disabled = true;
-				}
-			})
+			this.status317 = option.status;
+			this.status376 = option.status;
+			this.orderNo = option.orderNo;
+			this.getData();
 		},
 		onUnload() {
 			this.formData = {};
@@ -287,77 +322,99 @@
 			this.event = {};
 		},
 		methods: {
-			// 保存订单
-			setOrderBillsPlansByid(id) {
-				// console.log(this.status317);
-				if (this.status317 == 2) {
-
-					// if (this.formData.unLoadQty == '' || this.formData.unLoadQty == null) {
-					// 	this.$refs.uToast.show({
-					// 		type: 'warning',
-					// 		icon: false,
-					// 		message: "请输入卸车吨位!",
-					// 		iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
-					// 	})
-					// } else if (this.formData.unLoadDateString == '' || this.formData.unLoadDateString == null) {
-					// 	this.$refs.uToast.show({
-					// 		type: 'warning',
-					// 		icon: false,
-					// 		message: "请选择卸车时间!",
-					// 		iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
-					// 	})
-
-					// } else if (this.formData.loadmile == '' || this.formData.loadmile == null) {
-					// 	this.$refs.uToast.show({
-					// 		type: 'warning',
-					// 		icon: false,
-					// 		message: "请输入重车里程!",
-					// 		iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
-					// 	})
-
-
-					// } else {
-
-					if (this.formData.unLoadDateString == '' || this.formData.unLoadDateString == null) {
-						this.$refs.uToast.show({
-							type: 'warning',
-							icon: false,
-							message: "请选择卸车时间!",
-							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
-						})
+			// 查询数据
+			getData() {
+				getOrderBillsPlansByid(this.orderNo).then(res => {
+
+					res.data.loadQty == 0 ? res.data.loadQty = null : res.data.loadQty
+					res.data.unLoadQty == 0 ? res.data.unLoadQty = null : res.data.unLoadQty
+					res.data.odometerstart == 0 ? res.data.odometerstart = null : res.data.odometerstart
+					res.data.odometerend == 0 ? res.data.odometerend = null : res.data.odometerend
+					res.data.loadmile == 0 ? res.data.loadmile = null : res.data.loadmile
+
+					if (res.data.ifDetour == "T") {
+						this.detour.push("行程绕路")
+					}
 
-					} else {
+					for (let role of res.data.roleList) {
+						if (role.roleKey == 'DZ') {
+							this.disabled = true;
+						}
+					}
 
+					// 审核中
+					if (res.data.ifLoaded == "T" &&
+						res.data.ifUnLoaded == "T" &&
+						res.data.ifStarted == "S") {
+						this.disabled = true;
+					}
+					// 审核完成
+					if (res.data.ifLoaded == "T" &&
+						res.data.ifUnLoaded == "T" &&
+						res.data.ifStarted == "A") {
+						this.disabled = true;
+					}
 
-						this.formData.loadQty = this.formData.loadQty == null || this.formData.loadQty == '' ? 0 : this
-							.formData.loadQty
-						this.formData.unLoadQty = this.formData.unLoadQty == null || this.formData.unLoadQty == '' ? 0 :
-							this.formData.unLoadQty
-						this.formData.odometerstart = this.formData.odometerstart == null || this.formData.odometerstart ==
-							'' ? 0 : this.formData.odometerstart
-						this.formData.odometerend = this.formData.odometerend == null || this.formData.odometerend == '' ?
-							0 : this.formData.odometerend
-						this.formData.loadmile = this.formData.loadmile == null || this.formData.loadmile == '' ? 0 : this
-							.formData.loadmile
-
-						putOrderBillsPlansByid(this.formData).then(res => {
-							if (res.code == 200) {
-								// 保存成功弹窗提示
-								this.$refs.uToast.show({
-									type: 'success',
-									message: "保存成功!",
-									iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
-								})
-							} else {
-								// 保存失败消息
-								this.$refs.uToast.show({
-									icon: false,
-									message: "保存失败请重试!",
-									iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
-								})
-							}
-						})
+					this.formData = res.data;
+					this.fileList1 = res.data.fileList1;
+					this.loading = false;
+
+					if (this.status317 == 6) {
+						this.disabled = true;
 					}
+					this.startDate = this.GetTime(60)
+				})
+			},
+			// 切换
+			change(item) {
+				this.isTabs = item.name;
+			},
+			// 数据校验
+			dataVerify() {
+				if (this.formData.loadQty == '' || this.formData.loadQty == null || this.formData.loadQty == '0') {
+					this.$refs.uToast.show({
+						type: 'warning',
+						icon: false,
+						message: "请输入装车吨位!",
+						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
+					})
+				} else if (this.formData.loadDateString == '' || this.formData.loadDateString == null) {
+					this.$refs.uToast.show({
+						type: 'warning',
+						icon: false,
+						message: "请选择装车时间!",
+						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
+					})
+				} else if (this.formData.unLoadQty == '' || this.formData.unLoadQty == null || this.formData.unLoadQty == '0') {
+					this.$refs.uToast.show({
+						type: 'warning',
+						icon: false,
+						message: "请输入卸车吨位!",
+						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
+					})
+				} else if (this.formData.unLoadDateString == '' || this.formData.unLoadDateString == null) {
+					this.$refs.uToast.show({
+						type: 'warning',
+						icon: false,
+						message: "请选择卸车时间!",
+						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
+					})
+				} else if (this.fileList1.length < 2) {
+					return this.$refs.uToast.show({
+						type: 'warning',
+						icon: false,
+						message: "图片最少两张!",
+						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
+					})
+				} else {
+					return 'ok';
+				}
+			},
+			// 提交里程点击事件
+			disabledClick() {
+				// if (this.status317 == 2 && this.dataVerify() == 'ok') {
+				if (this.dataVerify() == 'ok') {
+					this.submitShow = true
 				} else {
 					// this.$refs.uToast.show({
 					// 	type: 'warning',
@@ -367,6 +424,48 @@
 					// })
 				}
 			},
+			// 保存订单
+			setOrderBillsPlansByid(id) {
+
+				this.formData.loadQty = this.formData.loadQty == null || this.formData.loadQty == '' ? 0 : this
+					.formData.loadQty
+				this.formData.unLoadQty = this.formData.unLoadQty == null || this.formData.unLoadQty == '' ? 0 :
+					this.formData.unLoadQty
+				this.formData.odometerstart = this.formData.odometerstart == null || this.formData.odometerstart ==
+					'' ? 0 : this.formData.odometerstart
+				this.formData.odometerend = this.formData.odometerend == null || this.formData.odometerend == '' ?
+					0 : this.formData.odometerend
+				this.formData.loadmile = this.formData.loadmile == null || this.formData.loadmile == '' ? 0 : this
+					.formData.loadmile
+
+
+
+				// 行程绕路赋值
+				if (this.detour.length > 0) {
+					this.formData.ifDetour = "T"
+				} else {
+					this.formData.ifDetour = "F"
+				}
+
+				putOrderBillsPlansByid(this.formData).then(res => {
+					this.submitShow = false
+					if (res.code == 200) {
+						// 保存成功弹窗提示
+						this.$refs.uToast.show({
+							type: 'success',
+							message: "保存成功!",
+							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
+						})
+					} else {
+						// 保存失败消息
+						this.$refs.uToast.show({
+							icon: false,
+							message: "保存失败请重试!",
+							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
+						})
+					}
+				})
+			},
 			// 点击拨打电话
 			telFun() {
 				if (this.formData.driver1mobile != null && this.formData.driver1mobile != '') {
@@ -381,6 +480,29 @@
 					})
 				}
 			},
+			// 时间计算
+			GetTime(sky) {
+				var date = new Date();
+				var base = Date.parse(date); // 转换为时间戳
+				var year = date.getFullYear(); //获取当前年份
+				var mon = date.getMonth() + 1; //获取当前月份
+				var day = date.getDate(); //获取当前日
+				var oneDay = 24 * 3600 * 1000
+
+				for (var i = 1; i < sky; i++) { //前sky天的时间
+					var now = new Date(base -= oneDay);
+					var myear = now.getFullYear();
+					var month = now.getMonth() + 1;
+					var mday = now.getDate()
+					if (i == sky - 1) {
+						var dataSky = [myear, month >= 10 ? month : '0' + month, mday >= 10 ? mday : '0' + mday]
+							.join('-')
+						return dataSky
+						// + " 00:00:00"
+					}
+				}
+
+			},
 			// 删除图片
 			deletePic(event) {
 				if (this.status317 == 6) {
@@ -448,13 +570,16 @@
 							// 获取经纬度
 							let longitude = '';
 							let latitude = '';
-							// uni.getLocation({
-							// 	type: 'wgs84',
-							// 	success: function(res) {
-							// 		console.log('当前位置的经度：' + res.longitude);
-							// 		console.log('当前位置的纬度：' + res.latitude);
-							// 	}
-							// });
+							uni.getLocation({
+								type: 'wgs84',
+								isHighAccuracy: true,
+								success: function(res) {
+									longitude = res.longitude
+									latitude = res.latitude
+									console.log('当前位置的经度：' + res.longitude);
+									console.log('当前位置的纬度：' + res.latitude);
+								}
+							});
 							let dataForm = {
 								attachId: res.data,
 								longitude: longitude,
@@ -488,10 +613,12 @@
 					"q+": Math.floor((date.getMonth() + 3) / 3), //季度 
 					"S": date.getMilliseconds() //毫秒 
 				};
-				if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
+				if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1
+					.length));
 				for (var k in o)
-					if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[
-						k]) : (("00" + o[k]).substr(("" + o[k]).length)));
+					if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ?
+						(o[
+							k]) : (("00" + o[k]).substr(("" + o[k]).length)));
 				return fmt;
 			},
 			uploadFilePromise(url) {
@@ -515,7 +642,8 @@
 			// 跳转报销费用页面
 			skipClaimExpense() {
 				uni.navigateTo({
-					url: '/pages/particulars/claimExpense/index?orderNo=' + this.orderNo + '&status376=' + this
+					url: '/pages/particulars/claimExpense/index?orderNo=' + this.orderNo + '&status376=' +
+						this
 						.status376,
 				});
 			},
@@ -551,12 +679,23 @@
 					this.formData.loadmile = e.target.value
 				})
 
+			},
+			checkUnDetourMile(e) {
+				//正则表达试
+				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
+				//重新赋值给input
+				this.$nextTick(() => {
+					this.formData.detourMile = e.target.value
+				})
+
 			}
 		}
 	}
 </script>
 
 <style lang="scss">
+	@import url("/font/iconfont.css");
+
 	// 修改布局方向为纵向布局
 	.vertical-layout {
 		display: flex;
@@ -590,22 +729,46 @@
 
 		.head-no {
 			// border-radius: 0 0 40rpx 40rpx;
-			width: 960rpx;
-			height: 100rpx;
-			padding-left: 30rpx;
+			// width: 960rpx;
+			// height: 100rpx;
+			height: 40rpx;
+			padding: 0 30rpx;
 
 			color: #fff;
 
 			vertical-align: middle;
-			display: table-cell;
+			display: flex;
+			// align-items: center;
+			align-items: flex-end;
+			
+			justify-content: space-between;
+			box-sizing: border-box;
 
 			font-size: 34rpx;
-			font-weight: 900;
+			font-weight: 700;
 
 			background-color: #3c9cff;
 
 		}
 
+		.head-no-addr {
+			// width: 960rpx;
+			height: 100rpx;
+			// padding-left: 30rpx;
+			padding: 0 30rpx;
+			vertical-align: middle;
+			color: #fff;
+			font-size: 34rpx;
+			font-weight: 700;
+
+			display: flex;
+
+			align-items: center;
+			justify-content: space-between;
+			box-sizing: border-box;
+			background-color: #3c9cff;
+		}
+
 		.head {
 			// width: 100%;
 			height: 100rpx;
@@ -719,8 +882,8 @@
 				align-items: center;
 
 				.button {
-					width: 300rpx;
-					// margin: 0 10%;
+					// width: 300rpx;
+					width: 660rpx;
 				}
 			}
 

static/font/iconfont.css

@@ -88,3 +88,6 @@
   content: "\e604";
 }
 
+.icon-icon-test:before {
+  content: "\e6fb";
+}