解决运单编号输入过长和分页没加bug

.eslintignore

-/build/
-/config/
-/dist/
-/node_modules/
-/*.js

.eslintrc.js

-// https://eslint.org/docs/user-guide/configuring
-
-module.exports = {
-  root: true,
-  parserOptions: {
-    parser: 'babel-eslint'
-  },
-  env: {
-    browser: true,
-  },
-  extends: [
-    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
-    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
-    'plugin:vue/essential',
-    // https://github.com/standard/standard/blob/master/docs/RULES-en.md
-    'standard'
-  ],
-  // required to lint *.vue files
-  plugins: [
-    'vue'
-  ],
-  // add your custom rules here
-  rules: {
-    // ----------------------------------------------------静态检测----------------------------------------------------------
-    /**
-     * 静态检测：
-     * 以下基本位能够帮助发现代码错误的规则
-     * */
-    // 禁止与负零进行比较
-    'no-compare-neg-zero': 'error',
-    // 禁止将常量作为 if 或三元表达式的测试条件，比如 if (true), let foo = 0 ? 'foo' : 'bar'
-    'no-constant-condition': [
-      'error',
-      {
-        checkLoops: false
-      }
-    ],
-    // 禁止在函数参数中出现重复名称的参数 【辅助检测】
-    'no-dupe-args': 'error',
-    // 禁止在对象字面量中出现重复名称的键名 【辅助检测】
-    'no-dupe-keys': 'error',
-    // 禁止出现空代码块  【可读性差】
-    'no-empty': [
-      'error',
-      {
-        allowEmptyCatch: true
-      }
-    ],
-    // 禁止将 catch 的第一个参数 error 重新赋值  【重新赋值，error将没有意义】
-    'no-ex-assign': 'error',
-    // @fixable 禁止函数表达式中出现多余的括号，比如 let foo = (function () { return 1 })  【一般不会这么写，可读性差】
-    'no-extra-parens': ['error', 'functions'],
-    // 禁止将一个函数申明重新赋值，如：
-    // function foo() {}
-    // foo = bar   [静态检测：无意义]
-    'no-func-assign': 'error',
-    // 禁止在 if 内出现函数申明或使用 var 定义变量 [eg: if(var i=0;i<10;i++)]
-    'no-inner-declarations': ['error', 'both'],
-    // 禁止使用特殊空白符（比如全角空格），除非是出现在字符串、正则表达式或模版字符串中
-    'no-irregular-whitespace': [
-      'error',
-      {
-        skipStrings: true,
-        skipComments: false,
-        skipRegExps: true,
-        skipTemplates: true
-      }
-    ],
-    // typeof 表达式比较的对象必须是 'undefined', 'object', 'boolean', 'number', 'string', 'function' 或 'symbol'
-    'valid-typeof': 'error',
-    // ----------------------------------------------------最佳实践----------------------------------------------------------
-    //
-    //
-    // 最佳实践
-    // 这些规则通过一些最佳实践帮助你避免问题
-    //
-    // 禁止函数的循环复杂度超过 20，【https://en.wikipedia.org/wiki/Cyclomatic_complexity】
-    'complexity': [
-      'error',
-      {
-        max: 20
-      }
-    ],
-    // 不允许有空函数，除非是将一个空函数设置为某个项的默认值  【否则空函数并没有实际意义】
-    'no-empty-function': [
-      'error',
-      {
-        allow: [
-          'functions',
-          'arrowFunctions'
-        ]
-      }
-    ],
-    // 禁止修改原生对象   【例如 Array.protype.xxx=funcion(){}，很容易出问题，比如for in 循环数组 会出问题】
-    'no-extend-native': 'error',
-    // @fixable 表示小数时，禁止省略 0，比如 .5  【可读性】
-    'no-floating-decimal': 'error',
-    // 禁止直接 new 一个类而不赋值 【 那么除了占用内存还有什么意义呢？ @off vue语法糖大量存在此类语义 先手动关闭】
-    'no-new': 'off',
-    // 禁止使用 new Function，比如 let x = new Function("a", "b", "return a + b"); 【可读性差】
-    'no-new-func': 'error',
-    // 禁止将自己赋值给自己    [规则帮助检测]
-    'no-self-assign': 'error',
-    // 禁止将自己与自己比较 [规则帮助检测]
-    'no-self-compare': 'error',
-    // @fixable 立即执行的函数必须符合如下格式 (function () { alert('Hello') })() 【立即函数写法很多，这个是最易读最标准的】
-    'wrap-iife': [
-      'error',
-      'inside',
-      {
-        functionPrototypeMethods: true
-      }
-    ],
-    // 禁止使用保留字作为变量名 [规则帮助检测保留字，通常ide难以发现，生产会出现问题]
-    'no-shadow-restricted-names': 'error',
-    // 禁止使用未定义的变量
-    'no-undef': [
-      'error',
-      {
-        typeof: false
-      }
-    ],
-    // 定义过的变量必须使用   【正规应该是这样的，具体可以大家讨论】
-    'no-unused-vars': [
-      'error',
-      {
-        vars: 'all',
-        args: 'none',
-        caughtErrors: 'none',
-        ignoreRestSiblings: true
-      }
-    ],
-    // 变量必须先定义后使用   【ps:涉及到es6存在不允许变量提升的问题，以免引起意想不到的错误，具体可以大家讨论】
-    'no-use-before-define': [
-      'error',
-      {
-        functions: false,
-        classes: false,
-        variables: false
-      }
-    ],
-    // ----------------------------------------------------代码规范----------------------------------------------------------
-    /**
-     * 代码规范
-     * 有关【空格】、【链式换行】、【缩进】、【=、{}、（）、首位空格】规范没有添加，怕大家一时间接受不了，目前所挑选的规则都是：保障我们的代码可读性、可维护性的
-     * */
-    // 变量名必须是 camelcase 风格的
-    // @off 【涉及到 很多 api 或文件名可能都不是 camelcase 先关闭】
-    'camelcase': 'off',
-    // @fixable 禁止在行首写逗号
-    'comma-style': ['error', 'last'],
-    // @fixable 一个缩进必须用两个空格替代
-    // @off 【不限制大家，为了关闭eslint默认值，所以手动关闭，off不可去掉】
-    'indent': 'off',
-    //@off 手动关闭//前面需要回车的规则
-    'spaced-comment': 'off',
-    //@off 手动关闭: 大括号前不允许回车
-    'no-trailing-spaces': 'off',
-    //@off 手动关闭: 不允许多行回车
-    'no-multiple-empty-lines': 'off',
-    //@off 手动关闭: 逗号钱必须加空格
-    'comma-spacing': 'off',
-    //@off 手动关闭: 冒号后必须加空格
-    'key-spacing': 'off',
-    // @fixable 结尾禁止使用分号
-    //@off [vue官方推荐无分号,不知道大家是否可以接受？先手动off掉]
-    //    "semi": [2,"never"],
-    "semi": 'off',
-    // 代码块嵌套的深度禁止超过 5 层
-    'max-depth': ['error', 5],
-    // 回调函数嵌套禁止超过 4 层，多了请用 async await 替代
-    'max-nested-callbacks': ['error', 4],
-    // 函数的参数禁止超过 7 个
-    'max-params': ['error', 7],
-    // new 后面的类名必须首字母大写  【面向对象编程原则】
-    'new-cap': [
-      'error',
-      {
-        newIsCap: true,
-        capIsNew: false,
-        properties: true
-      }
-    ],
-    // @fixable new 后面的类必须有小括号  【没有小括号、指针指过去没有意义】
-    'new-parens': 'error',
-    // @fixable 禁止属性前有空格，比如 foo. bar() 【可读性太差，一般也没人这么写】
-    'no-whitespace-before-property': 'error',
-    // @fixable 禁止 if 后面不加大括号而写两行代码   eg: if(a>b) a=0  b=0
-    'nonblock-statement-body-position': ['error', 'beside', { overrides: { while: 'below' } }],
-    //    禁止变量申明时用逗号一次申明多个 eg: let a,b,c,d,e,f,g = []   【debug并不好审查、并且没办法单独写注释】
-    'one-var': ['error', 'never'],
-    // @fixable 【变量申明必须每行一个，同上】
-    'one-var-declaration-per-line': ['error', 'always'],
-    // ----------------------------------------------------ECMAScript 6----------------------------------------------------------
-    /**
-     * ECMAScript 6
-     * 这些规则与 ES6 有关 【请大家 尝试使用正确使用const和let代替var，以后大家熟悉之后可能会提升规则】
-     * */
-    // 禁止对定义过的 class 重新赋值
-    'no-class-assign': 'error',
-    // @fixable 禁止出现难以理解的箭头函数，比如 let x = a => 1 ? 2 : 3
-    'no-confusing-arrow': ['error', { allowParens: true }],
-    // 禁止对使用 const 定义的常量重新赋值
-    'no-const-assign': 'error',
-    // 禁止重复定义类
-    'no-dupe-class-members': 'error',
-    // 禁止重复 import 模块
-    'no-duplicate-imports': 'error',
-    //@off 以后可能会开启 禁止 var
-    'no-var': 'off',
-    //  ---------------------------------被关闭的规则-----------------------
-    'radix': 'off',
-    'quotes': 'off',
-    'space-before-function-paren': [0, "always"],
-    'space-in-parens': [0, "never"],
-    "space-after-keywords": [0, "always"],
-    "func-call-spacing": [0, "never"]
-  }
-}

package.json

@@ -33,7 +33,6 @@
     "autoprefixer": "^7.1.2",
     "babel-cli": "^6.26.0",
     "babel-core": "^6.22.1",
-    "babel-eslint": "^9.0.0",
     "babel-helper-vue-jsx-merge-props": "^2.0.3",
     "babel-loader": "^7.1.1",
     "babel-plugin-syntax-jsx": "^6.18.0",
@@ -46,15 +45,6 @@
     "copy-webpack-plugin": "^4.0.1",
     "css-loader": "^0.28.0",
     "element-theme-chalk": "^2.4.1",
-    "eslint": "^5.6.0",
-    "eslint-config-standard": "^12.0.0",
-    "eslint-friendly-formatter": "^4.0.1",
-    "eslint-loader": "^2.1.1",
-    "eslint-plugin-import": "^2.14.0",
-    "eslint-plugin-node": "^7.0.1",
-    "eslint-plugin-promise": "^4.0.1",
-    "eslint-plugin-standard": "^4.0.0",
-    "eslint-plugin-vue": "^4.7.1",
     "extract-text-webpack-plugin": "^3.0.0",
     "file-loader": "^1.1.4",
     "friendly-errors-webpack-plugin": "^1.6.1",

src/views/mall/common/card-temp.vue

@@ -5,7 +5,7 @@
     <el-input :disabled="disabled" v-model="listParams.searchParam" class="w200" clearable placeholder="请输入卡券名称" @change="getCardList"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
     <span class="fz12 gray pl20">领取限制 < 100的卡券不支持选择，系统已自动过滤</span>
   </div>
-  <el-table tooltipEffect="light" :data="tableList" :height="tableHeight" style="width: 100%" v-loading="loading" @row-click="chooseCard">
+  <el-table tooltipEffect="light" :data="tableList"  style="width: 100%" v-loading="loading" @row-click="chooseCard">
     <el-table-column  :show-overflow-tooltip="false" width="60" align="center" prop="coupCardId">
         <template slot-scope="scope">
           <div class="sms-record_left label-hidden">
@@ -19,7 +19,7 @@
     <el-table-column :show-overflow-tooltip="false" align="left"  prop="cardLimit" label="兑换限制"></el-table-column>
     <el-table-column :show-overflow-tooltip="false" align="left"  prop="couponStock" label="库存"></el-table-column>
   </el-table>
-  <el-pagination v-show="tableList.length && showPagination" background class="dm-pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="listParams.currentPage" :page-sizes="[10, 20, 30, 40]" :page-size="listParams.pageSize" layout="total, prev, pager, next" :total="total"></el-pagination>
+  <el-pagination  background class="dm-pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="listParams.currentPage" :page-sizes="[10, 20, 30, 40]" :page-size="listParams.pageSize" layout="total, prev, pager, next" :total="total"></el-pagination>
 </section>
 </template>
 

src/views/mall/goods/send-goods.vue

@@ -8,7 +8,7 @@
             <el-option v-for="v in logisticsOptions" :key="v.logisticsCompanyCode" :label="v.logisticsCompanyName" :value="v.logisticsCompanyId"></el-option>
           </el-select>
        </p>
-      <p>运单号码：<el-input class="vertical-middle w300" v-model="params.courierNumber" placeholder="请输入快递单号"></el-input></p>
+      <p>运单号码：<el-input class="vertical-middle w300" v-model="params.courierNumber" placeholder="请输入快递单号"  @input="(value)=>courierNumberLimit(value)"></el-input></p>
     </div>
     <span slot="footer" class="dialog-footer">
       <el-button @click="close">关 闭</el-button>
@@ -87,6 +87,24 @@ import {getLogisticsInfo,getLogisticsList,orderOptService} from '@/service/api/m
           }
         });
       },
+      // 限制运单编号(不管中英文都是32位)
+      courierNumberLimit(value){
+        this.$nextTick(() => {
+          this.params.courierNumber = this.getInputVal(value,32)
+        })
+      },
+      //限制字数
+      getInputVal(val, max) {
+        var returnValue = '';
+        var byteValLen = 0;
+        for (var i = 0; i < val.length; i++) {
+            byteValLen += 1;
+            if (byteValLen > max)
+            break;
+            returnValue += val[i];
+        }
+        return returnValue;
+      },
       async getLogisticsList() {
         let res = await getLogisticsList();
         if (res.errorCode === 0) {

static/css/common.css

@@ -297,3 +297,12 @@ a:hover{
   color: #a3adb6;
   margin:14px 0;
 }
+/*去掉input数字框默认的上下三角*/
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none !important;
+  margin: 0; 
+}
+input[type="number"] {
+  -moz-appearance: textfield;
+}