|
|
@@ -5,26 +5,16 @@
|
|
|
</CusNavigation>
|
|
|
|
|
|
<div class="mains">
|
|
|
- <div class="title">对接数据</div>
|
|
|
+ <div class="title">医院配置</div>
|
|
|
<div class="form">
|
|
|
<van-form @submit="onSubmit">
|
|
|
<van-cell-group inset>
|
|
|
<van-cell>
|
|
|
<van-field
|
|
|
- v-model="formData.localAddress"
|
|
|
- name="localAddress"
|
|
|
- label="对接地址"
|
|
|
- placeholder="请输入对接地址"
|
|
|
- :rules="[{ required: true, message: '请填写对接地址' }]"
|
|
|
- />
|
|
|
- </van-cell>
|
|
|
- <van-cell>
|
|
|
- <van-field
|
|
|
- v-model="formData.localPort"
|
|
|
- name="localPort"
|
|
|
- label="对接端口"
|
|
|
- placeholder="请填写对接端口"
|
|
|
- :rules="[{ required: true, message: '请填写对接端口' }]"
|
|
|
+ v-model="formData.deviceSecret"
|
|
|
+ name="deviceSecret"
|
|
|
+ label="密钥"
|
|
|
+ placeholder="请填写密钥配置"
|
|
|
/>
|
|
|
</van-cell>
|
|
|
</van-cell-group>
|
|
|
@@ -35,10 +25,58 @@
|
|
|
</div>
|
|
|
</van-form>
|
|
|
</div>
|
|
|
+ <!-- 对接配置 -->
|
|
|
+ <div class="title">
|
|
|
+ 对接配置
|
|
|
+ <div>
|
|
|
+ <a @click="handleAdd('address')" style="margin-left: 20px"
|
|
|
+ >添加配置</a
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="form">
|
|
|
+ <div
|
|
|
+ class="wifi-info"
|
|
|
+ style=""
|
|
|
+ v-for="(item, index) in addressDatas"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <van-icon
|
|
|
+ class-prefix="iconfont"
|
|
|
+ :name="item.networkType"
|
|
|
+ :size="46"
|
|
|
+ />
|
|
|
+ <van-cell
|
|
|
+ :title="item.address"
|
|
|
+ :label="item.port"
|
|
|
+ style="margin: 0.625rem 0 0 1rem"
|
|
|
+ >
|
|
|
+ <van-button
|
|
|
+ plain
|
|
|
+ hairline
|
|
|
+ size="small"
|
|
|
+ text="编辑"
|
|
|
+ @click="handleEdit('address', item)"
|
|
|
+ type="primary"
|
|
|
+ />
|
|
|
+ <van-button
|
|
|
+ size="small"
|
|
|
+ plain
|
|
|
+ hairline
|
|
|
+ text="删除"
|
|
|
+ type="danger"
|
|
|
+ @click="handleDel(item, 'address')"
|
|
|
+ class="delete-button"
|
|
|
+ />
|
|
|
+ </van-cell>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- WIFI配置块 -->
|
|
|
<div class="title">
|
|
|
WIFI配置
|
|
|
<div>
|
|
|
- <a @click="handleAdd" style="margin-left: 20px">添加网络</a>
|
|
|
+ <a @click="handleAdd('wifi')" style="margin-left: 20px">添加网络</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="form">
|
|
|
@@ -59,7 +97,7 @@
|
|
|
hairline
|
|
|
size="small"
|
|
|
text="编辑"
|
|
|
- @click="handleEdit(item)"
|
|
|
+ @click="handleEdit('wifi', item)"
|
|
|
type="primary"
|
|
|
/>
|
|
|
<van-button
|
|
|
@@ -68,7 +106,7 @@
|
|
|
hairline
|
|
|
text="删除"
|
|
|
type="danger"
|
|
|
- @click="handleDel(item)"
|
|
|
+ @click="handleDel(item, 'wifi')"
|
|
|
class="delete-button"
|
|
|
/>
|
|
|
</van-cell>
|
|
|
@@ -83,6 +121,7 @@
|
|
|
<van-back-top target=".container" right="5vw" bottom="80px" />
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- wifi配置信息 -->
|
|
|
<van-action-sheet v-model:show="wifiAction" :title="wifiTitle">
|
|
|
<div class="form">
|
|
|
<van-form @submit="onWifiSubmit">
|
|
|
@@ -93,7 +132,10 @@
|
|
|
name="name"
|
|
|
label="名称"
|
|
|
placeholder="请输入WIFI名称"
|
|
|
- :rules="[{ required: true, message: '请输入WIFI名称' }]"
|
|
|
+ :rules="[
|
|
|
+ { required: true, message: '请输入WIFI名称' },
|
|
|
+ { validator: validator8, message: 'WIFI名称不得大于8位' },
|
|
|
+ ]"
|
|
|
/>
|
|
|
</van-cell>
|
|
|
<van-cell>
|
|
|
@@ -102,7 +144,57 @@
|
|
|
name="password"
|
|
|
label="密码"
|
|
|
placeholder="请填写WIFI密码"
|
|
|
- :rules="[{ validator, message: 'WIFI密码不得于8位' }]"
|
|
|
+ :rules="[
|
|
|
+ { validator: validator20, message: 'WIFI密码不得大于20位' },
|
|
|
+ ]"
|
|
|
+ />
|
|
|
+ </van-cell>
|
|
|
+ </van-cell-group>
|
|
|
+ <div style="margin: 0.25rem 10%; width: 80%">
|
|
|
+ <van-button round block type="primary" native-type="submit">
|
|
|
+ 确认
|
|
|
+ </van-button>
|
|
|
+ </div>
|
|
|
+ </van-form>
|
|
|
+ </div>
|
|
|
+ </van-action-sheet>
|
|
|
+ <!-- 对接配置信息 -->
|
|
|
+ <van-action-sheet v-model:show="addressAction" :title="addressTitle">
|
|
|
+ <div class="form">
|
|
|
+ <van-form @submit="onAddressSubmit">
|
|
|
+ <van-cell-group inset>
|
|
|
+ <van-cell>
|
|
|
+ <van-field
|
|
|
+ v-model="addressInfo.networkType"
|
|
|
+ name="networkType "
|
|
|
+ label="对接类型"
|
|
|
+ placeholder="请选择接类型"
|
|
|
+ @click="showPicker = true"
|
|
|
+ :rules="[{ required: true, message: '请选择接类型' }]"
|
|
|
+ />
|
|
|
+ <van-popup v-model:show="showPicker" round position="bottom">
|
|
|
+ <van-picker
|
|
|
+ :columns="selColumns"
|
|
|
+ @cancel="showPicker = false"
|
|
|
+ @confirm="onConfirm"
|
|
|
+ />
|
|
|
+ </van-popup>
|
|
|
+ </van-cell>
|
|
|
+ <van-cell>
|
|
|
+ <van-field
|
|
|
+ v-model="addressInfo.address"
|
|
|
+ name="address"
|
|
|
+ label="对接地址"
|
|
|
+ placeholder="请输入对接地址"
|
|
|
+ :rules="[{ required: true, message: '请输入WIFI名称' }]"
|
|
|
+ />
|
|
|
+ </van-cell>
|
|
|
+ <van-cell>
|
|
|
+ <van-field
|
|
|
+ v-model="addressInfo.port"
|
|
|
+ name="port"
|
|
|
+ label="对接端口"
|
|
|
+ placeholder="请填写对接端口"
|
|
|
/>
|
|
|
</van-cell>
|
|
|
</van-cell-group>
|
|
|
@@ -123,77 +215,146 @@ import { post_promise } from "@/network/axios";
|
|
|
import { showToast } from "vant";
|
|
|
import { showConfirmDialog } from "vant";
|
|
|
import "vant/es/dialog/style";
|
|
|
-import { refreshCurrentRoute } from '@/router'
|
|
|
+import { refreshCurrentRoute } from "@/router";
|
|
|
import { useStoreOfUserInfo } from "@/store/userInfo";
|
|
|
+import { v4 as uuidv4 } from "uuid";
|
|
|
+import { selColumns } from './data';
|
|
|
const userInfo = useStoreOfUserInfo();
|
|
|
|
|
|
const cusNavigation = ref();
|
|
|
const wifiAction = ref(false); // wifi信息弹框
|
|
|
const wifiTitle = ref<string>(""); // wifi信息弹框标头
|
|
|
+const addressAction = ref(false); // 对接信息弹框
|
|
|
+const addressTitle = ref<string>(""); // 对接信息弹框标头
|
|
|
const formData = ref({} as any); // 表单信息
|
|
|
const wifiInfo = ref({} as any); // WIFI信息
|
|
|
+const addressInfo = ref({} as any); // 对接信息
|
|
|
const wifiDatas = ref<Array<any>>([]); // WIFI信息列表
|
|
|
-const validator = (val: string | any[]) => val && val.length < 8 ? false : true;
|
|
|
+const addressDatas = ref<Array<any>>([]); // WIFI信息列表
|
|
|
+const showPicker = ref(false);
|
|
|
+
|
|
|
+const validator8 = (val: string | any[]) =>
|
|
|
+ val && val.length > 8 ? false : true;
|
|
|
+
|
|
|
+const validator20 = (val: string | any[]) =>
|
|
|
+ val && val.length > 20 ? false : true;
|
|
|
// 提交WIFI信息
|
|
|
function onSubmit() {
|
|
|
- console.log("提交WIFI信息....");
|
|
|
formData.value.wifi = JSON.stringify(wifiDatas.value);
|
|
|
- post_promise({ url: "/userConfig/config", data: formData.value }).then((res)=>{
|
|
|
- if(res.code === 0){
|
|
|
- showToast({message:'WIFI信息配置成功!',
|
|
|
- onClose: () => {
|
|
|
- refreshCurrentRoute();
|
|
|
- }
|
|
|
- });
|
|
|
- wifiAction.value = false;
|
|
|
+ formData.value.address = JSON.stringify(addressDatas.value);
|
|
|
+ post_promise({ url: "/userConfig/config", data: formData.value }).then(
|
|
|
+ (res) => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ showToast({
|
|
|
+ message: "WIFI信息配置成功!",
|
|
|
+ onClose: () => {
|
|
|
+ refreshCurrentRoute();
|
|
|
+ },
|
|
|
+ });
|
|
|
+ wifiAction.value = false;
|
|
|
+ }
|
|
|
}
|
|
|
- });
|
|
|
+ );
|
|
|
}
|
|
|
|
|
|
+// 类型选项
|
|
|
+const onConfirm = ( selectedOptions: any ) => {
|
|
|
+ showPicker.value = false;
|
|
|
+ addressInfo.value.networkType = selectedOptions.selectedValues[0];
|
|
|
+ };
|
|
|
+
|
|
|
+
|
|
|
// wifi修改及新增确认
|
|
|
function onWifiSubmit() {
|
|
|
+ let tip = '新增';
|
|
|
if (wifiInfo.value && wifiInfo.value.id) {
|
|
|
for (let i = 0, len = wifiDatas.value.length - 1; i < len; i++) {
|
|
|
if (wifiDatas.value[i].id === wifiInfo.value.id) {
|
|
|
- wifiDatas.value[i] = wifiInfo;
|
|
|
+ wifiDatas.value[i] = wifiInfo.value;
|
|
|
+ tip = '编辑'
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
- wifiInfo.value = { ...wifiInfo.value, id: wifiDatas.value.length + 1 };
|
|
|
+ wifiInfo.value = { ...wifiInfo.value, id: uuidv4() };
|
|
|
wifiDatas.value.push(wifiInfo.value);
|
|
|
}
|
|
|
+ showToast('WIFI信息'+tip+'成功,保存后生效')
|
|
|
wifiAction.value = false;
|
|
|
wifiInfo.value = {};
|
|
|
}
|
|
|
|
|
|
+// 对接配置确认
|
|
|
+function onAddressSubmit() {
|
|
|
+ let tip = '新增';
|
|
|
+ if (addressInfo.value && addressInfo.value.id) {
|
|
|
+ for (let i = 0, len = addressDatas.value.length - 1; i < len; i++) {
|
|
|
+ if (addressDatas.value[i].id === addressInfo.value.id) {
|
|
|
+ addressDatas.value[i] = addressInfo.value;
|
|
|
+ tip = '编辑'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }else {
|
|
|
+ addressInfo.value = { ...addressInfo.value, id: uuidv4() };
|
|
|
+ addressDatas.value.push(addressInfo.value);
|
|
|
+
|
|
|
+ }
|
|
|
+ showToast('对接配置'+tip+'成功,保存后生效')
|
|
|
+ addressAction.value = false;
|
|
|
+ addressInfo.value = {};
|
|
|
+}
|
|
|
+
|
|
|
// 添加wifi方法
|
|
|
-function handleAdd() {
|
|
|
- console.log("添加wifi方法....");
|
|
|
- wifiTitle.value = "添加WIFI配置";
|
|
|
- wifiAction.value = true;
|
|
|
+function handleAdd(addType: string) {
|
|
|
+ if (addType === "wifi") {
|
|
|
+ wifiTitle.value = "添加WIFI配置";
|
|
|
+ wifiAction.value = true;
|
|
|
+ } else {
|
|
|
+ addressTitle.value = "添加对接配置";
|
|
|
+ addressAction.value = true;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
// 编辑wifi信息
|
|
|
-function handleEdit(record?: any) {
|
|
|
- console.log("编辑WFIFI方法...", record);
|
|
|
- wifiInfo.value = record;
|
|
|
- wifiTitle.value = "编辑WIFI配置";
|
|
|
- wifiAction.value = true;
|
|
|
+function handleEdit(editType: string, record: any) {
|
|
|
+ if (editType === "wifi") {
|
|
|
+ wifiInfo.value = record;
|
|
|
+ wifiTitle.value = "编辑WIFI配置";
|
|
|
+ wifiAction.value = true;
|
|
|
+ } else {
|
|
|
+ addressInfo.value = record;
|
|
|
+ addressTitle.value = "编辑对接配置";
|
|
|
+ addressAction.value = true;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
-function handleDel(record?: any) {
|
|
|
- showConfirmDialog({
|
|
|
- title: "提示",
|
|
|
- message: "是否删除" + record.name + "?",
|
|
|
- })
|
|
|
- .then(() => {
|
|
|
- wifiDatas.value = wifiDatas.value.filter(
|
|
|
- (obj: any) => obj.id != record.id
|
|
|
- );
|
|
|
+function handleDel(record: any, delType: string) {
|
|
|
+ if (delType === "wifi") {
|
|
|
+ showConfirmDialog({
|
|
|
+ title: "提示",
|
|
|
+ message: "是否删除" + record.name + "?",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ wifiDatas.value = wifiDatas.value.filter(
|
|
|
+ (obj: any) => obj.id != record.id
|
|
|
+ );
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ console.log("删除WFIFI方法关闭...");
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ showConfirmDialog({
|
|
|
+ title: "提示",
|
|
|
+ message: "是否删除" + record.address + "对接配置?",
|
|
|
})
|
|
|
- .catch(() => {
|
|
|
- console.log("删除WFIFI方法关闭...");
|
|
|
- });
|
|
|
+ .then(() => {
|
|
|
+ addressDatas.value = addressDatas.value.filter(
|
|
|
+ (obj: any) => obj.id != record.id
|
|
|
+ );
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ console.log("删除WFIFI方法关闭...");
|
|
|
+ });
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
// 生命周期
|
|
|
@@ -215,6 +376,7 @@ function getWifiInfo() {
|
|
|
if (result && result.data) {
|
|
|
formData.value = result.data;
|
|
|
wifiDatas.value = JSON.parse(result.data.wifi);
|
|
|
+ addressDatas.value = JSON.parse(result.data.address);
|
|
|
}
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
@@ -230,33 +392,34 @@ function getWifiInfo() {
|
|
|
height: 100vh;
|
|
|
}
|
|
|
.mains {
|
|
|
- height: 100vh;
|
|
|
+ height: 85vh;
|
|
|
+ overflow: auto;
|
|
|
background-color: #f7f8fa;
|
|
|
.title {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
- margin: 10px 5%;
|
|
|
+ margin: 0.625rem 5%;
|
|
|
color: #969799;
|
|
|
}
|
|
|
.form {
|
|
|
width: 95%;
|
|
|
margin-left: 2%;
|
|
|
background-color: #fff;
|
|
|
- border-radius: 5px;
|
|
|
+ border-radius: 0.3125rem;
|
|
|
.submit-btn {
|
|
|
position: fixed;
|
|
|
- bottom: 5px;
|
|
|
+ bottom: 0.1875rem;
|
|
|
width: 95%;
|
|
|
}
|
|
|
|
|
|
.wifi-info {
|
|
|
- height: 80px;
|
|
|
- line-height: 80px;
|
|
|
+ height: 5rem;
|
|
|
+ line-height: 5rem;
|
|
|
border-bottom: solid 1px #f5f6f7;
|
|
|
display: flex;
|
|
|
margin-left: 1.25rem;
|
|
|
button {
|
|
|
- margin-right: 8px;
|
|
|
+ margin-right: 0.5rem;
|
|
|
}
|
|
|
}
|
|
|
}
|
