xt / Flutter-ReserveApp · Commits

Go to a project

Commit 7e8c6898c5cf14f3a7dd408cab884cf14042bc3b

Authored by wdn127929
1 parent 61b02798
build: skipped

分支2.1：上传经理资料和预定安排页UI调整---->上传图片组件化

Inline Side-by-side
Showing 6 changed files with 192 additions and 119 deletions
... ... @@ -16,6 +16,7 @@ import 'package:intl/date_symbol_data_local.dart';
import 'package:one_key/provider/notebook_detail_model.dart';
import 'package:one_key/provider/online_check_edit_provider.dart';
import 'package:one_key/provider/tools.dart';
import 'package:one_key/provider/upload_img_provider.dart';
import 'package:one_key/utils/navigator_util.dart';
import 'package:one_key/utils/utils.dart';
import 'package:provider/provider.dart';
... ... @@ -65,6 +66,9 @@ Future<void> main() async {
ChangeNotifierProvider<CouponProvider>(
create: (_) => CouponProvider(),
),
ChangeNotifierProvider<UploadImageProvider>(
create: (_) => UploadImageProvider(),
),
],
child: MyApp(),
));
... ...
import 'dart:convert';
import 'dart:io';
import 'dart:async';
... ... @@ -10,6 +11,7 @@ import 'package:one_key/pages/online_check/photo_view_wiget.dart';
import 'package:one_key/pages/online_check/progress.dart';
import 'package:one_key/provider/online_check_edit_provider.dart';
import 'package:one_key/provider/upload_img_provider.dart';
import 'package:one_key/res/colors.dart';
import 'package:one_key/utils/dialog_util.dart';
import 'package:one_key/utils/misc.dart';
... ... @@ -25,7 +27,6 @@ import 'package:qiniu_flutter_sdk/qiniu_flutter_sdk.dart';
import './dispose.dart';
import 'package:photo_manager/photo_manager.dart';
final int MAX_IMAGE_NUMBER = 5;
typedef void OnPickImageCallback(
double maxWidth, double maxHeight, int quality);
... ... @@ -33,11 +34,13 @@ class ImgPickerWidget extends StatefulWidget {
final ScrollController scrollController;
final Color borderColor;
final ValueChanged onChange;
final int maxImageNumber;
ImgPickerWidget(
{Key key,
this.scrollController,
this.borderColor = Colors.blue,
this.onChange})
this.onChange,
this.maxImageNumber = 5})
: super(key: key);
@override
... ... @@ -46,7 +49,8 @@ class ImgPickerWidget extends StatefulWidget {
class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
final picker = ImagePicker();
OnlineCheckEditProvider _onlineCheckEditProvider;
// OnlineCheckEditProvider _onlineCheckEditProvider;
UploadImageProvider _uploadImageProvider;
// 用户输入的文件名
String key;
... ... @@ -81,14 +85,14 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
UploadImgModel imgModel = UploadImgModel();
imgModel.file = File(pickedFile.path);
imgModel.process = 0.01;
_onlineCheckEditProvider.imageList.add(imgModel);
_uploadImageProvider.imageList.add(imgModel);
} else {
print('No image selected.');
}
});
if (pickedFile != null) {
startUpload(File(pickedFile.path),
_onlineCheckEditProvider.imageList.length - 1, true);
_uploadImageProvider.imageList.length - 1, true);
}
}
... ... @@ -112,7 +116,8 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
// the check box disable color
itemRadio: 0.88,
// the content item radio
maxSelected: MAX_IMAGE_NUMBER - _onlineCheckEditProvider.imageList.length,
maxSelected:
widget.maxImageNumber - _uploadImageProvider.imageList.length,
// max picker image count
// provider: I18nProvider.english,
provider: I18nProvider.chinese,
... ... @@ -146,10 +151,10 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
UploadImgModel imgModel = UploadImgModel();
imgModel.file = File(file.absolute.path);
imgModel.process = 0.01;
_onlineCheckEditProvider.imageList.add(imgModel);
_uploadImageProvider.imageList.add(imgModel);
});
startUpload(File(file.absolute.path),
_onlineCheckEditProvider.imageList.length - 1, false);
_uploadImageProvider.imageList.length - 1, false);
}
}
}
... ... @@ -166,8 +171,8 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
// 添加整体进度监听
putController.addProgressListener((percent) {
print('${index}任务进度变化：进度：${percent.toStringAsFixed(4)}');
_onlineCheckEditProvider.imageList[index].process = percent;
_onlineCheckEditProvider.notifyListeners();
_uploadImageProvider.imageList[index].process = percent;
_uploadImageProvider.notifyListeners();
});
// 添加实际发送进度订阅
putController.addSendProgressListener((percent) {
... ... @@ -176,9 +181,9 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
print('${index}实际发送变化：进度：${percent.toStringAsFixed(4)}');
});
if (token == null || token == '') {
await _onlineCheckEditProvider.getQiniuInfo(context, {});
await _uploadImageProvider.getQiniuInfo(context, {});
}
var usedToken = _onlineCheckEditProvider.qiniuInfoSunModel.token;
var usedToken = _uploadImageProvider.qiniuInfoSunModel.token;
if (usedToken == null || usedToken == '') {
print('token 不能为空');
return;
... ... @@ -196,15 +201,15 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
..then((PutResponse response) {
print('${index}上传已完成: 原始响应数据: ${jsonEncode(response.rawData)}');
print('------------------------');
String imgUrl = _onlineCheckEditProvider.qiniuInfoSunModel.domain +
String imgUrl = _uploadImageProvider.qiniuInfoSunModel.domain +
'/' +
response.rawData['key'];
_onlineCheckEditProvider.imageList[index].process = 1;
_onlineCheckEditProvider.imageList[index].qiniuUrl = imgUrl;
_uploadImageProvider.imageList[index].process = 1;
_uploadImageProvider.imageList[index].qiniuUrl = imgUrl;
// 取消当前任务
putController.cancel();
// _image
_onlineCheckEditProvider.notifyListeners();
_uploadImageProvider.notifyListeners();
})
..catchError((dynamic error) {
if (error is StorageError) {
... ... @@ -405,59 +410,20 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
@override
Widget build(BuildContext context) {
_onlineCheckEditProvider =
Provider.of<OnlineCheckEditProvider>(context, listen: true);
return Container(
width: double.infinity,
decoration: BoxDecoration(
color: Colors.white, borderRadius: BorderRadius.circular(10)),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
height: ScreenUtil().setWidth(53 * 2),
width: double.infinity,
decoration: BoxDecoration(
color: MyColours.color_FAFAFA,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(10),
topRight: Radius.circular(10)),
),
child: Padding(
padding: EdgeInsets.fromLTRB(
ScreenUtil().setWidth(20),
ScreenUtil().setWidth(36),
ScreenUtil().setWidth(20),
ScreenUtil().setWidth(26)),
child: Text(
'消费清单（选填）',
style: TextStyle(
fontSize: ScreenUtil().setSp(32),
color: MyColours.color_353535,
fontWeight: FontWeight.bold),
),
)),
Padding(
padding: EdgeInsets.all(ScreenUtil().setWidth(40)),
child: _getGridImg(
_onlineCheckEditProvider.imageList.length < MAX_IMAGE_NUMBER
? _onlineCheckEditProvider.imageList.length + 1
: _onlineCheckEditProvider.imageList.length,
context,
_onlineCheckEditProvider.imageList.length == MAX_IMAGE_NUMBER
? true
: false),
)
// _getGridImg(1, context)
],
),
);
_uploadImageProvider =
Provider.of<UploadImageProvider>(context, listen: true);
return _getGridImg(
_uploadImageProvider.imageList.length < widget.maxImageNumber
? _uploadImageProvider.imageList.length + 1
: _uploadImageProvider.imageList.length,
context,
_uploadImageProvider.imageList.length == widget.maxImageNumber
? true
: false);
}
/// 九宫格
Widget _getGridImg(count, context, isLinjie) {
OnlineCheckEditProvider _provider =
Provider.of<OnlineCheckEditProvider>(context, listen: false);
return GridView.builder(
controller: widget.scrollController,
// padding: EdgeInsets.only(top: ScreenUtil().getAdapterSize(10)),
... ... @@ -475,9 +441,9 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
childAspectRatio: 1.0),
itemBuilder: (BuildContext context, int index) {
//Widget Function(BuildContext context, int index)
var linjie = MAX_IMAGE_NUMBER;
var linjie = widget.maxImageNumber;
if (isLinjie) {
linjie = MAX_IMAGE_NUMBER - 1;
linjie = widget.maxImageNumber - 1;
}
if (index == count - 1 && index < linjie) {
return InkWell(
... ... @@ -513,25 +479,24 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
)),
);
}
return _provider.imageList.length < 1
return _uploadImageProvider.imageList.length < 1
? Text('')
: InkWell(
onTap: () {
if (_onlineCheckEditProvider.imageList[index].process ==
1) {
_onlineCheckEditProvider.imageQiniuUrlList = [];
if (_onlineCheckEditProvider.imageList[index].qiniuUrl !=
if (_uploadImageProvider.imageList[index].process == 1) {
_uploadImageProvider.imageQiniuUrlList = [];
if (_uploadImageProvider.imageList[index].qiniuUrl !=
null) {
for (int i = 0;
i < _onlineCheckEditProvider.imageList.length;
i < _uploadImageProvider.imageList.length;
i++) {
_onlineCheckEditProvider.imageQiniuUrlList.add(
_onlineCheckEditProvider.imageList[i].qiniuUrl);
_uploadImageProvider.imageQiniuUrlList
.add(_uploadImageProvider.imageList[i].qiniuUrl);
}
///没有上传完成的不可以点击
_showPhotoView(
context, index, _provider.imageQiniuUrlList);
_showPhotoView(context, index,
_uploadImageProvider.imageQiniuUrlList);
}
}
},
... ... @@ -541,13 +506,15 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
alignment: Alignment.topRight,
children: [
Image.file(
_provider.imageList[index].file,
_uploadImageProvider.imageList[index].file,
fit: BoxFit.cover,
width: ScreenUtil().setWidth(100 * 2),
height: ScreenUtil().setWidth(100 * 2),
),
Offstage(
offstage: _provider.imageList[index].process < 1,
offstage:
_uploadImageProvider.imageList[index].process <
1,
child: GestureDetector(
child: Image.asset(
Utils.getImgPath("delete"),
... ... @@ -557,12 +524,16 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
onTap: () {
//点击删除按钮
setState(() {
_provider.imageList.removeWhere((element) =>
element == _provider.imageList[index]);
_provider.imageQiniuUrlList.removeWhere(
_uploadImageProvider.imageList.removeWhere(
(element) =>
element ==
_provider.imageQiniuUrlList[index]);
_uploadImageProvider
.imageList[index]);
_uploadImageProvider.imageQiniuUrlList
.removeWhere((element) =>
element ==
_uploadImageProvider
.imageQiniuUrlList[index]);
});
},
),
... ... @@ -570,8 +541,10 @@ class _ImgPickerWidgetState extends DisposableState<ImgPickerWidget> {
],
),
Offstage(
offstage: _provider.imageList[index].process == 1,
child: Progress(_provider.imageList[index].process),
offstage:
_uploadImageProvider.imageList[index].process == 1,
child: Progress(
_uploadImageProvider.imageList[index].process),
)
],
));
... ...
... ... @@ -4,6 +4,7 @@ import 'package:one_key/pages/online_check/photo_view_wiget.dart';
import 'package:one_key/provider/message_dialog_model.dart';
import 'package:one_key/provider/online_check_edit_provider.dart';
import 'package:one_key/provider/order_food_provider.dart';
import 'package:one_key/provider/upload_img_provider.dart';
import 'package:one_key/provider/user_model.dart';
import 'package:one_key/res/colors.dart';
import 'package:one_key/utils/event_bus.dart';
... ... @@ -26,6 +27,7 @@ class OnlineCheckDetailPage extends StatefulWidget {
class _OnlineCheckDetailPageState extends State<OnlineCheckDetailPage> {
OnlineCheckEditProvider _onlineCheckEditProvider;
OrderFoodProvider _orderFoodProvider;
UploadImageProvider _uploadImageProvider;
bool arrowStatus = true; // true合住 false展开
@override
... ... @@ -65,7 +67,7 @@ class _OnlineCheckDetailPageState extends State<OnlineCheckDetailPage> {
///获取七牛云token
///
_getQiniuInfo() async {
await _onlineCheckEditProvider.getQiniuInfo(context, {});
await _uploadImageProvider.getQiniuInfo(context, {});
}
///接口获取桌位信息
... ... @@ -562,6 +564,8 @@ class _OnlineCheckDetailPageState extends State<OnlineCheckDetailPage> {
_onlineCheckEditProvider =
Provider.of<OnlineCheckEditProvider>(context, listen: true);
_orderFoodProvider = Provider.of<OrderFoodProvider>(context, listen: true);
_uploadImageProvider =
Provider.of<UploadImageProvider>(context, listen: true);
return Scaffold(
backgroundColor: MyColours.color_f5f5f5,
appBar: SystemAppBar(
... ...
... ... @@ -7,6 +7,7 @@ import 'package:one_key/provider/message_dialog_model.dart';
import 'package:one_key/provider/notebook_detail_model.dart';
import 'package:one_key/provider/online_check_edit_provider.dart';
import 'package:one_key/provider/order_food_provider.dart';
import 'package:one_key/provider/upload_img_provider.dart';
import 'package:one_key/provider/user_model.dart';
import 'package:one_key/res/colors.dart';
import 'package:one_key/utils/dialog_util.dart';
... ... @@ -37,6 +38,7 @@ class _OnlineCheckEditPageState extends State<OnlineCheckEditPage> {
FocusNode _focusNode = FocusNode();
OnlineCheckEditProvider _onlineCheckEditProvider;
OrderFoodProvider _orderFoodProvider;
UploadImageProvider _uploadImageProvider;
int btnState = -1;
bool arrowStatus = true; // true合住 false展开
NotebookDetailModel detailModel;
... ... @@ -65,8 +67,8 @@ class _OnlineCheckEditPageState extends State<OnlineCheckEditPage> {
@override
void dispose() {
_focusNode.unfocus();
_onlineCheckEditProvider.imageList = [];
_onlineCheckEditProvider.imageQiniuUrlList = [];
_uploadImageProvider.imageList = [];
_uploadImageProvider.imageQiniuUrlList = [];
super.dispose();
}
... ... @@ -119,15 +121,15 @@ class _OnlineCheckEditPageState extends State<OnlineCheckEditPage> {
.substring(1, _editingController.text.length)
.trim();
}
for (int i = 0; i < _onlineCheckEditProvider.imageList.length; i++) {
_onlineCheckEditProvider.imageQiniuUrlList
.add(_onlineCheckEditProvider.imageList[i].qiniuUrl);
for (int i = 0; i < _uploadImageProvider.imageList.length; i++) {
_uploadImageProvider.imageQiniuUrlList
.add(_uploadImageProvider.imageList[i].qiniuUrl);
}
UserModel userModel = Provider.of<UserModel>(context, listen: false);
Map<String, String> params = {
"price": price,
"rid": widget.rid,
'bill_list': json.encode(_onlineCheckEditProvider.imageQiniuUrlList)
'bill_list': json.encode(_uploadImageProvider.imageQiniuUrlList)
};
print(params);
//明天完成 桌位名称信息
... ... @@ -146,7 +148,7 @@ class _OnlineCheckEditPageState extends State<OnlineCheckEditPage> {
///获取七牛云token
///
_getQiniuInfo() async {
await _onlineCheckEditProvider.getQiniuInfo(context, {});
await _uploadImageProvider.getQiniuInfo(context, {});
}
///顶部logo
... ... @@ -498,6 +500,8 @@ class _OnlineCheckEditPageState extends State<OnlineCheckEditPage> {
_onlineCheckEditProvider =
Provider.of<OnlineCheckEditProvider>(context, listen: true);
_orderFoodProvider = Provider.of<OrderFoodProvider>(context, listen: true);
_uploadImageProvider =
Provider.of<UploadImageProvider>(context, listen: true);
return Scaffold(
backgroundColor: MyColours.color_f5f5f5,
appBar: SystemAppBar(
... ... @@ -560,8 +564,56 @@ class _OnlineCheckEditPageState extends State<OnlineCheckEditPage> {
),
),
VEmptyView(20),
ImgPickerWidget(
scrollController: _scrollController),
Container(
width: double.infinity,
decoration: BoxDecoration(
color: Colors.white,
borderRadius:
BorderRadius.circular(10)),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: <Widget>[
Container(
height:
ScreenUtil().setWidth(53 * 2),
width: double.infinity,
decoration: BoxDecoration(
color: MyColours.color_FAFAFA,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(10),
topRight:
Radius.circular(10)),
),
child: Padding(
padding: EdgeInsets.fromLTRB(
ScreenUtil().setWidth(20),
ScreenUtil().setWidth(36),
ScreenUtil().setWidth(20),
ScreenUtil().setWidth(26)),
child: Text(
'消费清单（选填）',
style: TextStyle(
fontSize:
ScreenUtil().setSp(32),
color:
MyColours.color_353535,
fontWeight:
FontWeight.bold),
),
)),
Padding(
padding: EdgeInsets.all(
ScreenUtil().setWidth(40)),
child: ImgPickerWidget(
scrollController:
_scrollController),
)
// _getGridImg(1, context)
],
),
),
VEmptyView(20),
_customInfoWidget()
],
... ...
... ... @@ -12,34 +12,34 @@ import 'package:one_key/net/http_url.dart';
import 'package:one_key/utils/utils.dart';
class OnlineCheckEditProvider extends ChangeNotifier {
List<UploadImgModel> imageList = []; //图片信息列表
List<String> imageQiniuUrlList = []; //七牛云地址列表
QiniuInfoSunModel qiniuInfoSunModel;
// List<UploadImgModel> imageList = []; //图片信息列表
// List<String> imageQiniuUrlList = []; //七牛云地址列表
// QiniuInfoSunModel qiniuInfoSunModel;
OrderInfoSunModel orderInfoSunModel;
List<NewReserveListSunModel> reserveList = [];
/// 获取七牛上传token信息
Future<QiniuInfoSunModel> getQiniuInfo(
BuildContext context, Map<String, String> params,
{isShowLoading = true}) async {
BaseResp<Map<String, dynamic>> baseResp = await DioUtil()
.request<Map<String, dynamic>>(
context, Method.get, HttpUrl.get_qiniu_info,
data: params, showLoading: false)
.catchError((error) {});
if (baseResp.code == Constant.status_success) {
if (baseResp.data.isEmpty) {
} else {
//解析解析
qiniuInfoSunModel = QiniuInfoModel.fromJson(baseResp.responseData).data;
return qiniuInfoSunModel;
}
} else {
if (baseResp != null) {
Utils.showToast(baseResp.msg ?? "");
}
}
}
// Future<QiniuInfoSunModel> getQiniuInfo(
// BuildContext context, Map<String, String> params,
// {isShowLoading = true}) async {
// BaseResp<Map<String, dynamic>> baseResp = await DioUtil()
// .request<Map<String, dynamic>>(
// context, Method.get, HttpUrl.get_qiniu_info,
// data: params, showLoading: false)
// .catchError((error) {});
// if (baseResp.code == Constant.status_success) {
// if (baseResp.data.isEmpty) {
// } else {
// //解析解析
// qiniuInfoSunModel = QiniuInfoModel.fromJson(baseResp.responseData).data;
// return qiniuInfoSunModel;
// }
// } else {
// if (baseResp != null) {
// Utils.showToast(baseResp.msg ?? "");
// }
// }
// }
///获取账单详情
getOrderInfo(BuildContext context, Map<String, String> params,
... ...
import 'package:flutter/material.dart';
import 'package:one_key/constant/constant.dart';
import 'package:one_key/models/qiniu_info_model.dart';
import 'package:one_key/models/upload_img_model.dart';
import 'package:one_key/net/base_resp.dart';
import 'package:one_key/net/dio_util.dart';
import 'package:one_key/net/http_url.dart';
import 'package:one_key/utils/utils.dart';
class UploadImageProvider extends ChangeNotifier {
List<UploadImgModel> imageList = []; //图片信息列表
List<String> imageQiniuUrlList = []; //七牛云地址列表
QiniuInfoSunModel qiniuInfoSunModel;
/// 获取七牛上传token信息
Future<QiniuInfoSunModel> getQiniuInfo(
BuildContext context, Map<String, String> params,
{isShowLoading = true}) async {
BaseResp<Map<String, dynamic>> baseResp = await DioUtil()
.request<Map<String, dynamic>>(
context, Method.get, HttpUrl.get_qiniu_info,
data: params, showLoading: false)
.catchError((error) {});
if (baseResp.code == Constant.status_success) {
if (baseResp.data.isEmpty) {
} else {
//解析解析
qiniuInfoSunModel = QiniuInfoModel.fromJson(baseResp.responseData).data;
return qiniuInfoSunModel;
}
} else {
if (baseResp != null) {
Utils.showToast(baseResp.msg ?? "");
}
}
}
}
... ...