<template> <view class="container"> <view class="example"> <uni-forms ref="form" :model="form" labelWidth="80px"> <uni-forms-item label="起始站" name="startStation" required > <uni-easyinput v-model="form.startStation" placeholder="请输入起始站" /> </uni-forms-item> <uni-forms-item label="终点站" name="endStation" required > <uni-easyinput v-model="form.endStation" placeholder="请输入终点站" /> </uni-forms-item> <uni-forms-item label="途径站" name="intermediateStations" > <uni-easyinput type="textarea" v-model="form.intermediateStations" placeholder="请输入途径站" /> </uni-forms-item> <uni-forms-item label="起始站的线" name="startStationLine" > <uni-data-select v-model="form.startStationLine" :localdata="routeOptions"></uni-data-select> </uni-forms-item> <uni-forms-item label="终点站的线" name="endStationLine" > <uni-data-select v-model="form.endStationLine" :localdata="routeOptions"></uni-data-select> </uni-forms-item> <uni-forms-item label="途径站点" name="distNumber" > <uni-easyinput v-model="form.distNumber" placeholder="请输入途径站点" /> </uni-forms-item> <uni-forms-item label="票价" name="price" > <uni-easyinput v-model="form.price" placeholder="请输入票价" /> </uni-forms-item> </uni-forms> <view class="button-group"> <button type="default" style="padding:0 3em;font-size:14px" class="button" @click="reset">重置</button> <button type="primary" style="padding:0 3em;font-size:14px" class="button" @click="submit">提交</button> </view> </view> </view> </template> <script> import { addBeijingsubway,getBeijingsubway,listBeijingsubway } from "@/api/system/beijingsubway"; export default { components: { }, data() { return { //字典类型筛选options routeOptions:[], routeOptions:[], form: {}, rules: { startStation: { rules: [{ required: true, errorMessage: "起始站不能为空" }] }, endStation: { rules: [{ required: true, errorMessage: "终点站不能为空" }] }, } } }, onLoad(option) { //字典类型查询 this.$dataDicts.getDicts("route").then(response => { this.routeOptions = this.$myUtils.getDictOption(response.data,'dictValue','dictLabel'); }); this.$dataDicts.getDicts("route").then(response => { this.routeOptions = this.$myUtils.getDictOption(response.data,'dictValue','dictLabel'); }); }, onReady() { this.$refs.form.setRules(this.rules) }, methods: { /* 提交*/ submit() { console.log(this.form) this.$refs.form.validate().then(res => { addBeijingsubway(this.form).then(response => { this.$modal.msgSuccess("新增成功") setTimeout(() => { // 返回到上一级父页面 this.$tab.navigateBack(); },500) }) }) }, /* 表单重置*/ reset(){ this.form = { id: undefined, startStation: undefined, endStation: undefined, intermediateStations: undefined, startStationLine: undefined, endStationLine: undefined, distNumber: undefined, price: undefined }; } } } </script> <style lang="scss"> page { background-color: #ffffff; } .example { padding: 15px; background-color: #fff; } .button-group { margin-top: 15px; display: flex; justify-content: space-around; } </style>
<template> <view class="container"> <view class="example"> <uni-forms ref="form" :model="form" labelWidth="80px"> <uni-forms-item label="起始站" name="startStation" required > <uni-easyinput v-model="form.startStation" placeholder="请输入起始站" /> </uni-forms-item> <uni-forms-item label="终点站" name="endStation" required > <uni-easyinput v-model="form.endStation" placeholder="请输入终点站" /> </uni-forms-item> <uni-forms-item label="途径站" name="intermediateStations" > <uni-easyinput type="textarea" v-model="form.intermediateStations" placeholder="请输入途径站" /> </uni-forms-item> <uni-forms-item label="起始站的线" name="startStationLine" > <uni-data-select v-model="form.startStationLine" :localdata="routeOptions" ></uni-data-select> </uni-forms-item> <uni-forms-item label="终点站的线" name="endStationLine" > <uni-data-select v-model="form.endStationLine" :localdata="routeOptions" ></uni-data-select> </uni-forms-item> <uni-forms-item label="途径站点" name="distNumber" > <uni-easyinput v-model="form.distNumber" placeholder="请输入途径站点" /> </uni-forms-item> <uni-forms-item label="票价" name="price" > <uni-easyinput v-model="form.price" placeholder="请输入票价" /> </uni-forms-item> </uni-forms> <view class="button-group"> <button type="default" style="padding:0 3em;font-size:14px" class="button" @click="cancel">取消</button> <button type="primary" style="padding:0 3em;font-size:14px" class="button" @click="submit">提交</button> </view> </view> </view> </template> <script> import { updateBeijingsubway,getBeijingsubway,listBeijingsubway } from "@/api/system/beijingsubway"; export default { components: { }, data() { return { //字典类型筛选options routeOptions:[], routeOptions:[], form: {}, rules: { startStation: { rules: [{ required: true, errorMessage: "起始站不能为空" }] }, endStation: { rules: [{ required: true, errorMessage: "终点站不能为空" }] }, } } }, onLoad(option) { //字典类型查询 this.$dataDicts.getDicts("route").then(response => { this.routeOptions = this.$myUtils.getDictOption(response.data,'dictValue','dictLabel'); }); this.$dataDicts.getDicts("route").then(response => { this.routeOptions = this.$myUtils.getDictOption(response.data,'dictValue','dictLabel'); }); //起点—终点查询详细 this.getBeijingsubwayInfo(option.id); }, onReady() { this.$refs.form.setRules(this.rules) }, methods: { /* 获取起点—终点查询详情*/ getBeijingsubwayInfo(id) { getBeijingsubway(id).then(response => { this.form = response.data; }) }, /* 提交*/ submit() { this.$refs.form.validate().then(res => { updateBeijingsubway(this.form).then(response => { this.$modal.msgSuccess("编辑成功") setTimeout(() => { // 返回到上一级父页面 this.$tab.navigateBack(); },500) }) }) }, /* 表单重置*/ /* 取消*/ cancel(){ this.$tab.navigateBack(); } } } </script> <style lang="scss"> page { background-color: #ffffff; } .example { padding: 15px; background-color: #fff; } .button-group { margin-top: 15px; display: flex; justify-content: space-around; } </style>