Skip to content

zhangzhonghua / BoneHouse_Business_APP

Go to a project
Commit f41be800 by Denglingling
Options

新增【消耗确认】、【转单申请】实现图片放大功能；

parent b675cde1
Inline Side-by-side
Showing with 97 additions and 54 deletions
app/containers/equipConsu/EquipConsuPage.js
......@@ -38,6 +38,7 @@ import { connect } from 'react-redux';
import { dedupQuoteArray, show, formatStrForDate, cloneObject } from '../../utils/Utils';
import DateModel from '../common/DateModel';
import DialogModel from '../common/DialogModel';
import ZoomPictureModel from '../common/ZoomPictureModel';
import {
requestEquipOrganizations,
requestEquipSurgeryHospital,
......@@ -210,6 +211,8 @@ class EquipConsuPage extends Component {
localPhoOption: [ // 添加的图片
// 'file:///storage/emulated/0/Pictures/images/image-ea1a24b8-2d12-468f-ac23-e9aed20c6d31.jpg'
],
isShowImage: false,
currShowImgIndex: 0
}
}
......@@ -1027,6 +1030,14 @@ class EquipConsuPage extends Component {
})
}
// 展示/隐藏 放大图片
handleZoomPicture(flag, index) {
this.setState({
isShowImage: flag,
currShowImgIndex: index || 0
})
}
// 返回备注以上的元素
renderListItem() {
let { listOptionData, dateModelPop } = this.state
......@@ -1417,9 +1428,9 @@ class EquipConsuPage extends Component {
<TouchableOpacity
activeOpacity={.8}
style={list_common_item.show_pic_btn}
onPress={()=>console.log('放大图片')}
onPress={()=>this.handleZoomPicture(true, index)}
>
<Image style={icon_style} source={{uri: item}} />
<Image style={icon_style} source={{uri: item}} />
</TouchableOpacity>
<TouchableOpacity
activeOpacity={.8}
......@@ -1432,6 +1443,39 @@ class EquipConsuPage extends Component {
)
}
// 加载放大图片弹窗
renderZoomPicture() {
let { isShowImage, currShowImgIndex, listOptionData } = this.state
let { global_domain_config } = this.props
// // 测试
// let zoomImages = [{
// url: 'https://obs.uat.sfrx.guke.tech/upload/dingding/image/QDw05sTo.jpg',
// props: {
// // headers: ...
// }
// },{
// url: 'https://obs.uat.sfrx.guke.tech/upload/dingding/image/QDw05sTo.jpg',
// },{
// url: 'https://obs.uat.sfrx.guke.tech/jeecg-boot/sys/common/view/upload/dingding/image/8V4599aH.jpg'
// }]
// 正式
let zoomImages = []
listOptionData[13].uploadImgArr.forEach(item => {
zoomImages.push({
url: `${global_domain_config}/${item}`
})
})
return (
<ZoomPictureModel
isShowImage={isShowImage}
currShowImgIndex={currShowImgIndex}
zoomImages={zoomImages}
callBack={(flag) => this.handleZoomPicture(flag)}
></ZoomPictureModel>
)
}
// 返回正在加载中
renderLodingItem() {
let { lodingTitle, isSubLoding } = this.state
......@@ -1451,19 +1495,17 @@ class EquipConsuPage extends Component {
backgroundColor={promary_color}
barStyle = 'light-content'
/>
<SafeAreaView style={safe_view}>
<HeadBackItem title={title} navigation={navigation} />
<ScrollView
style={styles.equip_main}
showsVerticalScrollIndicator={false}
>
{this.renderListItem()}
{this.renderRemarksItem()}
{this.renderConsumablesDetailsItem()}
{this.renderAddPicturesItem()}
{this.renderZoomPicture()}
<FooterBtnStyle
style={canSubFlag ? styles.sub_btn_pro : ''}
activeOpacity={canSubFlag ? .8 : 1}
......@@ -1471,11 +1513,8 @@ class EquipConsuPage extends Component {
textStyle= {styles.sub_btn}
onPress={() => this.handleSubmit()}
/>
</ScrollView>
{ this.renderLodingItem() }
</SafeAreaView>
</View>
);
......
app/containers/transOrder/TransOrderPage.js
......@@ -11,8 +11,7 @@ import {
Alert,
Linking,
NativeModules,
Platform,
Modal
Platform
} from 'react-native';
import {
home_background_color,
......@@ -38,6 +37,7 @@ import { AudioRecorder, AudioUtils } from 'react-native-audio';
import Sound from 'react-native-sound';
import DialogModel from '../common/DialogModel';
import LodingModel from '../common/LodingModel';
import ZoomPictureModel from '../common/ZoomPictureModel';
import {
requestTransOrganizations,
requestTransSurgeryHospital,
......@@ -51,7 +51,7 @@ import {
reqTransTargetOrderInfo,
requestListDataSuccess
} from '../../action/TransAction';
import { show, isEmpty, dedupQuoteArray, formatStrForDate, cloneObject } from '../../utils/Utils';
import { show, dedupQuoteArray, cloneObject } from '../../utils/Utils';
import {
TRANS_ORDER_LIST_DOING,
TRANS_ORDER_LIST_SUCCESS,
......@@ -64,7 +64,6 @@ import {
import ImagePicker from 'react-native-image-picker';
import { exitLoginStatus } from '../../action/LoginAction';
import moment from 'moment';
// import ImageViewer from 'react-native-image-zoom-viewer';
class TransOrderPage extends Component {
constructor(props) {
......@@ -170,6 +169,8 @@ class TransOrderPage extends Component {
localPhoOption: [ // 添加的图片
// 'file:///storage/emulated/0/Pictures/images/image-ea1a24b8-2d12-468f-ac23-e9aed20c6d31.jpg'
],
isShowImage: false,
currShowImgIndex: 0
}
}
......@@ -1067,6 +1068,14 @@ class TransOrderPage extends Component {
})
}
// 展示/隐藏 放大图片
handleZoomPicture(flag, index) {
this.setState({
isShowImage: flag,
currShowImgIndex: index || 0
})
}
// 返回备注以上的元素
renderListItem() {
let { listOptionData } = this.state
......@@ -1188,7 +1197,6 @@ class TransOrderPage extends Component {
)
}
// 返回录音元素
renderRecordingItem() {
let { stop, currentTime } = this.state
......@@ -1354,9 +1362,9 @@ class TransOrderPage extends Component {
<TouchableOpacity
activeOpacity={.8}
style={list_common_item.show_pic_btn}
onPress={()=>console.log('放大图片')}
onPress={()=>this.handleZoomPicture(true, index)}
>
<Image style={icon_style} source={{uri: item}} />
<Image style={icon_style} source={{uri: item}} />
</TouchableOpacity>
<TouchableOpacity
activeOpacity={.8}
......@@ -1369,30 +1377,38 @@ class TransOrderPage extends Component {
)
}
// 放大图片
// renderBigImage() {
// let images = [{
// url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',
// props: {
// // headers: ...
// }
// },{
// url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',
// props: {
// // headers: ...
// }
// },{
// url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',
// props: {
// // headers: ...
// }
// }]
// return (
// <Modal visible={true} transparent={true}>
// <ImageViewer imageUrls={images}/>
// </Modal>
// )
// }
// 加载放大图片弹窗
renderZoomPicture() {
let { isShowImage, currShowImgIndex, listOptionData } = this.state
let { global_domain_config } = this.props
// // 测试
// let zoomImages = [{
// url: 'https://obs.uat.sfrx.guke.tech/upload/dingding/image/QDw05sTo.jpg',
// props: {
// // headers: ...
// }
// },{
// url: 'https://obs.uat.sfrx.guke.tech/upload/dingding/image/QDw05sTo.jpg',
// },{
// url: 'https://obs.uat.sfrx.guke.tech/jeecg-boot/sys/common/view/upload/dingding/image/8V4599aH.jpg'
// }]
// 正式
let zoomImages = []
listOptionData[7].uploadImgArr.forEach(item => {
zoomImages.push({
url: `${global_domain_config}/${item}`
})
})
return (
<ZoomPictureModel
isShowImage={isShowImage}
currShowImgIndex={currShowImgIndex}
zoomImages={zoomImages}
callBack={(flag) => this.handleZoomPicture(flag)}
></ZoomPictureModel>
)
}
// 返回正在加载中
renderLodingItem() {
......@@ -1413,27 +1429,18 @@ class TransOrderPage extends Component {
backgroundColor={promary_color}
barStyle = 'light-content'
/>
<SafeAreaView style={safe_view}>
<HeadBackItem title={title} navigation={navigation} />
<ScrollView
style={styles.trans_main}
showsVerticalScrollIndicator={false}
>
>
{this.renderListItem()}
{this.renderRemarksItem()}
{this.renderRecordingItem()}
{this.renderConsumablesDetailsItem()}
{this.renderAddPicturesItem()}
{/* 测试 */}
{/* {this.renderBigImage()} */}
{this.renderZoomPicture()}
<FooterBtnStyle
style={canSubFlag ? styles.sub_btn_pro : ''}
activeOpacity={canSubFlag ? .8 : 1}
......@@ -1441,11 +1448,8 @@ class TransOrderPage extends Component {
textStyle= {styles.sub_btn}
onPress={() => this.handleSubmit()}
/>
</ScrollView>
{ this.renderLodingItem() }
{this.renderLodingItem()}
</SafeAreaView>
</View>
);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment