hookehuyr

feat(认证): 添加车辆认证页面及功能

实现车辆认证页面,包括图片上传、表单填写和提交功能
将样式从vue文件拆分到单独的less文件
更新路由配置添加认证页面
修复认证跳转链接错误
1 /* 1 /*
2 * @Date: 2025-06-28 10:33:00 2 * @Date: 2025-06-28 10:33:00
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-07-02 17:15:42 4 + * @LastEditTime: 2025-07-02 18:16:09
5 * @FilePath: /jgdl/src/app.config.js 5 * @FilePath: /jgdl/src/app.config.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
...@@ -15,6 +15,7 @@ export default { ...@@ -15,6 +15,7 @@ export default {
15 'pages/editProfile/index', 15 'pages/editProfile/index',
16 'pages/register/index', 16 'pages/register/index',
17 'pages/authCar/index', 17 'pages/authCar/index',
18 + 'pages/setAuthCar/index',
18 'pages/auth/index', 19 'pages/auth/index',
19 ], 20 ],
20 subpackages: [ // 配置在tabBar中的页面不能分包写到subpackages中去 21 subpackages: [ // 配置在tabBar中的页面不能分包写到subpackages中去
......
1 <!-- 1 <!--
2 * @Date: 2022-09-19 14:11:06 2 * @Date: 2022-09-19 14:11:06
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-07-02 17:36:43 4 + * @LastEditTime: 2025-07-02 18:15:19
5 * @FilePath: /jgdl/src/pages/authCar/index.vue 5 * @FilePath: /jgdl/src/pages/authCar/index.vue
6 * @Description: 认证车源 6 * @Description: 认证车源
7 --> 7 -->
...@@ -107,6 +107,7 @@ ...@@ -107,6 +107,7 @@
107 </template> 107 </template>
108 108
109 <script setup> 109 <script setup>
110 +import Taro from '@tarojs/taro'
110 import { ref, computed, onMounted } from 'vue' 111 import { ref, computed, onMounted } from 'vue'
111 import { Check, RectRight, Addfollow, HeartFill } from '@nutui/icons-vue-taro' 112 import { Check, RectRight, Addfollow, HeartFill } from '@nutui/icons-vue-taro'
112 import './index.less' 113 import './index.less'
...@@ -189,9 +190,8 @@ const scrollStyle = computed(() => { ...@@ -189,9 +190,8 @@ const scrollStyle = computed(() => {
189 * 处理认证按钮点击 190 * 处理认证按钮点击
190 */ 191 */
191 const handleAuth = () => { 192 const handleAuth = () => {
192 - showToast('跳转到认证页面', 'success')
193 // TODO: 跳转到认证页面 193 // TODO: 跳转到认证页面
194 - // Taro.navigateTo({ url: '/pages/auth/index' }) 194 + Taro.navigateTo({ url: '/pages/setAuthCar/index' })
195 } 195 }
196 196
197 /** 197 /**
......
...@@ -141,7 +141,7 @@ ...@@ -141,7 +141,7 @@
141 <script setup> 141 <script setup>
142 import { ref, reactive, computed, onMounted } from 'vue' 142 import { ref, reactive, computed, onMounted } from 'vue'
143 import Taro from '@tarojs/taro' 143 import Taro from '@tarojs/taro'
144 -import { RectLeft, Camera, Right } from '@nutui/icons-vue-taro' 144 +import { RectLeft, Right } from '@nutui/icons-vue-taro'
145 import './index.less' 145 import './index.less'
146 146
147 // 主题配置 147 // 主题配置
......
1 +.sell-page {
2 + min-height: 100vh;
3 + background-color: #f5f5f5;
4 + padding-bottom: 120rpx;
5 +}
6 +
7 +.form-container {
8 + padding: 0 32rpx;
9 + margin-bottom: 2rem;
10 +}
11 +
12 +.form-section {
13 + background-color: #ffffff;
14 + border-radius: 24rpx;
15 + padding: 32rpx;
16 + margin: 24rpx 0;
17 +}
18 +
19 +.section-title {
20 + font-size: 32rpx;
21 + font-weight: 600;
22 + color: #111827;
23 + margin-bottom: 32rpx;
24 + display: block;
25 +}
26 +
27 +.upload-grid {
28 + display: grid;
29 + grid-template-columns: repeat(2, 1fr);
30 + gap: 32rpx;
31 + margin-top: 24rpx;
32 +}
33 +
34 +.upload-item {
35 + display: flex;
36 + flex-direction: column;
37 + align-items: center;
38 + gap: 16rpx;
39 +}
40 +
41 +.upload-button {
42 + width: 160rpx;
43 + height: 160rpx;
44 + border: 2rpx dashed #d1d5db;
45 + border-radius: 16rpx;
46 + display: flex;
47 + align-items: center;
48 + justify-content: center;
49 + background-color: #f9fafb;
50 + transition: all 0.3s ease;
51 +}
52 +
53 +.upload-button:active {
54 + background-color: #f3f4f6;
55 + border-color: #f97316;
56 +}
57 +
58 +.upload-icon {
59 + font-size: 48rpx;
60 + color: #9ca3af;
61 +}
62 +
63 +.upload-label {
64 + font-size: 24rpx;
65 + color: #6b7280;
66 + text-align: center;
67 +}
68 +
69 +.image-preview {
70 + position: relative;
71 + width: 160rpx;
72 + height: 160rpx;
73 + border-radius: 16rpx;
74 + overflow: hidden;
75 +}
76 +
77 +.preview-image {
78 + width: 100%;
79 + height: 100%;
80 + object-fit: cover;
81 +}
82 +
83 +.delete-btn {
84 + position: absolute;
85 + top: 8rpx;
86 + right: 8rpx;
87 + width: 32rpx;
88 + height: 32rpx;
89 + background-color: #ef4444;
90 + border-radius: 50%;
91 + display: flex;
92 + align-items: center;
93 + justify-content: center;
94 + color: white;
95 + font-size: 16rpx;
96 + z-index: 10;
97 + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.15);
98 +}
99 +
100 +.delete-icon {
101 + font-size: 16rpx;
102 + color: white;
103 +}
104 +
105 +.form-item {
106 + display: flex;
107 + justify-content: space-between;
108 + align-items: center;
109 + padding: 32rpx 0;
110 + border-bottom: 1rpx solid #f3f4f6;
111 +}
112 +
113 +.form-item:last-child {
114 + border-bottom: none;
115 +}
116 +
117 +.form-item-left {
118 + display: flex;
119 + align-items: center;
120 +}
121 +
122 +.form-icon {
123 + margin-right: 16rpx;
124 + color: #9ca3af;
125 +}
126 +
127 +.form-label {
128 + font-size: 28rpx;
129 + color: #374151;
130 +}
131 +
132 +.form-item-right {
133 + display: flex;
134 + align-items: center;
135 +}
136 +
137 +.form-value {
138 + font-size: 28rpx;
139 + color: #9ca3af;
140 + margin-right: 16rpx;
141 +}
142 +
143 +.arrow-icon {
144 + color: #9ca3af;
145 +}
146 +
147 +.form-item-content {
148 + display: flex;
149 + justify-content: space-between;
150 + align-items: center;
151 + width: 100%;
152 + padding: 24rpx 0;
153 +}
154 +
155 +.unit {
156 + font-size: 28rpx;
157 + color: #9ca3af;
158 + margin-left: 16rpx;
159 +}
160 +
161 +.price-symbol {
162 + font-size: 32rpx;
163 + color: #f97316;
164 + font-weight: 600;
165 + margin-right: 8rpx;
166 +}
167 +
168 +.price-input {
169 + font-size: 32rpx;
170 + color: #f97316;
171 + font-weight: 600;
172 + text-align: right;
173 + border: none;
174 + outline: none;
175 + background: transparent;
176 + width: 160rpx;
177 +}
178 +
179 +.market-price-symbol {
180 + font-size: 28rpx;
181 + color: #9ca3af;
182 + margin-right: 8rpx;
183 +}
184 +
185 +.market-price-input {
186 + font-size: 28rpx;
187 + color: #9ca3af;
188 + text-align: right;
189 + border: none;
190 + outline: none;
191 + background: transparent;
192 + width: 160rpx;
193 +}
194 +
195 +.bottom-actions {
196 + position: fixed;
197 + bottom: 0;
198 + left: 0;
199 + right: 0;
200 + background-color: #ffffff;
201 + padding: 24rpx 32rpx;
202 + border-top: 1rpx solid #f3f4f6;
203 + z-index: 100;
204 +}
205 +
206 +// NutUI组件样式覆盖
207 +:deep(.nut-form-item) {
208 + padding: 0;
209 + margin-bottom: 0;
210 + border-bottom: 1rpx solid #f3f4f6;
211 +}
212 +
213 +// :deep(.nut-form-item:last-child) {
214 +// border-bottom: none;
215 +// }
216 +
217 +:deep(.nut-form-item__body) {
218 + padding: 32rpx 0;
219 +}
220 +
221 +:deep(.nut-form-item__label) {
222 + font-size: 28rpx;
223 + color: #374151;
224 + margin-right: 32rpx;
225 +}
226 +
227 +:deep(.nut-input) {
228 + text-align: right;
229 +}
230 +
231 +:deep(.nut-input__input) {
232 + font-size: 28rpx;
233 + color: #374151;
234 + text-align: right;
235 +}
236 +
237 +:deep(.nut-textarea) {
238 + border: 1rpx solid #e5e7eb;
239 + border-radius: 16rpx;
240 + padding: 24rpx;
241 +}
242 +
243 +:deep(.nut-textarea__textarea) {
244 + font-size: 28rpx;
245 + color: #374151;
246 + line-height: 1.5;
247 +}
248 +
249 +:deep(.nut-uploader) {
250 + margin-bottom: 0;
251 +}
252 +
253 +:deep(.nut-uploader__preview) {
254 + margin-bottom: 0;
255 +}
256 +
257 +:deep(.nut-uploader__preview-img) {
258 + width: 160rpx;
259 + height: 160rpx;
260 + border-radius: 16rpx;
261 + object-fit: cover;
262 +}
263 +
264 +:deep(.nut-uploader__upload) {
265 + width: 160rpx;
266 + height: 160rpx;
267 +}
268 +
269 +:deep(.nut-uploader__input) {
270 + width: 100%;
271 + height: 100%;
272 +}
273 +
274 +:deep(.nut-uploader__preview-delete) {
275 + position: absolute;
276 + top: 8rpx;
277 + right: 8rpx;
278 + width: 32rpx;
279 + height: 32rpx;
280 + background-color: rgba(0, 0, 0, 0.6);
281 + border-radius: 50%;
282 + display: flex;
283 + align-items: center;
284 + justify-content: center;
285 + color: #ffffff;
286 + font-size: 20rpx;
287 +}
288 +
289 +:deep(.nut-picker__toolbar) {
290 + padding: 24rpx 32rpx;
291 +}
292 +
293 +:deep(.nut-picker__cancel) {
294 + color: #9ca3af;
295 +}
296 +
297 +:deep(.nut-picker__confirm) {
298 + color: #f97316;
299 +}
300 +
301 +:deep(.nut-picker__title) {
302 + font-size: 32rpx;
303 + font-weight: 600;
304 +}
...@@ -296,6 +296,7 @@ import { ref, reactive } from 'vue' ...@@ -296,6 +296,7 @@ import { ref, reactive } from 'vue'
296 import { Plus, Right, Location, RectLeft, Close } from '@nutui/icons-vue-taro' 296 import { Plus, Right, Location, RectLeft, Close } from '@nutui/icons-vue-taro'
297 import Taro from '@tarojs/taro' 297 import Taro from '@tarojs/taro'
298 // import BASE_URL from '@/utils/config'; 298 // import BASE_URL from '@/utils/config';
299 +import './index.less'
299 300
300 const themeVars = ref({ 301 const themeVars = ref({
301 navbarBackground: '#fb923c', 302 navbarBackground: '#fb923c',
...@@ -761,310 +762,3 @@ const validateForm = () => { ...@@ -761,310 +762,3 @@ const validateForm = () => {
761 return true 762 return true
762 } 763 }
763 </script> 764 </script>
764 -
765 -<style lang="less">
766 -.sell-page {
767 - min-height: 100vh;
768 - background-color: #f5f5f5;
769 - padding-bottom: 120rpx;
770 -}
771 -
772 -.form-container {
773 - padding: 0 32rpx;
774 - margin-bottom: 2rem;
775 -}
776 -
777 -.form-section {
778 - background-color: #ffffff;
779 - border-radius: 24rpx;
780 - padding: 32rpx;
781 - margin: 24rpx 0;
782 -}
783 -
784 -.section-title {
785 - font-size: 32rpx;
786 - font-weight: 600;
787 - color: #111827;
788 - margin-bottom: 32rpx;
789 - display: block;
790 -}
791 -
792 -.upload-grid {
793 - display: grid;
794 - grid-template-columns: repeat(2, 1fr);
795 - gap: 32rpx;
796 - margin-top: 24rpx;
797 -}
798 -
799 -.upload-item {
800 - display: flex;
801 - flex-direction: column;
802 - align-items: center;
803 - gap: 16rpx;
804 -}
805 -
806 -.upload-button {
807 - width: 160rpx;
808 - height: 160rpx;
809 - border: 2rpx dashed #d1d5db;
810 - border-radius: 16rpx;
811 - display: flex;
812 - align-items: center;
813 - justify-content: center;
814 - background-color: #f9fafb;
815 - transition: all 0.3s ease;
816 -}
817 -
818 -.upload-button:active {
819 - background-color: #f3f4f6;
820 - border-color: #f97316;
821 -}
822 -
823 -.upload-icon {
824 - font-size: 48rpx;
825 - color: #9ca3af;
826 -}
827 -
828 -.upload-label {
829 - font-size: 24rpx;
830 - color: #6b7280;
831 - text-align: center;
832 -}
833 -
834 -.image-preview {
835 - position: relative;
836 - width: 160rpx;
837 - height: 160rpx;
838 - border-radius: 16rpx;
839 - overflow: hidden;
840 -}
841 -
842 -.preview-image {
843 - width: 100%;
844 - height: 100%;
845 - object-fit: cover;
846 -}
847 -
848 -.delete-btn {
849 - position: absolute;
850 - top: 8rpx;
851 - right: 8rpx;
852 - width: 32rpx;
853 - height: 32rpx;
854 - background-color: #ef4444;
855 - border-radius: 50%;
856 - display: flex;
857 - align-items: center;
858 - justify-content: center;
859 - color: white;
860 - font-size: 16rpx;
861 - z-index: 10;
862 - box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.15);
863 -}
864 -
865 -.delete-icon {
866 - font-size: 16rpx;
867 - color: white;
868 -}
869 -
870 -.form-item {
871 - display: flex;
872 - justify-content: space-between;
873 - align-items: center;
874 - padding: 32rpx 0;
875 - border-bottom: 1rpx solid #f3f4f6;
876 -}
877 -
878 -.form-item:last-child {
879 - border-bottom: none;
880 -}
881 -
882 -.form-item-left {
883 - display: flex;
884 - align-items: center;
885 -}
886 -
887 -.form-icon {
888 - margin-right: 16rpx;
889 - color: #9ca3af;
890 -}
891 -
892 -.form-label {
893 - font-size: 28rpx;
894 - color: #374151;
895 -}
896 -
897 -.form-item-right {
898 - display: flex;
899 - align-items: center;
900 -}
901 -
902 -.form-value {
903 - font-size: 28rpx;
904 - color: #9ca3af;
905 - margin-right: 16rpx;
906 -}
907 -
908 -.arrow-icon {
909 - color: #9ca3af;
910 -}
911 -
912 -.form-item-content {
913 - display: flex;
914 - justify-content: space-between;
915 - align-items: center;
916 - width: 100%;
917 - padding: 24rpx 0;
918 -}
919 -
920 -.unit {
921 - font-size: 28rpx;
922 - color: #9ca3af;
923 - margin-left: 16rpx;
924 -}
925 -
926 -.price-symbol {
927 - font-size: 32rpx;
928 - color: #f97316;
929 - font-weight: 600;
930 - margin-right: 8rpx;
931 -}
932 -
933 -.price-input {
934 - font-size: 32rpx;
935 - color: #f97316;
936 - font-weight: 600;
937 - text-align: right;
938 - border: none;
939 - outline: none;
940 - background: transparent;
941 - width: 160rpx;
942 -}
943 -
944 -.market-price-symbol {
945 - font-size: 28rpx;
946 - color: #9ca3af;
947 - margin-right: 8rpx;
948 -}
949 -
950 -.market-price-input {
951 - font-size: 28rpx;
952 - color: #9ca3af;
953 - text-align: right;
954 - border: none;
955 - outline: none;
956 - background: transparent;
957 - width: 160rpx;
958 -}
959 -
960 -.bottom-actions {
961 - position: fixed;
962 - bottom: 0;
963 - left: 0;
964 - right: 0;
965 - background-color: #ffffff;
966 - padding: 24rpx 32rpx;
967 - border-top: 1rpx solid #f3f4f6;
968 - z-index: 100;
969 -}
970 -
971 -// NutUI组件样式覆盖
972 -:deep(.nut-form-item) {
973 - padding: 0;
974 - margin-bottom: 0;
975 - border-bottom: 1rpx solid #f3f4f6;
976 -}
977 -
978 -// :deep(.nut-form-item:last-child) {
979 -// border-bottom: none;
980 -// }
981 -
982 -:deep(.nut-form-item__body) {
983 - padding: 32rpx 0;
984 -}
985 -
986 -:deep(.nut-form-item__label) {
987 - font-size: 28rpx;
988 - color: #374151;
989 - margin-right: 32rpx;
990 -}
991 -
992 -:deep(.nut-input) {
993 - text-align: right;
994 -}
995 -
996 -:deep(.nut-input__input) {
997 - font-size: 28rpx;
998 - color: #374151;
999 - text-align: right;
1000 -}
1001 -
1002 -:deep(.nut-textarea) {
1003 - border: 1rpx solid #e5e7eb;
1004 - border-radius: 16rpx;
1005 - padding: 24rpx;
1006 -}
1007 -
1008 -:deep(.nut-textarea__textarea) {
1009 - font-size: 28rpx;
1010 - color: #374151;
1011 - line-height: 1.5;
1012 -}
1013 -
1014 -:deep(.nut-uploader) {
1015 - margin-bottom: 0;
1016 -}
1017 -
1018 -:deep(.nut-uploader__preview) {
1019 - margin-bottom: 0;
1020 -}
1021 -
1022 -:deep(.nut-uploader__preview-img) {
1023 - width: 160rpx;
1024 - height: 160rpx;
1025 - border-radius: 16rpx;
1026 - object-fit: cover;
1027 -}
1028 -
1029 -:deep(.nut-uploader__upload) {
1030 - width: 160rpx;
1031 - height: 160rpx;
1032 -}
1033 -
1034 -:deep(.nut-uploader__input) {
1035 - width: 100%;
1036 - height: 100%;
1037 -}
1038 -
1039 -:deep(.nut-uploader__preview-delete) {
1040 - position: absolute;
1041 - top: 8rpx;
1042 - right: 8rpx;
1043 - width: 32rpx;
1044 - height: 32rpx;
1045 - background-color: rgba(0, 0, 0, 0.6);
1046 - border-radius: 50%;
1047 - display: flex;
1048 - align-items: center;
1049 - justify-content: center;
1050 - color: #ffffff;
1051 - font-size: 20rpx;
1052 -}
1053 -
1054 -:deep(.nut-picker__toolbar) {
1055 - padding: 24rpx 32rpx;
1056 -}
1057 -
1058 -:deep(.nut-picker__cancel) {
1059 - color: #9ca3af;
1060 -}
1061 -
1062 -:deep(.nut-picker__confirm) {
1063 - color: #f97316;
1064 -}
1065 -
1066 -:deep(.nut-picker__title) {
1067 - font-size: 32rpx;
1068 - font-weight: 600;
1069 -}
1070 -</style>
......
1 +/*
2 + * @Date: 2025-07-02 17:52:43
3 + * @LastEditors: hookehuyr hookehuyr@gmail.com
4 + * @LastEditTime: 2025-07-02 17:53:28
5 + * @FilePath: /jgdl/src/pages/setAuthCar/index.config.js
6 + * @Description: 文件描述
7 + */
8 +export default {
9 + navigationBarTitleText: '申请认证',
10 + usingComponents: {
11 + },
12 +}
1 +/* 申请认证页面样式 */
2 +.auth-car-page {
3 + min-height: 100vh;
4 + background-color: #f5f5f5;
5 + padding-bottom: 200rpx;
6 +}
7 +
8 +.form-container {
9 + padding: 20rpx 32rpx;
10 + margin-bottom: 2rem;
11 +}
12 +
13 +.form-section {
14 + background-color: #ffffff;
15 + border-radius: 24rpx;
16 + padding: 32rpx;
17 + margin: 24rpx 0;
18 +}
19 +
20 +.section-title {
21 + font-size: 32rpx;
22 + font-weight: 600;
23 + color: #111827;
24 + margin-bottom: 32rpx;
25 + display: block;
26 +}
27 +
28 +.upload-grid {
29 + display: grid;
30 + grid-template-columns: repeat(2, 1fr);
31 + gap: 32rpx;
32 + margin-top: 24rpx;
33 +}
34 +
35 +.upload-item {
36 + display: flex;
37 + flex-direction: column;
38 + align-items: center;
39 + gap: 16rpx;
40 +}
41 +
42 +.upload-button {
43 + width: 160rpx;
44 + height: 160rpx;
45 + border: 2rpx dashed #d1d5db;
46 + border-radius: 16rpx;
47 + display: flex;
48 + align-items: center;
49 + justify-content: center;
50 + background-color: #f9fafb;
51 + transition: all 0.3s ease;
52 +}
53 +
54 +.upload-button:active {
55 + background-color: #f3f4f6;
56 + border-color: #f97316;
57 +}
58 +
59 +.upload-icon {
60 + font-size: 48rpx;
61 + color: #9ca3af;
62 +}
63 +
64 +.upload-label {
65 + font-size: 24rpx;
66 + color: #6b7280;
67 + text-align: center;
68 +}
69 +
70 +.image-preview {
71 + position: relative;
72 + width: 160rpx;
73 + height: 160rpx;
74 + border-radius: 16rpx;
75 + overflow: hidden;
76 +}
77 +
78 +.preview-image {
79 + width: 100%;
80 + height: 100%;
81 + object-fit: cover;
82 +}
83 +
84 +.delete-btn {
85 + position: absolute;
86 + top: 8rpx;
87 + right: 8rpx;
88 + width: 32rpx;
89 + height: 32rpx;
90 + background-color: #ef4444;
91 + border-radius: 50%;
92 + display: flex;
93 + align-items: center;
94 + justify-content: center;
95 + color: white;
96 + font-size: 16rpx;
97 + z-index: 10;
98 + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.15);
99 +}
100 +
101 +.delete-icon {
102 + font-size: 16rpx;
103 + color: white;
104 +}
105 +
106 +.form-item {
107 + display: flex;
108 + justify-content: space-between;
109 + align-items: center;
110 + padding: 32rpx 0;
111 + border-bottom: 1rpx solid #f3f4f6;
112 +}
113 +
114 +.form-item:last-child {
115 + border-bottom: none;
116 +}
117 +
118 +.form-item-left {
119 + display: flex;
120 + align-items: center;
121 +}
122 +
123 +.form-icon {
124 + margin-right: 16rpx;
125 + color: #9ca3af;
126 +}
127 +
128 +.form-label {
129 + font-size: 28rpx;
130 + color: #374151;
131 +}
132 +
133 +.form-item-right {
134 + display: flex;
135 + align-items: center;
136 +}
137 +
138 +.form-value {
139 + font-size: 28rpx;
140 + color: #9ca3af;
141 + margin-right: 16rpx;
142 +}
143 +
144 +.arrow-icon {
145 + color: #9ca3af;
146 +}
147 +
148 +.form-item-content {
149 + display: flex;
150 + justify-content: space-between;
151 + align-items: center;
152 + width: 100%;
153 + padding: 24rpx 0;
154 +}
155 +
156 +.unit {
157 + font-size: 28rpx;
158 + color: #9ca3af;
159 + margin-left: 16rpx;
160 +}
161 +
162 +.price-symbol {
163 + font-size: 32rpx;
164 + color: #f97316;
165 + font-weight: 600;
166 + margin-right: 8rpx;
167 +}
168 +
169 +.price-input {
170 + font-size: 32rpx;
171 + color: #f97316;
172 + font-weight: 600;
173 + text-align: right;
174 + border: none;
175 + outline: none;
176 + background: transparent;
177 + width: 160rpx;
178 +}
179 +
180 +.market-price-symbol {
181 + font-size: 28rpx;
182 + color: #9ca3af;
183 + margin-right: 8rpx;
184 +}
185 +
186 +.market-price-input {
187 + font-size: 28rpx;
188 + color: #9ca3af;
189 + text-align: right;
190 + border: none;
191 + outline: none;
192 + background: transparent;
193 + width: 160rpx;
194 +}
195 +
196 +.bottom-actions {
197 + position: fixed;
198 + bottom: 0;
199 + left: 0;
200 + right: 0;
201 + background-color: #ffffff;
202 + padding: 24rpx 32rpx;
203 + border-top: 1rpx solid #f3f4f6;
204 + z-index: 100;
205 +}
206 +
207 +// NutUI组件样式覆盖
208 +:deep(.nut-form-item) {
209 + padding: 0;
210 + margin-bottom: 0;
211 + border-bottom: 1rpx solid #f3f4f6;
212 +}
213 +
214 +// :deep(.nut-form-item:last-child) {
215 +// border-bottom: none;
216 +// }
217 +
218 +:deep(.nut-form-item__body) {
219 + padding: 32rpx 0;
220 +}
221 +
222 +:deep(.nut-form-item__label) {
223 + font-size: 28rpx;
224 + color: #374151;
225 + margin-right: 32rpx;
226 +}
227 +
228 +:deep(.nut-input) {
229 + text-align: right;
230 +}
231 +
232 +:deep(.nut-input__input) {
233 + font-size: 28rpx;
234 + color: #374151;
235 + text-align: right;
236 +}
237 +
238 +:deep(.nut-textarea) {
239 + border: 1rpx solid #e5e7eb;
240 + border-radius: 16rpx;
241 + padding: 24rpx;
242 +}
243 +
244 +:deep(.nut-textarea__textarea) {
245 + font-size: 28rpx;
246 + color: #374151;
247 + line-height: 1.5;
248 +}
249 +
250 +:deep(.nut-uploader) {
251 + margin-bottom: 0;
252 +}
253 +
254 +:deep(.nut-uploader__preview) {
255 + margin-bottom: 0;
256 +}
257 +
258 +:deep(.nut-uploader__preview-img) {
259 + width: 160rpx;
260 + height: 160rpx;
261 + border-radius: 16rpx;
262 + object-fit: cover;
263 +}
264 +
265 +:deep(.nut-uploader__upload) {
266 + width: 160rpx;
267 + height: 160rpx;
268 +}
269 +
270 +:deep(.nut-uploader__input) {
271 + width: 100%;
272 + height: 100%;
273 +}
274 +
275 +:deep(.nut-uploader__preview-delete) {
276 + position: absolute;
277 + top: 8rpx;
278 + right: 8rpx;
279 + width: 32rpx;
280 + height: 32rpx;
281 + background-color: rgba(0, 0, 0, 0.6);
282 + border-radius: 50%;
283 + display: flex;
284 + align-items: center;
285 + justify-content: center;
286 + color: #ffffff;
287 + font-size: 20rpx;
288 +}
289 +
290 +:deep(.nut-picker__toolbar) {
291 + padding: 24rpx 32rpx;
292 +}
293 +
294 +:deep(.nut-picker__cancel) {
295 + color: #9ca3af;
296 +}
297 +
298 +:deep(.nut-picker__confirm) {
299 + color: #f97316;
300 +}
301 +
302 +:deep(.nut-picker__title) {
303 + font-size: 32rpx;
304 + font-weight: 600;
305 +}
This diff is collapsed. Click to expand it.