wangning 5 лет назад
Родитель
Сommit
db99aa04a2
1 измененных файлов с 161 добавлено и 0 удалено
  1. 161 0
      ghsApp/src/pagesPurchase/suppAdd.vue

+ 161 - 0
ghsApp/src/pagesPurchase/suppAdd.vue

@@ -0,0 +1,161 @@
+<template>
+  <div class="app-content">
+      <form @submit="formSubmit" @reset="formReset">
+        <!-- 花店名称 -->
+        <div class="module-com input-line-wrap">
+          <tui-list-cell class="line-cell" :hover="false">
+            <div class="tui-title required">花店名称</div>
+            <input
+              v-model="form.name"
+              class="tui-input"
+              placeholder="请输入花店名称"
+              maxlength="50"
+              type="text"
+              name="username"
+            />
+          </tui-list-cell>
+        
+        <!-- 手机号 -->
+        <tui-list-cell class="line-cell" :hover="false">
+            <div class="tui-title required">手机号</div>
+            <input
+              v-model="form.mobile"
+              class="tui-input"
+              placeholder="请输入手机号"
+              maxlength="50"
+              type="text"
+              name="phone"
+            />
+          </tui-list-cell>
+          <!-- 确认手机号 -->
+        <tui-list-cell class="line-cell" :hover="false">
+            <div class="tui-title required">确认手机号</div>
+            <input
+              v-model="form.confirmMobile"
+              class="tui-input"
+              placeholder="请输入确认手机号"
+              maxlength="50"
+              type="text"
+              name="requirePhone"
+            />
+          </tui-list-cell>
+          <!-- 地址 -->
+        <tui-list-cell class="line-cell" :hover="false">
+            <div class="tui-title">地址</div>
+            <input
+              v-model="form.address"
+              class="tui-input"
+              placeholder="请输入地址"
+              maxlength="50"
+              type="text"
+            />
+          </tui-list-cell>
+        </div>
+        
+        <!-- 提交 -->
+        <div class="confirm-btn">
+          <button class="admin-button-com big blue" formType="submit">确认</button>
+        </div>
+      </form>
+  </div>
+</template>
+
+<script>
+import TuiListCell from "@/components/plugin/list-cell";
+import { ghsAdd } from "@/api/ghs"
+const form = require("@/utils/formValidation.js");
+export default {
+  components: {
+    TuiListCell,
+  },
+  data() {
+    return {
+      form: {
+        mobile: '',
+        confirmMobile: '',
+        name: '',
+        address: ''
+      }
+    }
+  },
+  methods: {
+    // 表单验证
+    formSubmit(e) {
+      // 表单规则
+      let rules = [
+        {
+          name: "username",
+          rule: ["required"],
+          msg: ["请输入花店名称"]
+        },
+        {
+          name: "phone",
+          rule: ["required"],
+          msg: ["请输入手机号"]
+        },
+        {
+          name: "requirePhone",
+          rule: ["required"],
+          msg: ["请输入确认手机号"]
+        }
+      ];
+      // 进行表单检查
+      let formData = e.detail.value;
+      let checkRes = form.validation(formData, rules);
+      // 验证通过!
+      if (!checkRes) {
+        this.confirmFn();
+      } else {
+        this.$msg(checkRes);
+      }
+    },
+    confirmFn() {
+      uni.showLoading({
+        title:"加载中..."
+      })
+      ghsAdd(this.form).then(res => {
+        uni.hideLoading()
+        setTimeout(() => {
+          this.$util.pageTo(1);
+        }, 1000);
+      }).catch(err => {})
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-content {
+  min-height: calc(100vh - 20px);
+  padding-top: 20px;
+}
+.prompt-text {
+  color: $fontColor3;
+  padding-left: 30px;
+  margin-bottom: 30px;
+}
+// ---
+.module-com {
+  margin-bottom: 20px;
+  .member-wrap {
+    .member-det {
+      font-size: 24px;
+      margin-left: 20px;
+    }
+  }
+  .remark-wrap {
+    align-items: flex-start;
+    .remark {
+      height: 240px;
+    }
+  }
+}
+// 按钮
+.confirm-btn {
+  width: calc(100% - 60px);
+  margin: 60px 30px 20px;
+  .admin-button-com {
+    width: 100%;
+  }
+}
+</style>