新增供销社信息

api/cooperative/cooperative.js

@@ -1,6 +1,15 @@
 import request from '@/utils/request'
 
-// 查询合作社列表
+// 新增供销合作社
+export function addCooperative(data) {
+  return request({
+    url: '/high/server/cooperative',
+    method: 'post',
+    data: data
+  })
+}
+
+// 查询供销合作社列表
 export function getList(query) {
   return request({
     url: '/high/server/cooperative/list',
@@ -9,7 +18,7 @@ export function getList(query) {
   })
 }
 
-// 查询合作社详情
+// 查询供销合作社详情
 export function getDetails(id) {
   return request({
     url: '/high/server/cooperative/' + id,

pages.json

@@ -7,6 +7,15 @@
 			}
 		},
 		{
+			"path": "pages/cooperative/addCooperative",
+			"style": {
+				"usingComponents": {},
+				"navigationBarBackgroundColor": "#07c160",
+				"navigationBarTextStyle": "white",
+				"navigationBarTitleText": "新增供销社信息"
+			}
+		},
+		{
 			"path": "pages/cooperative/cooperative",
 			"style": {
 				"usingComponents": {},

pages/cooperative/addCooperative.vue

@@ -0,0 +1,156 @@
+<template>
+  <uni-section title="提交前请仔细核对信息，提交后不可修改！" type="line">
+    <view class="example">
+      <!-- 自定义表单校验 -->
+      <uni-forms ref="customForm" :rules="rules" :modelValue="customFormData" label-align="center">
+        <uni-forms-item label="名 称" required name="name" label-width="125" label-align="center" >
+          <uni-easyinput v-model="customFormData.name" placeholder="请输入供销社名称" />
+        </uni-forms-item>
+        <uni-forms-item label="地 址" required name="address" label-width="95" label-align="center" >
+          <uni-easyinput v-model="customFormData.address" placeholder="请输入供销社地址" />
+        </uni-forms-item>
+        <uni-forms-item label="电 话" required name="chargePhone" label-width="95" label-align="center" >
+          <uni-easyinput v-model="customFormData.chargePhone" placeholder="请输入负责人电话" />
+        </uni-forms-item>
+        <uni-forms-item label="负责人" required name="chargePeople" label-width="95" label-align="center" >
+          <uni-easyinput v-model="customFormData.chargePeople" placeholder="请输入负责人姓名" />
+        </uni-forms-item>
+        <uni-forms-item label="图 片" required name="url" label-width="95">
+          <upload :imgArr="imageList" :fileSize="1" :limit="3" @updateImg="updateImg"/>
+        </uni-forms-item>
+      </uni-forms>
+      <button type="primary" @click="submit('customForm')">提交</button>
+    </view>
+  </uni-section>
+</template>
+
+<script>
+import { addCooperative } from "@/api/cooperative/cooperative";
+import upload from '../../components/upload/index.vue'
+export default {
+  components: {
+    upload
+  },
+  data() {
+    return {
+      // 基础表单数据
+      baseFormData: {
+        name: '',
+        address:'',
+        chargePeople:'',
+        chargePhone:'',
+        imgUrl:'',
+      },
+      // 校验规则
+      rules: {
+        name: {
+          rules: [{
+            required: true,
+            errorMessage: '供销社名称不能为空'
+          }]
+        },
+        address: {
+          rules: [{
+            required: true,
+            errorMessage: '供销社地址不能为空'
+          }]
+        },
+        chargePeople: {
+          rules: [{
+            required: true,
+            errorMessage: '负责人姓名不能为空'
+          }]
+        },
+        chargePhone: {
+          rules: [
+            {
+              required: true,
+              errorMessage: '负责人电话不能为空'
+            },
+            {
+              pattern:'^1[3456789]\\d{9}$',
+              errorMessage: '负责人电话不合法'
+            }
+          ]
+        },
+        imgUrlList: {
+          rules: [{
+            required: true,
+            errorMessage: '图片不能为空'
+          }]
+        },
+      },
+      imageList: [],
+      customFormData:{}
+    }
+  },
+  onLoad() {},
+  onReady() {
+    // 设置自定义表单校验规则，必须在节点渲染完毕后执行
+    this.$refs.customForm.setRules(this.rules)
+  },
+  created() {
+
+  },
+  methods: {
+    //转换为下拉选列表
+    formatOptions(data) {
+      return data.map(item => ({
+        value: item.id,
+        text: item.productName,
+        children: item.children ? this.formatOptions(item.children) : null,
+      }));
+    },
+    submit(ref) {
+      this.$refs[ref].validate().then(res => {
+        if (res) {
+          this.customFormData.imgUrl = this.imageList.join(',')
+          addCooperative(this.customFormData).then(response => {
+            this.$modal.msgSuccess('提交成功');
+            this.customFormData = {...this.baseFormData};
+            uni.navigateTo({
+              url: '../cooperative/cooperative'
+            });
+          }).catch(err => {
+            console.log('err', err);
+          })
+        }
+      })
+    },
+    updateImg(imgList) {
+      this.imageList = imgList;
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+
+.example {
+  padding: 15px;
+  background-color: #fff;
+}
+
+.segmented-control {
+  margin-bottom: 15px;
+}
+
+.button-group {
+  margin-top: 15px;
+  display: flex;
+  justify-content: space-around;
+}
+
+.form-item {
+  display: flex;
+  align-items: center;
+}
+
+.button {
+  display: flex;
+  align-items: center;
+  height: 35px;
+  margin-left: 10px;
+}
+</style>
+

pages/cooperative/cooperative.vue

@@ -18,6 +18,8 @@
             </view>
             <em class="iconfont icon-xiangyoujiantou"></em>
         </view>
+        <uni-fab ref="fab" horizontal="right" vertical="bottom"
+                 @fabClick="handleAdd()"/>
     </view>
 </template>
 
@@ -44,6 +46,12 @@ export default {
         this.getList();
     },
     methods: {
+        /** 新增按钮操作 */
+        handleAdd(){
+            uni.navigateTo({
+                url: '../cooperative/addCooperative'
+            });
+        },
         /** 查询列表 */
         getList(type) {
             this.loading = true;