zx_bms_uni/myPages/pages/searchUser/searchUser.vue

<template>
    <view class="container">
        <form @submit="searchUserInfo">
            <view class="search-form flex-row flex-start">
                <input name="phone" class="input" :placeholder="$t('手机号码')" />
                <button form-type="submit" size="mini" type="primary" class="button">{{$t('搜索')}}</button>
            </view>
        </form>

        <view v-if="userInfo" class="result-form">
            <view class="form-item">
                <view class="form-label">{{$t('用户ID')}}</view>
                <view class="form-value">{{ userInfo.user_id }}</view>
            </view>
            <view class="form-item">
                <view class="form-label">{{$t('用户所属总店')}}</view>
                <view class="form-value">{{ userInfo.shop_name }}</view>
            </view>
            <view class="form-item">
                <view class="form-label">{{$t('用户名')}}</view>
                <view class="form-value">{{ userInfo.user_name }}</view>
            </view>
            <view class="form-item">
                <view class="form-label">{{$t('手机')}}</view>
                <view class="form-value">{{ userInfo.phone }}</view>
            </view>
            <view class="form-item no-border">
                <view class="form-label">{{$t('微信昵称')}}</view>
                <view class="form-value">{{ userInfo.nickname }}</view>
            </view>
        </view>

        <view v-if="userInfo" class="check-btn">
            <button type="warn" plain @tap="bindCheck">{{$t('确定')}}</button>
        </view>
    </view>
</template>

<script>
// myPages/pages/searchUser/searchUser.js
var config = require('../../../common/config.js');
var http = require('../../../common/http.js');
var common = require('../../../common/common.js');
var storage = require('../../../common/storage.js');
export default {
    data() {
        return {
            userInfo: null
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
		uni.setNavigationBarTitle({
			title: this.$t('搜索用户')
		});
	},
    methods: {
        searchUserInfo: function (e) {
            const phone = e.detail.value.phone;
            if (common.isEmpty(phone)) {
                common.simpleToast(this,this.$t('请输入手机号码'));
                return;
            }
            const that = this;
            http.postApi(
                config.API_CLIENT_GET_BY_PHONE,
                {
                    phone: phone
                },
                function (resp) {
                    if (resp.data.code === 200) {
                        that.setData({
                            userInfo: resp.data.data.userInfo
                        });
                    } else {
                        common.simpleToast(that,resp.data.msg);
                    }
                }
            );
        },

        bindCheck: function () {
            storage.setSearchClientUserInfo(this.userInfo);
            uni.navigateBack({
                delta: 1
            });
        }
    }
};
</script>
<style>
@import './searchUser.css';
</style>