|
|
@@ -4,436 +4,328 @@
|
|
|
style: {
|
|
|
navigationBarTitleText: '检验方案审核',
|
|
|
navigationStyle: 'custom',
|
|
|
+ disableScroll: true,
|
|
|
},
|
|
|
}
|
|
|
</route>
|
|
|
|
|
|
<template>
|
|
|
<view class="preview-container">
|
|
|
- <!-- 导航栏 -->
|
|
|
- <NavBar title="检验方案审核">
|
|
|
+ <ReportNavBar>
|
|
|
<template #right>
|
|
|
- <view class="action-btn" @click="showGoBackPopup">
|
|
|
- <text class="btn-text reject">退回</text>
|
|
|
- </view>
|
|
|
- <view class="action-btn" @click="handleFinish">
|
|
|
- <text class="btn-text pass">通过</text>
|
|
|
- </view>
|
|
|
+ <button class="nav-btn btn-orange" @click="showGoBackPopupFn">退回</button>
|
|
|
+ <button class="nav-btn btn-blue" @click="showSelectUserPopupFn">通过</button>
|
|
|
</template>
|
|
|
- </NavBar>
|
|
|
-
|
|
|
- <!-- PDF 预览区域 -->
|
|
|
- <view class="pdf-container">
|
|
|
- <view v-if="loading" class="loading-container">
|
|
|
- <text class="loading-text">加载中...</text>
|
|
|
- </view>
|
|
|
- <web-view v-else-if="pdfUrl" :src="pdfUrl" @error="onPdfError" />
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 退回弹窗 -->
|
|
|
- <view v-if="showGoBack" class="popup-overlay" @click="closeGoBackPopup">
|
|
|
- <view class="popup-content" @click.stop>
|
|
|
- <text class="popup-title">退回</text>
|
|
|
- <view class="form-item">
|
|
|
- <text class="form-label">退回原因:</text>
|
|
|
- <textarea
|
|
|
- v-model="goBackReason"
|
|
|
- class="input-area"
|
|
|
- placeholder="请输入退回原因"
|
|
|
- maxlength="-1"
|
|
|
- />
|
|
|
+ </ReportNavBar>
|
|
|
+
|
|
|
+ <SpreadPDFViewer
|
|
|
+ ref="spreadPdfViewerRef"
|
|
|
+ :businessConfig="businessConfig"
|
|
|
+ :templateData="templateData"
|
|
|
+ :templateBlob="templateBlob"
|
|
|
+ />
|
|
|
+
|
|
|
+ <wd-popup position="center" v-model="showGoBack">
|
|
|
+ <view class="popup-body">
|
|
|
+ <view class="row" style="margin-bottom: 20px">
|
|
|
+ <text class="center-text">退回原因:</text>
|
|
|
+ <textarea v-model="goBackReason" class="input-area" placeholder="请输入" />
|
|
|
</view>
|
|
|
- <view class="popup-actions">
|
|
|
- <button class="action-btn cancel-btn" @click="closeGoBackPopup">取消</button>
|
|
|
- <button class="action-btn confirm-btn" @click="goBackAction">确定</button>
|
|
|
+ <view class="popup-bottom-box">
|
|
|
+ <button class="bottom-btn white-btn" @click="closeGoBackPopup">取消</button>
|
|
|
+ <button class="bottom-btn" @click="confirmReject">确定</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 选择批准人弹窗 -->
|
|
|
- <view v-if="showSelectUser" class="popup-overlay" @click="closeSelectUserPopup">
|
|
|
- <view class="popup-content" @click.stop>
|
|
|
- <text class="popup-title">选择批准人</text>
|
|
|
- <picker
|
|
|
- :range="auditUserGroupList"
|
|
|
- range-key="label"
|
|
|
- @change="onUserChange"
|
|
|
- >
|
|
|
- <view class="picker-value">
|
|
|
- <text>{{ selectedUser?.label || '请选择' }}</text>
|
|
|
- </view>
|
|
|
- </picker>
|
|
|
- <view class="popup-actions">
|
|
|
- <button class="action-btn cancel-btn" @click="closeSelectUserPopup">取消</button>
|
|
|
- <button class="action-btn confirm-btn" @click="confirmSelectUser">确定</button>
|
|
|
+ </wd-popup>
|
|
|
+
|
|
|
+ <wd-popup position="center" v-model="showSelectUser">
|
|
|
+ <view class="popup-body">
|
|
|
+ <view class="confirm-title">确认通过</view>
|
|
|
+ <view class="confirm-content">确定要通过检验方案吗?</view>
|
|
|
+ <view class="popup-bottom-box">
|
|
|
+ <button class="bottom-btn white-btn" @click="closeSelectUserPopup">取消</button>
|
|
|
+ <button class="bottom-btn" @click="confirmApprove">确定</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </wd-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { ref, onMounted } from 'vue'
|
|
|
+import { ref, watch } from 'vue'
|
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
|
-import { getApprovalDetail, getUserGroupUserList, passOpinionNoticeApproval, rejectOpinionNoticeApproval } from '@/api/task'
|
|
|
-import NavBar from '@/components/NavBar/NavBar.vue'
|
|
|
-
|
|
|
-interface UserItem {
|
|
|
- id: string
|
|
|
- nickname: string
|
|
|
- label: string
|
|
|
- value: string
|
|
|
-}
|
|
|
+import ReportNavBar from '@/components/NavBar/ReportNavBar.vue'
|
|
|
+import { useToast } from 'wot-design-uni'
|
|
|
+import SpreadPDFViewer from '@/components/SpreadDesigner/SpreadPDFViewer.vue'
|
|
|
|
|
|
-const loading = ref(false)
|
|
|
-const pdfUrl = ref('')
|
|
|
-const showGoBack = ref(false)
|
|
|
-const showSelectUser = ref(false)
|
|
|
-const goBackReason = ref('')
|
|
|
-const selectedUser = ref<UserItem | null>(null)
|
|
|
-const auditUserGroupList = ref<UserItem[]>([])
|
|
|
-const defaultSelect = ref<UserItem | null>(null)
|
|
|
+import { useConfigStore } from '@/store/config'
|
|
|
|
|
|
-let id = ''
|
|
|
+import { buildFileUrl } from '@/utils/index'
|
|
|
+import { getDynamicTbVal } from '@/api/task'
|
|
|
+import { getStandardTemplate } from '@/api/index'
|
|
|
+import { requestFunc, ApprovalFuncName } from '@/api/ApiRouter/approval'
|
|
|
|
|
|
-onLoad((options) => {
|
|
|
- id = options.id || ''
|
|
|
+defineOptions({
|
|
|
+ name: 'InspectionPlanAuditPreview',
|
|
|
})
|
|
|
|
|
|
-// 获取批准人列表
|
|
|
-const getAuditUserGroupList = async () => {
|
|
|
- try {
|
|
|
- const groupRes: any = await getApprovalDetail({})
|
|
|
- const inspectionApproveId = groupRes?.data?.inspectionApproveId || ''
|
|
|
-
|
|
|
- const userRes: any = await getUserGroupUserList({ category: 700, status: 0 })
|
|
|
- const list = (userRes?.data || []).map((item: any) => ({
|
|
|
- ...item,
|
|
|
- label: item.nickname,
|
|
|
- value: item.id,
|
|
|
- }))
|
|
|
-
|
|
|
- const defaultItem = list.find((item: UserItem) => item.value === inspectionApproveId) || null
|
|
|
- defaultSelect.value = defaultItem
|
|
|
- auditUserGroupList.value = list
|
|
|
- } catch (error) {
|
|
|
- console.error('获取批准人列表失败:', error)
|
|
|
- }
|
|
|
-}
|
|
|
+const id = ref('')
|
|
|
+const templateIdFromRoute = ref('')
|
|
|
+
|
|
|
+const equipType = useConfigStore().getEquipType()
|
|
|
+
|
|
|
+const spreadPdfViewerRef = ref<any>(null)
|
|
|
+const templateBlob = ref<any>(null)
|
|
|
+const businessConfig = ref<any>({
|
|
|
+ businessType: 'JYFA',
|
|
|
+ title: '检验方案审核',
|
|
|
+ disableNavigate: true,
|
|
|
+ ui: {
|
|
|
+ title: '检验方案审核',
|
|
|
+ saveButtonText: '保存',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ showAdditionalToolbar: true,
|
|
|
+ customButtons: [],
|
|
|
+ },
|
|
|
+})
|
|
|
+const templateData = ref<any>({})
|
|
|
|
|
|
-// 获取 PDF 文件
|
|
|
-const getReportPdf = async () => {
|
|
|
- loading.value = true
|
|
|
- try {
|
|
|
- // 这里需要根据实际 API 调整
|
|
|
- // reportPreviewApi 返回的是 base64 或文件 URL
|
|
|
- const params = {
|
|
|
- reportId: id,
|
|
|
- fileType: 200,
|
|
|
- isBase64: true,
|
|
|
- }
|
|
|
-
|
|
|
- // TODO: 调用报告预览 API
|
|
|
- // const result = await reportPreviewApi(params)
|
|
|
- // if (result) {
|
|
|
- // pdfUrl.value = `data:application/pdf;base64,${result}`
|
|
|
- // }
|
|
|
-
|
|
|
- // 临时使用空 URL,实际使用时需要替换为真实 API
|
|
|
- pdfUrl.value = ''
|
|
|
- } catch (error) {
|
|
|
- console.error('获取 PDF 失败:', error)
|
|
|
- uni.showToast({ title: '加载报告失败', icon: 'error' })
|
|
|
- } finally {
|
|
|
- loading.value = false
|
|
|
- }
|
|
|
-}
|
|
|
+onLoad((options: any) => {
|
|
|
+ id.value = options?.id || ''
|
|
|
+ templateIdFromRoute.value = options?.templateId || ''
|
|
|
+})
|
|
|
|
|
|
-// 初始化
|
|
|
-onMounted(() => {
|
|
|
- getReportPdf()
|
|
|
- getAuditUserGroupList()
|
|
|
+watch(id, (newVal) => {
|
|
|
+ if (newVal) {
|
|
|
+ loadPreviewData()
|
|
|
+ }
|
|
|
})
|
|
|
|
|
|
-// 返回
|
|
|
-const goBack = () => {
|
|
|
- uni.navigateBack()
|
|
|
+const loadPreviewData = async () => {
|
|
|
+ const tmplId = templateIdFromRoute.value
|
|
|
+ const refId = id.value
|
|
|
+
|
|
|
+ const res = await getStandardTemplate({ id: tmplId })
|
|
|
+ const resData = (res as any).data
|
|
|
+ const dataMap: any = {}
|
|
|
+ const dynamicTbResp = await getDynamicTbVal({ refId })
|
|
|
+ const dynamicTb: any = dynamicTbResp.data
|
|
|
+ for (let i = 0; i < dynamicTb.dynamicTbValRespVOList.length; i++) {
|
|
|
+ const item = dynamicTb.dynamicTbValRespVOList[i]
|
|
|
+ dataMap[item.colCode] = item.valValue
|
|
|
+ }
|
|
|
+ templateData.value = {
|
|
|
+ schema: resData.bindingPathSchema ? JSON.parse(resData.bindingPathSchema) : {},
|
|
|
+ data: {
|
|
|
+ ...dataMap,
|
|
|
+ templateId: tmplId,
|
|
|
+ templateUrl: resData.fileUrl,
|
|
|
+ },
|
|
|
+ pathNameMapping: JSON.parse(resData.bindingPathNameJson),
|
|
|
+ template: tmplId,
|
|
|
+ templateUrl: resData.fileUrl,
|
|
|
+ }
|
|
|
+
|
|
|
+ const fileUri = resData.fileUrl
|
|
|
+ const fileUrl = buildFileUrl(fileUri)
|
|
|
+ const fileBase64 = await spreadPdfViewerRef.value.downloadFileAsBase64(fileUrl)
|
|
|
+ templateBlob.value = fileBase64
|
|
|
}
|
|
|
|
|
|
-// 显示退回弹窗
|
|
|
-const showGoBackPopup = () => {
|
|
|
+const showGoBack = ref(false)
|
|
|
+const goBackReason = ref('')
|
|
|
+
|
|
|
+const showGoBackPopupFn = () => {
|
|
|
+ goBackReason.value = ''
|
|
|
showGoBack.value = true
|
|
|
}
|
|
|
|
|
|
-// 关闭退回弹窗
|
|
|
const closeGoBackPopup = () => {
|
|
|
- showGoBack.value = false
|
|
|
goBackReason.value = ''
|
|
|
+ showGoBack.value = false
|
|
|
}
|
|
|
|
|
|
-// 显示选择批准人弹窗
|
|
|
-const handleFinish = () => {
|
|
|
- showSelectUser.value = true
|
|
|
-}
|
|
|
-
|
|
|
-// 关闭选择批准人弹窗
|
|
|
-const closeSelectUserPopup = () => {
|
|
|
- showSelectUser.value = false
|
|
|
- selectedUser.value = null
|
|
|
-}
|
|
|
-
|
|
|
-// 用户选择变化
|
|
|
-const onUserChange = (e: any) => {
|
|
|
- const index = e.detail.value
|
|
|
- selectedUser.value = auditUserGroupList.value[index]
|
|
|
-}
|
|
|
-
|
|
|
-// 确认选择用户
|
|
|
-const confirmSelectUser = () => {
|
|
|
- if (!selectedUser.value) {
|
|
|
- uni.showToast({ title: '请选择批准人', icon: 'error' })
|
|
|
- return
|
|
|
+const toast = useToast()
|
|
|
+const confirmReject = async () => {
|
|
|
+ if (!goBackReason.value.trim()) {
|
|
|
+ return toast.error('请输入退回原因')
|
|
|
}
|
|
|
-
|
|
|
- uni.showModal({
|
|
|
- title: '确认',
|
|
|
- content: `确定通过吗?`,
|
|
|
- success: (res) => {
|
|
|
- if (res.confirm) {
|
|
|
- handlePassFn(selectedUser.value)
|
|
|
- } else {
|
|
|
- closeSelectUserPopup()
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
-}
|
|
|
|
|
|
-// 通过操作
|
|
|
-const handlePassFn = async (select: UserItem) => {
|
|
|
- const params = {
|
|
|
- ids: [id],
|
|
|
- ratifyId: select.value,
|
|
|
- reportType: 600,
|
|
|
- }
|
|
|
+ uni.showLoading({ title: '退回中...' })
|
|
|
|
|
|
try {
|
|
|
- const result: any = await passOpinionNoticeApproval(params)
|
|
|
+ const result: any = await requestFunc(ApprovalFuncName.InspectionPlanReject, equipType, {
|
|
|
+ ids: [id.value],
|
|
|
+ reason: goBackReason.value.trim(),
|
|
|
+ reportType: 600,
|
|
|
+ })
|
|
|
+ uni.hideLoading()
|
|
|
+
|
|
|
if (result?.code === 0) {
|
|
|
- uni.showToast({ title: '审核成功', icon: 'success', duration: 3000 })
|
|
|
+ uni.showToast({ title: '退回成功', icon: 'success' })
|
|
|
+ uni.$emit('UpdateNum', ['inspectionPlanAudit', 'inspectionApproval'])
|
|
|
+ uni.$emit('onRefresh')
|
|
|
+ closeGoBackPopup()
|
|
|
setTimeout(() => {
|
|
|
- uni.$emit('UpdateNum', ['inspectionPlanAudit', 'inspectionApproval'])
|
|
|
- uni.$emit('onRefresh')
|
|
|
uni.navigateBack()
|
|
|
- }, 1500)
|
|
|
+ }, 1000)
|
|
|
} else {
|
|
|
- uni.showToast({ title: result?.msg || '审核失败', icon: 'error' })
|
|
|
+ uni.showToast({ title: result?.msg || '退回失败', icon: 'error' })
|
|
|
}
|
|
|
- } catch (error: any) {
|
|
|
- console.error('审核失败:', error)
|
|
|
- uni.showToast({ title: error?.msg || '审核失败', icon: 'error' })
|
|
|
+ } catch (error) {
|
|
|
+ uni.hideLoading()
|
|
|
+ uni.showToast({ title: '退回失败,请重试', icon: 'error' })
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-// 退回操作
|
|
|
-const goBackAction = async () => {
|
|
|
- if (!goBackReason.value.trim()) {
|
|
|
- uni.showToast({ title: '请输入退回原因', icon: 'error' })
|
|
|
- return
|
|
|
- }
|
|
|
+const showSelectUser = ref(false)
|
|
|
|
|
|
- const params = {
|
|
|
- ids: [id],
|
|
|
- reason: goBackReason.value.trim(),
|
|
|
- reportType: 600,
|
|
|
- }
|
|
|
+const showSelectUserPopupFn = () => {
|
|
|
+ showSelectUser.value = true
|
|
|
+}
|
|
|
+
|
|
|
+const closeSelectUserPopup = () => {
|
|
|
+ showSelectUser.value = false
|
|
|
+}
|
|
|
+
|
|
|
+const confirmApprove = async () => {
|
|
|
+ uni.showLoading({ title: '提交中...' })
|
|
|
|
|
|
try {
|
|
|
- const result: any = await rejectOpinionNoticeApproval(params)
|
|
|
+ const result: any = await requestFunc(ApprovalFuncName.InspectionPlanApprove, equipType, {
|
|
|
+ ids: [id.value],
|
|
|
+ reason: '',
|
|
|
+ reportType: 600,
|
|
|
+ })
|
|
|
+ uni.hideLoading()
|
|
|
+
|
|
|
if (result?.code === 0) {
|
|
|
- uni.showToast({ title: '退回成功', icon: 'success', duration: 3000 })
|
|
|
+ uni.showToast({ title: '审核成功', icon: 'success' })
|
|
|
+ uni.$emit('UpdateNum', ['inspectionPlanAudit', 'inspectionApproval'])
|
|
|
+ uni.$emit('onRefresh')
|
|
|
+ closeSelectUserPopup()
|
|
|
setTimeout(() => {
|
|
|
- uni.$emit('UpdateNum', ['inspectionPlanAudit', 'inspectionApproval'])
|
|
|
- uni.$emit('onRefresh')
|
|
|
uni.navigateBack()
|
|
|
- }, 1500)
|
|
|
+ }, 1000)
|
|
|
} else {
|
|
|
- uni.showToast({ title: result?.msg || '退回失败', icon: 'error' })
|
|
|
+ uni.showToast({ title: result?.msg || '审核失败', icon: 'error' })
|
|
|
}
|
|
|
- } catch (error: any) {
|
|
|
- console.error('退回失败:', error)
|
|
|
- uni.showToast({ title: error?.msg || '退回失败', icon: 'error' })
|
|
|
- } finally {
|
|
|
- closeGoBackPopup()
|
|
|
+ } catch (error) {
|
|
|
+ uni.hideLoading()
|
|
|
+ uni.showToast({ title: '审核失败,请重试', icon: 'error' })
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
-// PDF 加载错误
|
|
|
-const onPdfError = (event: any) => {
|
|
|
- console.error('PDF 加载失败:', event)
|
|
|
- uni.showToast({ title: 'PDF 加载失败', icon: 'error' })
|
|
|
-}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.preview-container {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- height: 100vh;
|
|
|
+ min-height: 100vh;
|
|
|
background-color: #f5f5f5;
|
|
|
}
|
|
|
|
|
|
-.navigate-view {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- height: 44px;
|
|
|
- background-color: #fff;
|
|
|
- border-bottom: 1px solid #eee;
|
|
|
- padding: 0 15px;
|
|
|
-}
|
|
|
-
|
|
|
-.navigate-left {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-
|
|
|
-.back-icon {
|
|
|
- width: 20px;
|
|
|
- height: 20px;
|
|
|
+.nav-btn {
|
|
|
+ padding: 4px 8px;
|
|
|
+ margin: 0 0 0 4px !important;
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 1.4;
|
|
|
+ color: #fff;
|
|
|
+ border: none;
|
|
|
+ border-radius: 3px;
|
|
|
}
|
|
|
|
|
|
-.navigate-title {
|
|
|
- font-size: 17px;
|
|
|
- font-weight: 500;
|
|
|
- color: #333;
|
|
|
+.btn-orange {
|
|
|
+ background-color: #f5a623;
|
|
|
}
|
|
|
|
|
|
-.navigate-right {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- gap: 10px;
|
|
|
+.btn-blue {
|
|
|
+ background-color: #2f8eff;
|
|
|
}
|
|
|
|
|
|
-.action-btn {
|
|
|
- padding: 6px 12px;
|
|
|
- border-radius: 3px;
|
|
|
+.popup-body {
|
|
|
+ width: 80vw;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 10px;
|
|
|
+ padding: 2vh 0 0 0;
|
|
|
}
|
|
|
|
|
|
-.btn-text {
|
|
|
+.center-text {
|
|
|
font-size: 14px;
|
|
|
+ color: rgb(51, 51, 51);
|
|
|
}
|
|
|
|
|
|
-.reject {
|
|
|
- color: #FF4445;
|
|
|
-}
|
|
|
-
|
|
|
-.pass {
|
|
|
- color: rgb(47, 142, 255);
|
|
|
-}
|
|
|
-
|
|
|
-.pdf-container {
|
|
|
+.input-area {
|
|
|
flex: 1;
|
|
|
- background-color: #f5f5f5;
|
|
|
+ height: 80px;
|
|
|
+ border-radius: 6px;
|
|
|
+ border: 1px solid rgb(187, 187, 187);
|
|
|
+ padding: 8px;
|
|
|
+ font-size: 14px;
|
|
|
}
|
|
|
|
|
|
-.loading-container {
|
|
|
+.popup-bottom-box {
|
|
|
display: flex;
|
|
|
- justify-content: center;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: space-between;
|
|
|
align-items: center;
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-
|
|
|
-.loading-text {
|
|
|
- color: #999;
|
|
|
- font-size: 14px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ padding: 0 20px;
|
|
|
}
|
|
|
|
|
|
-.popup-overlay {
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- bottom: 0;
|
|
|
- background-color: rgba(0, 0, 0, 0.5);
|
|
|
+.bottom-btn {
|
|
|
+ flex: 1;
|
|
|
+ height: 40px;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
- align-items: flex-start;
|
|
|
- z-index: 999;
|
|
|
- padding-top: 20%;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 4px;
|
|
|
+ background-color: rgb(47, 142, 255);
|
|
|
+ color: rgb(241, 247, 255);
|
|
|
+ font-size: 15px;
|
|
|
+ line-height: 40px;
|
|
|
+ margin: 0;
|
|
|
}
|
|
|
|
|
|
-.popup-content {
|
|
|
- width: 66.67%;
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 10px;
|
|
|
- padding: 0;
|
|
|
+.bottom-btn::after {
|
|
|
+ border: none;
|
|
|
}
|
|
|
|
|
|
-.popup-title {
|
|
|
- font-size: 21px;
|
|
|
+.white-btn {
|
|
|
+ border: 1px solid rgb(187, 187, 187);
|
|
|
+ background-color: rgb(255, 255, 255);
|
|
|
color: rgb(51, 51, 51);
|
|
|
- padding: 20px;
|
|
|
- display: block;
|
|
|
+ margin-right: 20px;
|
|
|
}
|
|
|
|
|
|
-.form-item {
|
|
|
+.row {
|
|
|
display: flex;
|
|
|
- flex-direction: column;
|
|
|
- margin-bottom: 20px;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: flex-start;
|
|
|
padding: 0 20px;
|
|
|
-}
|
|
|
-
|
|
|
-.form-label {
|
|
|
- font-size: 16px;
|
|
|
- color: rgb(51, 51, 51);
|
|
|
-}
|
|
|
-
|
|
|
-.input-area {
|
|
|
- flex: 1;
|
|
|
- min-height: 83px;
|
|
|
- border: 1px solid rgb(187, 187, 187);
|
|
|
- border-radius: 6px;
|
|
|
- margin-top: 15px;
|
|
|
- padding: 5px;
|
|
|
- font-size: 14px;
|
|
|
+ margin-bottom: 2vh;
|
|
|
}
|
|
|
|
|
|
.picker-value {
|
|
|
- padding: 15px 20px;
|
|
|
- font-size: 16px;
|
|
|
- color: #333;
|
|
|
-}
|
|
|
-
|
|
|
-.popup-actions {
|
|
|
display: flex;
|
|
|
- flex-direction: row;
|
|
|
- justify-content: space-between;
|
|
|
align-items: center;
|
|
|
- margin-bottom: 20px;
|
|
|
- padding: 0 20px;
|
|
|
- gap: 10px;
|
|
|
-}
|
|
|
-
|
|
|
-.action-btn {
|
|
|
- flex: 1;
|
|
|
- height: 39px;
|
|
|
+ padding: 0 10px;
|
|
|
+ background-color: #f5f5f5;
|
|
|
border-radius: 4px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- font-size: 16px;
|
|
|
- border: none;
|
|
|
}
|
|
|
-
|
|
|
-.cancel-btn {
|
|
|
- background-color: #fff;
|
|
|
+.confirm-title {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ text-align: center;
|
|
|
color: rgb(51, 51, 51);
|
|
|
- border: 1px solid rgb(187, 187, 187);
|
|
|
+ margin-bottom: 20px;
|
|
|
}
|
|
|
|
|
|
-.confirm-btn {
|
|
|
- background-color: rgb(47, 142, 255);
|
|
|
- color: rgb(241, 247, 255);
|
|
|
+.confirm-content {
|
|
|
+ font-size: 14px;
|
|
|
+ text-align: center;
|
|
|
+ color: rgb(102, 102, 102);
|
|
|
+ margin-bottom: 30px;
|
|
|
+ padding: 0 20px;
|
|
|
}
|
|
|
</style>
|