+ 工单提报，用户登录

.env.dev

@@ -0,0 +1,3 @@
+//.env.dev
+
+VITE_BASE_URL=http://172.192.10.105:30016/api

package.json

@@ -17,7 +17,7 @@
     "dev:mp-qq": "uni -p mp-qq",
     "dev:mp-toutiao": "uni -p mp-toutiao",
     "dev:mp-weixin": "uni -p mp-weixin",
-    "wx-dev": "uni -p mp-weixin",
+    "wx-dev": "uni -p mp-weixin --mode dev",
     "dev:quickapp-webview": "uni -p quickapp-webview",
     "dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei",
     "dev:quickapp-webview-union": "uni -p quickapp-webview-union",
@@ -35,6 +35,7 @@
     "build:mp-qq": "uni build -p mp-qq",
     "build:mp-toutiao": "uni build -p mp-toutiao",
     "build:mp-weixin": "uni build -p mp-weixin",
+    "build-wx": "uni build -p mp-weixin-prod",
     "build:quickapp-webview": "uni build -p quickapp-webview",
     "build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei",
     "build:quickapp-webview-union": "uni build -p quickapp-webview-union",
@@ -60,6 +61,7 @@
     "@vue/shared": "^3.4.21",
     "clipboard": "^2.0.11",
     "dayjs": "^1.11.13",
+    "js-base64": "^3.7.7",
     "vue": "3.5.13",
     "vue-i18n": "9.14.1",
     "vuex": "^4.1.0"

src/api/usr.js

@@ -0,0 +1,12 @@
+import {get, post} from '@/util/request'
+
+export async function iotLogin(loginRequest) {
+    return await post('/user/ap/login', loginRequest);
+}
+
+export async function getCompany(loginRequest) {
+    return await get('/platform/getCompany', loginRequest, {
+        authorization: 'bearer 1f83f315-49b4-45ee-8092-9fa305d01f05'
+    });
+}
+

src/api/workorder.js

@@ -0,0 +1,8 @@
+import {uploadFilePromise} from "@/util/request";
+
+export const uploadOrderFile = async (file) => {
+    return await uploadFilePromise("/file/cloud/upload", file, {
+        path: "aiot",
+        fileType: "工单"
+    })
+}

src/common/config.js

@@ -1,3 +1,3 @@
 export default {
-    baseUrl: 'https://uview-plus.lingyun.net'
+    baseUrl: import.meta.env.VITE_BASE_URL
 }

src/common/demo.scss

@@ -81,4 +81,18 @@
     }
 
   }
-}
+}
+
+.sys-base {
+  .u-button--info.u-button {
+    background-color: $uni-color-primary;
+    color: $uni-text-color-inverse;
+    border-radius: 40rpx;
+  }
+
+  .u-form-item {
+    .u-form-item__body__right__message {
+      margin-left: 0 !important;
+    }
+  }
+}

src/manifest.json

@@ -1,6 +1,6 @@
 {
     "name" : "UviewPlus",
-    "appid" : "__UNI__A3058AD",
+    "appid" : "__UNI__B40A6DC",
     "description" : "多平台快速开发的UI框架",
     "versionName" : "3.1.52",
     "versionCode" : 1,

src/pages/login/index.vue

@@ -1,131 +1,222 @@
 <template>
-	<view class="wrap">
-		<view class="top"></view>
-		<view class="content">
-			<view class="title">欢迎登录</view>
-			<input class="u-border-bottom" type="number" v-model="tel" placeholder="请输入手机号" />
-			<view class="tips">未注册的手机号验证后自动创建账号</view>
-			<button @tap="submit" :style="[inputStyle]" class="getCaptcha">获取短信验证码</button>
-			<view class="alternative">
-				<view class="password">密码登录</view>
-				<view class="issue">遇到问题</view>
-			</view>
-		</view>
-		<view class="buttom">
-			<view class="loginType">
-				<view class="wechat item">
-					<view class="icon"><up-icon size="40" name="weixin-fill" color="rgb(83,194,64)"></up-icon></view>
-					微信
-				</view>
-				<view class="QQ item">
-					<view class="icon"><up-icon size="40" name="qq-fill" color="rgb(17,183,233)"></up-icon></view>
-					QQ
-				</view>
-			</view>
-			<view class="hint">
-				登录代表同意
-				<text class="link">用户协议、隐私政策，</text>
-				并授权使用您的账号信息（如昵称、头像、收获地址）以便您统一管理
-			</view>
-		</view>
-	</view>
+  <view class="wrap sys-base">
+    <view class="top">
+      <u--image
+          :showLoading="true"
+          :src="login_bg"
+          width="250rpx"
+          height="240rpx"
+      />
+      <view class="sys-name">华设物联网云平台</view>
+      <view class="sys-desc">连接万物，创造无限可能</view>
+    </view>
+    <view class="content">
+      <up-form
+          labelPosition="left"
+          :model="model"
+          :rules="rules"
+          ref="uFormRef"
+      >
+        <up-form-item
+            prop="userInfo.name"
+        >
+          <up-input
+              prefixIcon="account-fill"
+              :prefixIconStyle="{
+                 color: '#007aff'
+              }"
+              placeholder="请输入用户名"
+              border="bottom"
+              clearable
+              v-model="model.userInfo.name"
+          ></up-input>
+        </up-form-item>
+        <up-form-item
+            prop="userInfo.pwd"
+        >
+          <up-input
+              prefixIcon="lock-fill"
+              :prefixIconStyle="{
+                 color: '#007aff'
+              }"
+              placeholder="密码"
+              border="bottom"
+              clearable
+              password
+              v-model="model.userInfo.pwd"
+          ></up-input>
+        </up-form-item>
+      </up-form>
+      <up-button @click="submit" style="margin-top: 20rpx;">登录</up-button>
+    </view>
+    <view class="buttom">
+      <view class="hint">
+        登录代表同意
+        <text class="link">用户协议、隐私政策，</text>
+        并授权使用您的账号信息（如昵称、头像、收获地址）以便您统一管理
+      </view>
+    </view>
+  </view>
 </template>
 
-<script>
-export default {
-	data() {
-		return {
-			tel: ''
-		}
-	},
-	computed: {
-		inputStyle() {
-			let style = {};
-			if(this.tel) {
-				style.color = "#fff";
-				style.backgroundColor = this.$u.color['warning'];
-			}
-			return style;
-		}
-	},
-	methods: {
-		submit() {
-			if(this.$u.test.mobile(this.tel)) {
-				this.$u.route({
-					url: 'pages/template/login/code'
-				})
-			}
-		}
-	}
-};
+<script setup lang="ts">
+import login_bg from '@/static/aiot/login_bg.png'
+import {reactive, ref} from 'vue';
+import {iotLogin} from "@/api/usr";
+import {Base64} from "js-base64";
+import {reloadPage, setToken, setUserInfo} from "@/util";
+
+// 使用 reactive 创建响应式状态
+const model = reactive({
+  userInfo: {
+    name: '',
+    pwd: '',
+  }
+});
+const rules = reactive({
+  'userInfo.name': {
+    type: 'string',
+    required: true,
+    message: '请填写登录名',
+    trigger: ['blur', 'change'],
+  },
+  'userInfo.pwd': {
+    type: 'string',
+    required: true,
+    message: '请填写密码',
+    trigger: ['blur', 'change'],
+  }
+});
+
+// 使用 ref 创建响应式引用
+const uFormRef = ref(null);
+
+function submit() {
+  uFormRef.value.validate().then(async valid => {
+    if (valid) {
+      const params = {
+        "grant_type": "password_login",
+        "username": model.userInfo.name,
+        "password": Base64.encode(model.userInfo.pwd),
+        "client_id": "speed",
+        "client_secret": "speed1211",
+      }
+      const {nickname, roleName, token, userId, username} = await iotLogin(params)
+      setUserInfo({
+        nickname,
+        roleName,
+        token,
+        userId,
+        username,
+      })
+      setToken(token);
+      reloadPage()
+    } else {
+      uni.$u.toast('校验失败')
+    }
+  }).catch((e) => {
+    debugger
+    // 处理验证错误
+    uni.$u.toast('校验失败')
+  });
+}
 </script>
 
 <style lang="scss" scoped>
 .wrap {
-	font-size: 28rpx;
-	.content {
-		width: 600rpx;
-		margin: 80rpx auto 0;
-
-		.title {
-			text-align: left;
-			font-size: 60rpx;
-			font-weight: 500;
-			margin-bottom: 100rpx;
-		}
-		input {
-			text-align: left;
-			margin-bottom: 10rpx;
-			padding-bottom: 6rpx;
-		}
-		.tips {
-			color: $u-info;
-			margin-bottom: 60rpx;
-			margin-top: 8rpx;
-			font-size: 12px;
-		}
-		.getCaptcha {
-			background-color: rgb(253, 243, 208);
-			color: $u-tips-color;
-			border: none;
-			font-size: 30rpx;
-			padding: 12rpx 0;
-			
-			&::after {
-				border: none;
-			}
-		}
-		.alternative {
-			color: $u-tips-color;
-			display: flex;
-			justify-content: space-between;
-			margin-top: 30rpx;
-		}
-	}
-	.buttom {
-		.loginType {
-			display: flex;
-			padding: 350rpx 150rpx 150rpx 150rpx;
-			justify-content:space-between;
-			
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				color: $u-content-color;
-				font-size: 28rpx;
-			}
-		}
-		
-		.hint {
-			padding: 20rpx 40rpx;
-			font-size: 20rpx;
-			color: $u-tips-color;
-			
-			.link {
-				color: $u-warning;
-			}
-		}
-	}
+  font-size: 28rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-start;
+
+  .top {
+    margin-top: 60rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+
+    .sys-name {
+      font-weight: bold;
+      color: #000000;
+    }
+
+    > view {
+      &:not(:first-child) {
+        margin-top: $uni-block-gap;
+      }
+    }
+  }
+
+  .content {
+    width: 600rpx;
+    margin: 80rpx auto 0;
+
+    .title {
+      text-align: left;
+      font-size: 60rpx;
+      font-weight: 500;
+      margin-bottom: 100rpx;
+    }
+
+    input {
+      text-align: left;
+      margin-bottom: 10rpx;
+      padding-bottom: 6rpx;
+    }
+
+    .tips {
+      color: $u-info;
+      margin-bottom: 60rpx;
+      margin-top: 8rpx;
+      font-size: 12px;
+    }
+
+    .getCaptcha {
+      background-color: rgb(253, 243, 208);
+      color: $u-tips-color;
+      border: none;
+      font-size: 30rpx;
+      padding: 12rpx 0;
+
+      &::after {
+        border: none;
+      }
+    }
+
+    .alternative {
+      color: $u-tips-color;
+      display: flex;
+      justify-content: space-between;
+      margin-top: 30rpx;
+    }
+  }
+
+  .buttom {
+    .loginType {
+      display: flex;
+      padding: 350rpx 150rpx 150rpx 150rpx;
+      justify-content: space-between;
+
+      .item {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        color: $u-content-color;
+        font-size: 28rpx;
+      }
+    }
+
+    .hint {
+      padding: 20rpx 40rpx;
+      font-size: 20rpx;
+      color: $u-tips-color;
+
+      .link {
+        color: $u-warning;
+      }
+    }
+  }
 }
 </style>

src/pages/workbenchsub/workorder/submit.vue

@@ -1,14 +1,310 @@
 <template>
-  <view>
-
+  <view class="order-form info-wrap">
+    <!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
+    <up-form
+        labelPosition="left"
+        :model="state.model"
+        :rules="state.rules"
+        ref="formRef"
+        labelWidth="120"
+    >
+      <up-form-item
+          label="工单名称"
+          prop="order.name"
+          borderBottom
+          :required="true"
+      >
+        <up-input
+            v-model="state.model.order.name"
+            border="none"
+        ></up-input>
+      </up-form-item>
+      <up-form-item
+          label="工单类型"
+          prop="order.type"
+          borderBottom
+          :required="true"
+          @click="state.showOrderType = true; hideKeyboard()"
+      >
+        <up-input
+            v-model="state.model.order.type"
+            disabled
+            disabledColor="#ffffff"
+            placeholder="请选择工单类型"
+            :required="true"
+            border="none"
+        ></up-input>
+        <template #right>
+          <up-icon
+              name="arrow-right"
+          ></up-icon>
+        </template>
+      </up-form-item>
+      <up-form-item
+          label="工单等级"
+          prop="order.level"
+          borderBottom
+          :required="true"
+          @click="state.showOrderLevel = true; hideKeyboard()"
+      >
+        <up-input
+            v-model="state.model.order.level"
+            disabled
+            disabledColor="#ffffff"
+            placeholder="请选择工单等级"
+            border="none"
+        ></up-input>
+        <template #right>
+          <up-icon
+              name="arrow-right"
+          ></up-icon>
+        </template>
+      </up-form-item>
+      <up-form-item
+          label="预计开始日期"
+          prop="order.startDate"
+          borderBottom
+          :required="true"
+          @click="state.showStartClendar = true; hideKeyboard()"
+      >
+        <up-input
+            v-model="state.model.order.startDate"
+            disabled
+            disabledColor="#ffffff"
+            placeholder="请选择预计开始日期"
+            border="none"
+        ></up-input>
+        <template #right>
+          <up-icon
+              name="arrow-right"
+          ></up-icon>
+        </template>
+      </up-form-item>
+      <up-form-item
+          label="预计结束日期"
+          prop="order.endDate"
+          borderBottom
+          :required="true"
+          @click="state.showEndClendar = true; hideKeyboard()"
+      >
+        <up-input
+            v-model="state.model.order.endDate"
+            disabled
+            disabledColor="#ffffff"
+            placeholder="请选择预计结束日期"
+            border="none"
+        ></up-input>
+        <template #right>
+          <up-icon
+              name="arrow-right"
+          ></up-icon>
+        </template>
+      </up-form-item>
+      <up-form-item
+          label="故障描述"
+          borderBottom
+      >
+        <up-textarea
+            placeholder="故障描述"
+            v-model="state.model.order.desc"
+        ></up-textarea>
+      </up-form-item>
+      <up-form-item>
+        <text class="u-demo-block__title">问题图片</text>
+        <up-upload
+            :fileList="state.model.order.files"
+            @afterRead="afterRead"
+            @delete="deletePic"
+            name="imags"
+            multiple
+            :maxCount="5"
+            :previewFullImage="true"
+        ></up-upload>
+      </up-form-item>
+      <up-button @click="submit" style="margin-top: 20rpx;">提交</up-button>
+    </up-form>
+    <up-action-sheet
+        :show="state.showOrderType"
+        :actions="state.orderTypeList"
+        title="请选择工单类型"
+        @close="state.showOrderType = false"
+        @select="orderTypeSelect"
+    >
+    </up-action-sheet>
+    <up-action-sheet
+        :show="state.showOrderLevel"
+        :actions="state.orderLevelList"
+        title="请选择工单等级"
+        @close="state.showOrderLevel = false"
+        @select="orderLevelSelect"
+    >
+    </up-action-sheet>
+    <up-datetime-picker
+        :show="state.showStartClendar"
+        v-model="state.model.order.startDate"
+        mode="date"
+    ></up-datetime-picker>
+    <up-datetime-picker
+        :show="state.showEndClendar"
+        v-model="state.model.order.endDate"
+        mode="date"
+    ></up-datetime-picker>
   </view>
 </template>
 
 <script setup lang="ts">
+import {reactive, ref} from 'vue'
+import {uploadOrderFile} from '@/api/workorder.js'
+import dayjs from 'dayjs';
+import {DateFormat} from "@/util/index.js";
+
+const state = reactive({
+  showOrderType: false,
+  showOrderLevel: false,
+  showStartClendar: false,
+  showEndClendar: false,
+  model: {
+    order: {
+      files: [],
+      startDate: [dayjs().format(DateFormat.YYYYMMDD)],
+      endDate: [dayjs().format(DateFormat.YYYYMMDD)],
+    }
+  },
+  orderTypeList: [
+    {name: '男'},
+    {name: '女'},
+    {name: '保密'},
+  ],
+  orderLevelList: [
+    {name: 'level'},
+    {name: 'level2'},
+    {name: 'level3'},
+  ],
+  rules: {
+    'order.name': {
+      type: 'string',
+      required: true,
+      message: '请填工单名称',
+      trigger: ['blur', 'change'],
+    },
+    'order.type': {
+      type: 'string',
+      max: 1,
+      required: true,
+      message: '请选择工单类型',
+      trigger: ['blur', 'change'],
+    },
+    'order.level': {
+      type: 'string',
+      max: 1,
+      required: true,
+      message: '请选择工单等级',
+      trigger: ['blur', 'change'],
+    },
+    'order.startDate': {
+      type: 'string',
+      required: true,
+      message: '请选择预计开始时间',
+      trigger: ['blur', 'change'],
+    },
+    'order.endDate': {
+      type: 'string',
+      max: 1,
+      required: true,
+      message: '请选择预计结束时间',
+      trigger: ['blur', 'change'],
+    }
+  },
+});
+// 使用 ref 创建响应式引用
+const formRef = ref(null);
+const hideKeyboard = () => {
+  uni.hideKeyboard()
+}
+const orderTypeSelect = (item) => {
+  state.model.order.type = item.name;
+  state.showOrderType = false;
+};
+const orderLevelSelect = (item) => {
+  state.model.order.level = item.name;
+  state.showOrderLevel = false;
+};
+
+// 删除图片
+const deletePic = (event) => {
+  state.model.order.files.splice(event.index, 1)
+}
+const afterRead = async (event) => {
+  // 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
+  let lists = [].concat(event.file)
+  let fileListLen = state.model.order.files.length
+  lists.map((item) => {
+    state.model.order.files.push({
+      ...item,
+      status: 'uploading',
+      message: '上传中'
+    })
+  })
+  for (let i = 0; i < lists.length; i++) {
+    console.log(lists[i].url, 'lists[i].url')
+    const result = await uploadOrderFile(lists[i].url)
+    console.log(lists[i].url, 'lists[i].url11111')
+    let item = state.model.order.files[fileListLen]
+    state.model.order.files.splice(fileListLen, 1, Object.assign(item, {
+      status: 'success',
+      message: '',
+      url: result
+    }))
+    fileListLen++
+  }
+}
+const submit = () => {
+  formRef.value.validate().then(async valid => {
+    if (valid) {
+      const params = {
+        "grant_type": "password_login",
+        "username": state.model.userInfo.name,
+        "password": Base64.encode(model.userInfo.pwd),
+        "client_id": "speed",
+        "client_secret": "speed1211",
+      }
 
+    } else {
+      uni.$u.toast('校验失败')
+    }
+  }).catch((e) => {
+    debugger
+    // 处理验证错误
+    uni.$u.toast('校验失败')
+  });
+}
 </script>
 
 
-<style scoped lang="scss">
+<style lang="scss">
+.order-form {
+  background-color: #fff;
+  border-radius: $uni-text-gap;
+  padding: $uni-text-gap;
+
+  .u-form-item__body__left__content .u-form-item__body__left__content__required {
+    display: flex;
+    position: static;
+    align-items: center;
+    justify-content: flex-end;
+    margin-right: $uni-text-gap;
+  }
+
+  .u-form-item__body .u-form-item__body__left {
+    align-items: flex-start;
+  }
+
+  .u-demo-block__title {
+    color: $uni-text-black;
+  }
 
+  input {
+    text-align: right !important;
+  }
+}
 </style>

src/static/app-plus/mp-html/local.html

@@ -1 +0,0 @@
-<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><style>body,html{width:100%;height:100%;overflow-x:scroll;overflow-y:hidden}body{margin:0}video{width:300px;height:225px}img{max-width:100%;-webkit-touch-callout:none}</style></head><body><div id="content" style="overflow:hidden"></div><script type="text/javascript" src="./js/uni.webview.min.js"></script><script type="text/javascript" src="./js/handler.js"></script></body>