feat: 去掉uni相关

components.d.ts

@@ -8,6 +8,7 @@ export {}
 declare module 'vue' {
     export interface GlobalComponents {
         // 全局组件
+        GlobalAlbum: typeof import('./src/mocp/components/global-album/global-album.vue')['default']
         GlobalButton: typeof import('./src/mocp/components/global-button/global-button.vue')['default']
         GlobalDate: typeof import('./src/mocp/components/global-date/global-date.vue')['default']
         GlobalEmpty: typeof import('./src/mocp/components/global-empty/global-empty.vue')['default']

src/mocp/components/global-album/global-album.vue

+<template>
+    <!-- 全局图片预览 -->
+    <up-album
+        v-if="fileList.length"
+        :urls="fileList"
+        :keyName="keyName"
+        :singleSize="getSingleSize"
+        :multipleSize="getMultipleSize"
+        :singleMode="singleMode"
+        :multipleMode="multipleMode"
+    ></up-album>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+const ps = defineProps({
+    fileList: {
+        type: Array,
+        default: () => {
+            return []
+        }
+    },
+    keyName: {
+        type: String,
+        default: 'fileUrl'
+    },
+    singleSize: {
+        type: Number,
+        default: 654
+    },
+    multipleSize: {
+        type: Number,
+        default: 654
+    },
+    singleMode: {
+        type: String,
+        default: 'widthFix'
+    },
+    multipleMode: {
+        type: String,
+        default: 'widthFix'
+    }
+})
+const getSingleSize = computed(() => {
+    return ps.singleSize + 'rpx'
+})
+const getMultipleSize = computed(() => {
+    return ps.multipleSize + 'rpx'
+})
+</script>
+<style lang="scss" scoped></style>

src/mocp/components/global-navbar/global-navbar.vue

 <template>
     <!-- 全局自定义navbar -->
-    <view class="navbar">
-        <up-navbar :title="title" :fixed="false" :bgColor="bgColor" :safeAreaInsetTop="false">
+    <view class="mocp-navbar">
+        <up-navbar :title="title" :fixed="false" :bgColor="bgColor" :safeAreaInsetTop="false" :titleStyle="getTitleStyle">
             <template #left>
                 <slot name="left"></slot>
             </template>
@@ -13,6 +13,8 @@
 </template>
 
 <script setup>
+import { computed } from 'vue'
+
 const ps = defineProps({
     title: {
         type: String,
@@ -21,6 +23,19 @@ const ps = defineProps({
     bgColor: {
         type: String,
         default: '#f7f8fa'
+    },
+    titleStyle: {
+        type: Object,
+        default: () => {
+            return {}
+        }
+    }
+})
+const getTitleStyle = computed(() => {
+    return {
+        ...ps.titleStyle,
+        color: '#4e5969',
+        fontSize: '34rpx'
     }
 })
 </script>

src/mocp/components/global-page-swiper/global-page-swiper.vue

@@ -7,7 +7,7 @@
             <!-- 自定义导航栏 -->
             <global-navbar :title="title" v-if="showNavbar">
                 <template #left>
-                    <uni-icons type="left" size="16" @tap="goBack"></uni-icons>
+                    <up-icon name="arrow-left" size="16" @tap="goBack"></up-icon>
                 </template>
             </global-navbar>
             <!-- tab切换 -->

src/mocp/components/global-page/global-page.vue

@@ -23,7 +23,7 @@
             <!-- 自定义导航栏 -->
             <global-navbar :title="title" v-if="showNavbar">
                 <template #left v-if="pages.length > 1">
-                    <uni-icons v-if="navLeftType == 'icon'" :type="navLeftIcon" size="16" @tap="handleLeftClick"></uni-icons>
+                    <up-icon v-if="navLeftType == 'icon'" :name="navLeftIcon" size="16" @tap="handleLeftClick"></up-icon>
                     <view v-if="navLeftType == 'text'" class="cancel" @tap="handleLeftClick">{{ navLeftText }}</view>
                 </template>
                 <template #right v-if="showNavRight">
@@ -89,7 +89,7 @@ const ps = defineProps({
     //nav左边插槽图标
     navLeftIcon: {
         type: String,
-        default: 'left'
+        default: 'arrow-left'
     },
     //nav左边插槽文字
     navLeftText: {

src/mocp/components/global-upload/global-upload.vue

@@ -12,7 +12,7 @@
     >
         <slot>
             <view class="upload-button" :style="getUploadButtonSize">
-                <uni-icons :type="uploadIcon" :size="24" color="rgba(0, 0, 0, 0.4)"></uni-icons>
+                <up-icon :name="uploadIcon" size="24" color="rgba(0, 0, 0, 0.4)"></up-icon>
             </view>
         </slot>
     </up-upload>
@@ -21,6 +21,7 @@
 <script setup>
 import { computed, ref, watch } from 'vue'
 import { cloneDeep } from 'lodash'
+import { upload } from 'mocp/utils/http'
 
 const es = defineEmits(['handleUpload'])
 const ps = defineProps({
@@ -42,7 +43,7 @@ const ps = defineProps({
     },
     uploadIcon: {
         type: String,
-        default: 'plusempty'
+        default: 'plus'
     }
 })
 const getUploadButtonSize = computed(() => {
@@ -76,7 +77,7 @@ const afterRead = async (event) => {
     })
     for (let i = 0; i < lists.length; i++) {
         try {
-            const res = await uploadFilePromise(lists[i].url)
+            const res = await upload({ url: ps.url, filePath: lists[i].url, name: 'file' })
             if (res.code == 200) {
                 fileList.value.splice(fileListLen, 1, {
                     ...res.data,
@@ -114,22 +115,6 @@ watch(
     },
     { deep: true }
 )
-const uploadFilePromise = (url) => {
-    return new Promise((resolve, reject) => {
-        uni.uploadFile({
-            url: ps.url,
-            name: 'file',
-            filePath: url,
-            success: (res) => {
-                resolve(JSON.parse(res.data))
-            },
-            fail: (res) => {
-                console.error(JSON.parse(res.data))
-                reject(false)
-            }
-        })
-    })
-}
 </script>
 <style lang="scss" scoped>
 .upload-button {

src/mocp/utils/http.js

-/**
- * 添加拦截器:
- *   拦截 request 请求
- *   拦截 uploadFile 文件上传
- *
- * TODO:
- *   1. 非 http 开头需拼接地址
- *   2. 请求超时
- *   3. 添加小程序端请求头标识
- *   4. 添加 token 请求头标识
- */
-
 import useUserStore from 'mocp/store/user'
 
 const baseURL = 'https://hna-platform.anyremote.cn'
@@ -42,87 +30,67 @@ class ServiceLoading {
     }
 }
 const serviceLoading = new ServiceLoading()
-
-// 添加拦截器
-const httpInterceptor = {
-    // 拦截前触发
-    invoke(options) {
-        const userStore = useUserStore()
-        //responseType
-        if (options.config?.arraybuffer) {
-            options.responseType = 'arraybuffer'
-        }
-        //loading
-        const loading = options.config?.loading
-        serviceLoading.open(loading)
-        //重组提交数据
-        if (options.data) {
-            options.data = {
-                ...options.data,
-                apiPwd: 'Ifar$2_0160_525_Mocp',
-                requestFrom: '3',
-                realUserId: userStore.userInfo?.id
-            }
+//请求拦截器
+const httpInterceptor = (options) => {
+    const userStore = useUserStore()
+    //responseType
+    if (options.config?.arraybuffer) {
+        options.responseType = 'arraybuffer'
+    }
+    //loading
+    const loading = options.config?.loading
+    serviceLoading.open(loading)
+    //重组提交数据
+    if (options.data) {
+        options.data = {
+            ...options.data,
+            apiPwd: 'Ifar$2_0160_525_Mocp',
+            requestFrom: '3',
+            realUserId: userStore.userInfo?.id
         }
-        // 非 http 开头需拼接地址
-        if (!options.url.startsWith('http')) {
-            options.url = baseURL + options.url
+    }
+    // 非 http 开头需拼接地址
+    if (!options.url.startsWith('http')) {
+        options.url = baseURL + options.url
+    }
+    // 请求超时, 默认 60s
+    options.timeout = 10000
+    // 添加小程序端请求头标识
+    if (options.name == 'file') {
+        options.formData = {
+            ...options.formData,
+            apiPwd: 'Ifar$2_0160_525_Mocp',
+            requestFrom: '6',
+            uid: userStore.userInfo?.id
         }
-        // 请求超时, 默认 60s
-        options.timeout = 10000
-        // 添加小程序端请求头标识
-        if (options.name == 'file') {
-            options.formData = {
-                ...options.formData,
-                apiPwd: 'Ifar$2_0160_525_Mocp',
-                requestFrom: '6',
-                uid: userStore.userInfo?.id
-            }
-            options.header = {
-                ...options.header
-            }
-        } else {
-            options.header = {
-                'Content-Type': 'application/x-www-form-urlencoded',
-                ...options.header
-            }
+        options.header = {
+            ...options.header
         }
-        // 添加 token 请求头标识
-        if (userStore.token) {
-            options.header.Authorization = `Bearer ${userStore.token}`
+    } else {
+        options.header = {
+            'Content-Type': 'application/x-www-form-urlencoded',
+            ...options.header
         }
-        console.log('接口请求信息:', options)
     }
+    // 添加 token 请求头标识
+    if (userStore.token) {
+        options.header.Authorization = `Bearer ${userStore.token}`
+    }
+    console.log('接口请求信息:', options)
+    return options
 }
-uni.addInterceptor('request', httpInterceptor)
-uni.addInterceptor('uploadFile', httpInterceptor)
-
-/**
- * 请求函数
- * @returns Promise
- *  1. 返回 Promise 对象
- *  2. 获取数据成功
- *    2.1 提取核心数据 res.data
- *    2.2 添加类型，支持泛型
- *  3. 获取数据失败
- *    3.1 401错误  -> 清理用户信息，跳转到登录页
- *    3.2 其他错误 -> 根据后端错误信息轻提示
- *    3.3 网络错误 -> 提示用户换网络
- */
-// 2.2 添加类型
+//http请求
 export const http = (options) => {
+    options = httpInterceptor(options)
     // 1. 返回 Promise 对象
     return new Promise((resolve, reject) => {
         uni.request({
             ...options,
-            // 响应成功
             success(res) {
                 console.log('接口响应结果:', res)
                 serviceLoading.close()
-                // 状态码 2xx， axios 就是这样设计的
-                const statusCode = parseInt(res.statusCode)
+                const statusCode = res.statusCode
                 if (statusCode >= 200 && statusCode < 300) {
-                    // 2.1 提取核心数据 res.data
                     if (res.data.code == 403) {
                         const userStore = useUserStore()
                         uni.$mocpMessage.showToast(res.data.message)
@@ -134,7 +102,6 @@ export const http = (options) => {
                         resolve(res.data)
                     }
                 } else if (statusCode == 401) {
-                    // 401错误  -> 清理用户信息，跳转到登录页
                     const userStore = useUserStore()
                     uni.$mocpMessage.showToast(res.data.message)
                     setTimeout(() => {
@@ -142,12 +109,10 @@ export const http = (options) => {
                     }, 500)
                     reject(res)
                 } else {
-                    // 其他错误 -> 根据后端错误信息轻提示
                     uni.$mocpMessage.showToast(res.data.message || '请求错误')
                     reject(res)
                 }
             },
-            // 响应失败
             fail(err) {
                 serviceLoading.close()
                 uni.$mocpMessage.showToast('网络错误，换个网络试试')
@@ -156,3 +121,44 @@ export const http = (options) => {
         })
     })
 }
+//upload请求
+export const upload = (options) => {
+    options = httpInterceptor(options)
+    return new Promise((resolve, reject) => {
+        uni.uploadFile({
+            ...options,
+            success: (res) => {
+                console.log('接口响应结果:', res)
+                serviceLoading.close()
+                const statusCode = res.statusCode
+                if (statusCode >= 200 && statusCode < 300) {
+                    if (res.data.code == 403) {
+                        const userStore = useUserStore()
+                        uni.$mocpMessage.showToast(res.data.message)
+                        setTimeout(() => {
+                            userStore.handleLogOut()
+                        }, 500)
+                        reject(res)
+                    } else {
+                        resolve(JSON.parse(res.data))
+                    }
+                } else if (statusCode == 401) {
+                    const userStore = useUserStore()
+                    uni.$mocpMessage.showToast(res.data.message)
+                    setTimeout(() => {
+                        userStore.handleLogOut()
+                    }, 500)
+                    reject(res)
+                } else {
+                    uni.$mocpMessage.showToast(res.data.message || '请求错误')
+                    reject(res)
+                }
+            },
+            fail: (err) => {
+                serviceLoading.close()
+                uni.$mocpMessage.showToast('上传失败')
+                reject(err)
+            }
+        })
+    })
+}

src/pages/modules/mocp/login/constants/index.compositions.js

@@ -9,28 +9,25 @@ export const loginForm = reactive({
 export const loginCode = ref('')
 //表单规则
 export const rules = reactive({
-    username: {
-        rules: [
-            {
-                required: true,
-                errorMessage: '请输入账号'
-            }
-        ]
-    },
-    password: {
-        rules: [
-            {
-                required: true,
-                errorMessage: '请输入密码'
-            }
-        ]
-    },
-    verifyCode: {
-        rules: [
-            {
-                required: true,
-                errorMessage: '请输入验证码'
-            }
-        ]
-    }
+    username: [
+        {
+            required: true,
+            message: '请输入账号',
+            trigger: ['blur', 'change']
+        }
+    ],
+    password: [
+        {
+            required: true,
+            message: '请输入密码',
+            trigger: ['blur', 'change']
+        }
+    ],
+    verifyCode: [
+        {
+            required: true,
+            message: '请输入验证码',
+            trigger: ['blur', 'change']
+        }
+    ]
 })

src/pages/modules/mocp/login/constants/index.scss

@@ -32,11 +32,12 @@
         &-image {
             margin-left: 20rpx;
             width: 200rpx;
-            height: 70rpx;
+            height: 76rpx;
             background: #d9d9d9;
         }
     }
     .login-btn {
+        margin-top: 20rpx;
         width: 100%;
     }
 }

src/pages/modules/mocp/login/index.vue

@@ -9,28 +9,32 @@
                 <view class="p">登录你的账户</view>
                 <view class="txt">请输入账号密码登录</view>
             </view>
-            <uni-forms ref="loginFormRef" :modelValue="loginForm" :rules="rules" label-position="top">
-                <uni-forms-item label="账号" name="username">
-                    <uni-easyinput v-model="loginForm.username" placeholder="请输入账号" type="text" />
-                </uni-forms-item>
-                <uni-forms-item label="密码" name="password">
-                    <uni-easyinput v-model="loginForm.password" placeholder="请输入密码" type="password" />
-                </uni-forms-item>
-                <uni-forms-item label="验证码" name="verifyCode">
-                    <view class="verify-code">
-                        <uni-easyinput v-model="loginForm.verifyCode" placeholder="请输入验证码" type="text" style="flex: auto" />
-                        <image
-                            class="verify-code-image"
-                            v-if="loginCode && loginForm.username"
-                            :src="loginCode"
-                            mode="scaleToFill"
-                            @tap="getGifCaptcha"
-                        />
-                        <view class="verify-code-image" v-else></view>
-                    </view>
-                </uni-forms-item>
-            </uni-forms>
-            <global-button class="login-btn" size="large" type="primary" @tap="handleLogin" :loading="loading">登录</global-button>
+            <view class="mocp-form">
+                <up-form ref="loginFormRef" labelWidth="auto" :model="loginForm" :rules="rules" label-position="top">
+                    <up-form-item label="账号" prop="username">
+                        <up-input v-model="loginForm.username" placeholder="请输入账号" clearable />
+                    </up-form-item>
+                    <up-form-item label="密码" prop="password">
+                        <up-input v-model="loginForm.password" placeholder="请输入密码" clearable type="password" />
+                    </up-form-item>
+                    <up-form-item label="验证码" prop="verifyCode">
+                        <view class="verify-code">
+                            <up-input v-model="loginForm.verifyCode" placeholder="请输入验证码" style="flex: auto" />
+                            <image
+                                class="verify-code-image"
+                                v-if="loginCode && loginForm.username"
+                                :src="loginCode"
+                                mode="scaleToFill"
+                                @tap="getGifCaptcha"
+                            />
+                            <view class="verify-code-image" v-else></view>
+                        </view>
+                    </up-form-item>
+                </up-form>
+            </view>
+            <view class="login-btn">
+                <global-button size="large" type="primary" @tap="handleLogin" :loading="loading">登录</global-button>
+            </view>
         </view>
     </global-page>
 </template>

src/pages/modules/mocp/panel/appraisal-record/add.vue

@@ -7,7 +7,7 @@
         navRightText="保存"
         @handleRightClick="handleRightClick"
     >
-        <view class="form">
+        <view class="mocp-form">
             <up-form labelPosition="left" labelWidth="auto">
                 <up-form-item :label="formData.isDuty == 0 ? '公司值班经理' : '品质中心经理'" :borderBottom="true">
                     <global-picker pickAlign="right" clearable v-model="formData.mid" :options="selectList" emptyValue="-1"></global-picker>
@@ -88,7 +88,7 @@ const handleRightClick = async () => {
 </script>
 
 <style lang="scss" scoped>
-.form {
+.mocp-form {
     background: #fff;
     padding: 0 32rpx;
 }

src/pages/modules/mocp/panel/appraisal-record/constants/edit.scss

 .content {
     padding-bottom: 140rpx;
-    .form {
+    .mocp-form {
         background: #fff;
         padding: 0 32rpx;
     }

src/pages/modules/mocp/panel/appraisal-record/details.vue

@@ -70,14 +70,7 @@
             </card-details>
             <card-details type="appeal" title="申诉状态" titleIcon="email">
                 <view class="appeal-status">{{ useGetDictByValue('appealInfo', details.appealInfo) }}</view>
-                <up-album
-                    :urls="getFileList"
-                    keyName="fileUrl"
-                    singleSize="654rpx"
-                    multipleSize="654rpx"
-                    singleMode="widthFix"
-                    multipleMode="widthFix"
-                ></up-album>
+                <global-album :fileList="getFileList"></global-album>
             </card-details>
         </template>
     </global-page>

src/pages/modules/mocp/panel/appraisal-record/edit.vue

 <template>
     <global-page title="考核记录登记" showFooterBtn @handleFooterClick="handleSubmit">
         <view class="content">
-            <view class="form">
+            <view class="mocp-form">
                 <up-form labelPosition="left" labelWidth="auto" :model="formData" ref="formRef" :rules="rules">
                     <up-form-item label="事件来源" :borderBottom="true">
                         <up-input border="none" inputAlign="right" placeholder="请输入" clearable v-model="formData.eventSource"></up-input>

src/pages/modules/mocp/panel/assign-work/constants/edit-work.scss

-.content {
+.mocp-form {
     background: #fff;
     .form {
         &-title {

src/pages/modules/mocp/panel/assign-work/edit-approval.vue

 <template>
     <global-page title="添加领导批示" navLeftType="text" :showNavRight="true" navRightType="button" navRightText="保存">
-        <up-form labelPosition="left" labelWidth="auto" ref="formRef">
-            <view class="form">
+        <view class="mocp-form">
+            <up-form labelPosition="left" labelWidth="auto" ref="formRef">
                 <up-form-item label="领导批示意见" :borderBottom="true">
                     <global-picker pickAlign="right" clearable></global-picker>
                 </up-form-item>
@@ -12,14 +12,14 @@
                         border="none"
                     ></up-textarea>
                 </up-form-item>
-            </view>
-        </up-form>
+            </up-form>
+        </view>
     </global-page>
 </template>
 
 <script setup></script>
 <style lang="scss" scoped>
-.form {
+.mocp-form {
     background: #fff;
     margin-bottom: 24rpx;
     padding: 0 32rpx;

src/pages/modules/mocp/panel/assign-work/edit-decompose.vue

@@ -9,34 +9,36 @@
         footerBtnText="添加分解计划"
         @handleFooterClick="handleFooterClick"
     >
-        <up-form labelPosition="left" labelWidth="auto" ref="formRef">
-            <view class="form">
-                <up-form-item label="分解计划1" :borderBottom="true" labelPosition="top">
-                    <view class="delete" @tap="handleDelete"><global-icon icon="delete-01" color="#F53F3F"></global-icon></view>
-                    <up-textarea
-                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
-                        :height="40"
-                        border="none"
-                    ></up-textarea>
-                </up-form-item>
-                <up-form-item label="完成时限" :borderBottom="true">
-                    <global-date pickAlign="right" clearable :emptyValue="-1" placeholder="请选择日期"></global-date>
-                </up-form-item>
-            </view>
-            <view class="form">
-                <up-form-item label="分解计划2" :borderBottom="true" labelPosition="top">
-                    <view class="delete" @tap="handleDelete"><global-icon icon="delete-01" color="#F53F3F"></global-icon></view>
-                    <up-textarea
-                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
-                        :height="40"
-                        border="none"
-                    ></up-textarea>
-                </up-form-item>
-                <up-form-item label="完成时限" :borderBottom="true">
-                    <global-date pickAlign="right" clearable :emptyValue="-1" placeholder="请选择日期"></global-date>
-                </up-form-item>
-            </view>
-        </up-form>
+        <view class="mocp-form">
+            <up-form labelPosition="left" labelWidth="auto" ref="formRef">
+                <view class="form">
+                    <up-form-item label="分解计划1" :borderBottom="true" labelPosition="top">
+                        <view class="delete" @tap="handleDelete"><global-icon icon="delete-01" color="#F53F3F"></global-icon></view>
+                        <up-textarea
+                            placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
+                            :height="40"
+                            border="none"
+                        ></up-textarea>
+                    </up-form-item>
+                    <up-form-item label="完成时限" :borderBottom="true">
+                        <global-date pickAlign="right" clearable :emptyValue="-1" placeholder="请选择日期"></global-date>
+                    </up-form-item>
+                </view>
+                <view class="form">
+                    <up-form-item label="分解计划2" :borderBottom="true" labelPosition="top">
+                        <view class="delete" @tap="handleDelete"><global-icon icon="delete-01" color="#F53F3F"></global-icon></view>
+                        <up-textarea
+                            placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
+                            :height="40"
+                            border="none"
+                        ></up-textarea>
+                    </up-form-item>
+                    <up-form-item label="完成时限" :borderBottom="true">
+                        <global-date pickAlign="right" clearable :emptyValue="-1" placeholder="请选择日期"></global-date>
+                    </up-form-item>
+                </view>
+            </up-form>
+        </view>
         <up-modal
             :width="250"
             content="确认删除吗？删除后不可恢复!"

src/pages/modules/mocp/panel/assign-work/edit-followUpFeedback.vue

 <template>
     <global-page title="后续措施反馈" navLeftType="text" :showNavRight="true" navRightType="button" navRightText="保存">
-        <up-form labelPosition="left" labelWidth="auto" ref="formRef">
-            <view class="form">
+        <view class="mocp-form">
+            <up-form labelPosition="left" labelWidth="auto" ref="formRef">
                 <up-form-item label="反馈内容" :borderBottom="true" labelPosition="top">
                     <up-textarea
                         placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
@@ -17,14 +17,14 @@
                 <up-form-item label="应用分类" :borderBottom="true">
                     <global-picker pickAlign="right" clearable></global-picker>
                 </up-form-item>
-            </view>
-        </up-form>
+            </up-form>
+        </view>
     </global-page>
 </template>
 
 <script setup></script>
 <style lang="scss" scoped>
-.form {
+.mocp-form {
     background: #fff;
     margin-bottom: 24rpx;
     padding: 0 32rpx;

src/pages/modules/mocp/panel/assign-work/edit-gzFeedback.vue

 <template>
     <global-page title="跟踪反馈" navLeftType="text" :showNavRight="true" navRightType="button" navRightText="保存">
-        <up-form labelPosition="left" labelWidth="auto" ref="formRef">
-            <view class="form">
+        <view class="mocp-form">
+            <up-form labelPosition="left" labelWidth="auto" ref="formRef">
                 <up-form-item label="跟踪反馈" :borderBottom="true" labelPosition="top">
                     <up-textarea
                         placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
@@ -9,16 +9,10 @@
                         border="none"
                     ></up-textarea>
                 </up-form-item>
-            </view>
-        </up-form>
+            </up-form>
+        </view>
     </global-page>
 </template>
 
 <script setup></script>
-<style lang="scss" scoped>
-.form {
-    background: #fff;
-    margin-bottom: 24rpx;
-    padding: 0 32rpx;
-}
-</style>
+<style lang="scss" scoped></style>

src/pages/modules/mocp/panel/assign-work/edit-validate.vue

 <template>
     <global-page title="工作验证" navLeftType="text" :showNavRight="true" navRightType="button" navRightText="保存">
-        <up-form labelPosition="left" labelWidth="auto" ref="formRef">
-            <view class="form">
+        <view class="mocp-form">
+            <up-form labelPosition="left" labelWidth="auto" ref="formRef">
                 <up-form-item label="跟踪要点" :borderBottom="true" labelPosition="top">
                     <up-textarea
                         placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
@@ -23,14 +23,14 @@
                 <up-form-item label="工作验证状态" :borderBottom="true">
                     <global-picker pickAlign="right" clearable></global-picker>
                 </up-form-item>
-            </view>
-        </up-form>
+            </up-form>
+        </view>
     </global-page>
 </template>
 
 <script setup></script>
 <style lang="scss" scoped>
-.form {
+.mocp-form {
     background: #fff;
     margin-bottom: 24rpx;
     padding: 0 32rpx;

src/pages/modules/mocp/panel/assign-work/edit-work.vue

 <template>
     <global-page title="添加工作反馈" navLeftType="text" :showNavRight="true" navRightType="button" navRightText="保存">
-        <view class="content">
+        <view class="mocp-form">
             <up-form labelPosition="left" labelWidth="auto" ref="formRef">
                 <view class="form">
                     <view class="form-item">

src/static/mocp/css/uview-plus.scss

 // 表单
-.u-form-item__body {
-    padding: 24rpx 0 !important;
-    .u-form-item__body__left__content__label {
-        color: $mocp-text-5 !important;
-        font-size: 28rpx !important;
-    }
-    .u-input__content__field-wrapper__field {
-        color: $mocp-text-4 !important;
-    }
-    .u-textarea {
-        margin-top: 8rpx;
-        .u-textarea__field {
+.mocp-form {
+    .u-form-item__body {
+        padding: 24rpx 0 !important;
+        .u-form-item__body__left__content__label {
+            color: $mocp-text-5 !important;
             font-size: 28rpx !important;
+        }
+        .u-input__content__field-wrapper__field {
             color: $mocp-text-4 !important;
         }
+        .u-textarea {
+            margin-top: 8rpx;
+            .u-textarea__field {
+                font-size: 28rpx !important;
+                color: $mocp-text-4 !important;
+            }
+        }
     }
 }
-// 头部导航
-.u-navbar__content__title {
-    color: $mocp-text-5 !important;
-    font-size: 34rpx !important;
-}