Browse Source

添加英文范围检测,修改添加文案

shaun-sheep 4 years ago
parent
commit
426bc4eccd

+ 111 - 93
src/components/business/addBrand.vue

@@ -2,17 +2,19 @@
   <el-dialog :title="brand.BrandID?'品牌修改':'添加品牌'" :visible.sync="outerVisible" class="add-brand" width="600px">
     <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-position="top" class="reset-form">
       <el-form-item label="中文名称:" prop="BrandCname">
-        <el-input v-model.trim="ruleForm.BrandCname" placeholder="请输入" />
+        <el-input v-model.trim="ruleForm.BrandCname" placeholder="请输入"/>
       </el-form-item>
-      <el-form-item label="英文名称:">
-        <el-input v-model.trim="ruleForm.BrandName" placeholder="请输入" />
+      <el-form-item label="英文名称:" prop="BrandName">
+        <el-input v-model.trim="ruleForm.BrandName" placeholder="请输入"/>
       </el-form-item>
       <el-form-item label="品牌LOGO:">
         <div class="logo">
           <el-upload style="flex: 1;" class="avatar-uploader" action="#" :http-request="uploadAndSubmit"
-            :show-file-list="false" :before-upload="beforeAvatarUpload">
+                     :show-file-list="false" :before-upload="beforeAvatarUpload">
             <i v-if="ruleForm.BrandLogo" class="el-icon-error delete-image" @click.stop="handleClickDelImg"></i>
-            <img v-if="ruleForm.BrandLogo" :src="`/image-service/common/image_get?systemId=dataPlatform&key=${ruleForm.BrandLogo}`" class="avatar">
+            <img v-if="ruleForm.BrandLogo"
+                 :src="`/image-service/common/image_get?systemId=dataPlatform&key=${ruleForm.BrandLogo}`"
+                 class="avatar">
             <i v-else class="el-icon-plus avatar-uploader-icon"></i>
           </el-upload>
           <span class="imgTip">支持格式GIF、JPG、JPEG、PNG,文件80K以内,建议尺寸80PX*80PX</span>
@@ -41,104 +43,120 @@
   </el-dialog>
 </template>
 <script>
-import { brandCreate, brandDelete, brandUpdate } from "@/api/brand"
-export default {
-  name: "addBrand",
-  props: {
-    brand: {
-      type: Object,
-      default: {}
-    }
-  },
-  data() {
-    return {
-      outerVisible: false,
-      innerVisible: false,
-      ruleForm: {
-        BrandCname: '',
-        BrandName: '',
-        BrandLogo: '',
-      },
-      rules: {
-        BrandCname: [{ required: true, message: '请输入中文名称', trigger: 'blur' }],
-      },
-      key: "",
-    }
-  },
-  methods: {
-    uploadAndSubmit(item) {// 上传图片
-      let file = item.file
-      let _this = this
-      //获取文件后缀名
-      let fileType = file.name.split('.')
-      let type = fileType[fileType.length -1]
-      this.key = `${file.uid}.${type}`
+  import {brandCreate, brandDelete, brandUpdate} from "@/api/brand"
 
-      let reader = new FileReader();
-      reader.onloadend = function () {
-        // 这个事件在读取结束后,无论成功或者失败都会触发
-        if (reader.error) {
+  export default {
+    name: "addBrand",
+    props: {
+      brand: {
+        type: Object,
+        default: {}
+      }
+    },
+    data() {
+      let checkEn = (rule, value, callback) => {
+        if (value === '') {
+          callback()
         } else {
-          var xhr = new XMLHttpRequest();
-          xhr.open(
-            "POST",
-            `/image-service/common/image_upload?systemId=dataPlatform&secret=9e0891a7a8c8e885&overwrite=true&key=${_this.key}`
-          );
-          xhr.send(reader.result);
-          xhr.onreadystatechange = function () {
-            if (xhr.readyState == 4) {
-              if (xhr.status == 200) {
-                _this.ruleForm.BrandLogo = _this.key
-              }
-            }
-          };
+          if (/.*[\u4e00-\u9fa5]+.*$/.test(value)) {
+            callback(new Error('请输入英文字符'))
+          } else {
+            callback()
+          }
         }
       };
-      reader.readAsArrayBuffer(file);
-    },
-    beforeAvatarUpload(file) {
-      const typeList = ['image/jpeg','image/png','image/gif']
-      const isType = typeList.some(item => {return item === file.type});
-      const isLt80K = file.size / 1024 <= 80;
-      if (!isType) {
-        this.$message.error('上传头像图片格式不支持!')
-        return false
-      }
-      if (!isLt80K) {
-        this.$message.error('上传头像图片大小不能超过 80K!')
-        return false
+      return {
+        outerVisible: false,
+        innerVisible: false,
+        ruleForm: {
+          BrandCname: '',
+          BrandName: '',
+          BrandLogo: '',
+        },
+        rules: {
+          BrandCname: [{required: true, message: '请输入中文名称', trigger: 'blur'}],
+          BrandName: [{validator: checkEn, trigger: 'blur'}],
+        },
+        key: "",
       }
-      return isType && isLt80K;
     },
-    handleClickDelImg() {
-      this.ruleForm.BrandLogo = ""
-    },
-    submitForm(formName) { //(添加/修改)
-      this.$refs[formName].validate((valid) => {
-        if (valid) {
-          let params = {
-            Content: [{
-              BrandCname: this.ruleForm.BrandCname,
-              BrandName: this.ruleForm.BrandName,
-              BrandLogo: this.ruleForm.BrandLogo,
-            }]
+    methods: {
+      uploadAndSubmit(item) {// 上传图片
+        let file = item.file
+        let _this = this
+        //获取文件后缀名
+        let fileType = file.name.split('.')
+        let type = fileType[fileType.length - 1]
+        this.key = `${file.uid}.${type}`
+
+        let reader = new FileReader();
+        reader.onloadend = function () {
+          // 这个事件在读取结束后,无论成功或者失败都会触发
+          if (reader.error) {
+          } else {
+            var xhr = new XMLHttpRequest();
+            xhr.open(
+              "POST",
+              `/image-service/common/image_upload?systemId=dataPlatform&secret=9e0891a7a8c8e885&overwrite=true&key=${_this.key}`
+            );
+            xhr.send(reader.result);
+            xhr.onreadystatechange = function () {
+              if (xhr.readyState == 4) {
+                if (xhr.status == 200) {
+                  _this.ruleForm.BrandLogo = _this.key
+                }
+              }
+            };
           }
-          if (this.brand.BrandID) { //修改品牌
-            params.Content[0].BrandID = this.brand.BrandID
-            brandUpdate(params, res => {
-              this.outerVisible = false
-              this.$emit("refresh")
-              this.$message.success('保存成功!')
-            })
-          } else { //添加品牌
-            brandCreate(params, res => {
-              this.outerVisible = false
-              this.ruleForm = { BrandCname: '', BrandName: '', BrandLogo: '' }
-              this.$emit("refresh",res.EntityList)
-              this.$message.success('添加成功!')
+        };
+        reader.readAsArrayBuffer(file);
+      },
+      beforeAvatarUpload(file) {
+        const typeList = ['image/jpeg', 'image/png', 'image/gif']
+        const isType = typeList.some(item => {
+          return item === file.type
+        });
+        const isLt80K = file.size / 1024 <= 80;
+        if (!isType) {
+          this.$message.error('上传头像图片格式不支持!')
+          return false
+        }
+        if (!isLt80K) {
+          this.$message.error('上传头像图片大小不能超过 80K!')
+          return false
+        }
+        return isType && isLt80K;
+      },
+      handleClickDelImg() {
+        this.ruleForm.BrandLogo = ""
+      },
+      submitForm(formName) { //(添加/修改)
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            let params = {
+              Content: [{
+                BrandCname: this.ruleForm.BrandCname,
+                BrandName: this.ruleForm.BrandName,
+                BrandLogo: this.ruleForm.BrandLogo,
+              }]
+            }
+            if (this.brand.BrandID) { //修改品牌
+              params.Content[0].BrandID = this.brand.BrandID
+              brandUpdate(params, res => {
+                this.outerVisible = false
+                this.$emit("refresh")
+                this.$message.success('保存成功!')
+              })
+            } else { //添加品牌
+              brandCreate(params, res => {
+                this.outerVisible = false
+                this.ruleForm = {BrandCname: '', BrandName: '', BrandLogo: ''}
+                this.$emit("refresh", res.EntityList)
+                this.$message.success('添加成功!')
             })
           }
         } else {
+
           console.log('error submit!!')
           return false
         }

+ 2 - 2
src/components/supplement/supplementTool.vue

@@ -4,8 +4,8 @@
       <p class="supplement-title"><i class="iconfont iconjuxing" style="color:#3A8DDE;"></i>添加产品</p>
       <span class="fr">
       <el-button @click="handleClickCancel">取消</el-button>
-      <el-button type="primary" @click="addProduct">{{isUpdate?'保存':'创建'}}</el-button>
-      <el-button v-show="!isUpdate" type="primary" @click="resetForm">创建并继续</el-button>
+      <el-button v-show="!isUpdate" type="primary" @click="resetForm">完成并创建下一个</el-button>
+      <el-button type="primary" @click="addProduct">{{isUpdate?'保存':'完成'}}</el-button>
       </span>
     </div>
   </div>

+ 4 - 0
src/framework/layout/PageHeader.vue

@@ -51,6 +51,10 @@ export default {
 		...mapMutations('layout', ['setSidebarSelected']),
 		handleSelect(index, indexPath) {
 			this.setSidebarSelected(index)
+      // if(index == '/supplement') {
+        // this.$message.info('产品设计中。。。')
+        // return false
+      // }
 		},
 		toIndex() {
 			this.$router.push('/index')

+ 1 - 5
src/views/supplement/index.vue

@@ -6,11 +6,7 @@
 </template>
 
 <script>
-  // window.onbeforeunload=function(e){
-  //   console.log(this.$route,'route')
-  //   // var e = window.event||e;
-  //   // e.returnValue=("确定离开当前页面吗?");
-  // }
+
   import supplementTool from "@/components/supplement/supplementTool";
   import sagaSupplement from "@/components/supplement/sagaSupplement";