208 lines
7.9 KiB
TypeScript
208 lines
7.9 KiB
TypeScript
|
|
import { alert, goLink, isEmptyObject, retrieval } from "@/common/common";
|
|
import Popup from "@/components/popup";
|
|
import { Button, Image, Picker, Text, Textarea, View } from "@tarojs/components"
|
|
import Taro, { chooseMedia } from "@tarojs/taro";
|
|
import { realNameUpdateApi, companyTypeApi, portraitUpdateApi } from "@/api/user";
|
|
import { companyDetailApi, companyUpdateApi } from "@/api/company"
|
|
import { memo, useCallback, useEffect, useRef, useState } from "react"
|
|
import "./index.scss"
|
|
import ModifyModal from "./components/ModifyModal";
|
|
import useLogin from "@/use/useLogin";
|
|
import { useSelector } from "@/reducers/hooks";
|
|
import useUploadCDNImg from "@/use/useUploadImage";
|
|
import { IMG_CND_Prefix } from "@/common/constant";
|
|
|
|
export default () => {
|
|
const { getPhoneNumber, getAdminUserInfo } = useLogin();
|
|
const { adminUserInfo } = useSelector(state => state.userInfo);
|
|
// 用户信息
|
|
useEffect(() => {
|
|
setFormData({
|
|
...formData,
|
|
...adminUserInfo as any,
|
|
});
|
|
}, [adminUserInfo]);
|
|
useEffect(() => {
|
|
setFormData({
|
|
...adminUserInfo as any,
|
|
company_type_index: 0
|
|
});
|
|
getCompanyTypeData();
|
|
}, [])
|
|
// 表单数据
|
|
const [formData, setFormData] = useState({
|
|
user_name: "麦兜"
|
|
});
|
|
// 昵称修改保存
|
|
const { fetchData: realNameUpdateFetch } = realNameUpdateApi();
|
|
const rules = {
|
|
text: [{
|
|
message: "请输入"
|
|
}]
|
|
}
|
|
const { fetchData: saveFetch } = companyUpdateApi();
|
|
const { fetchData: getCompanyFetch } = companyDetailApi();
|
|
const handleTextareaSave = async (text, type) => {
|
|
retrieval({ text }, rules).then(async () => {
|
|
let result;
|
|
if (type == "Ickname") {
|
|
result = await realNameUpdateFetch({ real_name: text });
|
|
} else {
|
|
const params = await getCompanyFetch();
|
|
result = await saveFetch({
|
|
...params.data,
|
|
company_name: text
|
|
});
|
|
}
|
|
if (result.success) {
|
|
getAdminUserInfo();
|
|
(ModifyIcknameEl.current as any).setModalShow(false);
|
|
(ModifyCompanyNameEl.current as any).setModalShow(false)
|
|
alert.success("保存成功");
|
|
} else {
|
|
alert.none(result.msg);
|
|
}
|
|
}).catch(message => {
|
|
alert.none(message);
|
|
})
|
|
}
|
|
// Taro.eventCenter.on('message:detail', (message) => console.log(message))
|
|
// 面面跳转
|
|
const onNavigate = (url: string) => {
|
|
goLink(url);
|
|
}
|
|
// 肖像编辑
|
|
const { fetchData: portraitUpdateFetch } = portraitUpdateApi();
|
|
const { getWxPhoto } = useUploadCDNImg();
|
|
const handleSelectRortrait = () => {
|
|
Taro.showModal({
|
|
title: "提示",
|
|
content: "是否确定更改头像？",
|
|
showCancel: true,
|
|
async success(ev) {
|
|
if (ev.confirm) {
|
|
let result = await getWxPhoto('mall');
|
|
const portraitUpdateResult = await portraitUpdateFetch({
|
|
avatar_url: IMG_CND_Prefix + (result as any).url
|
|
});
|
|
if (portraitUpdateResult.success) {
|
|
getAdminUserInfo();
|
|
alert.success("保存成功");
|
|
} else {
|
|
alert.none(portraitUpdateResult.msg);
|
|
}
|
|
}
|
|
}
|
|
})
|
|
}
|
|
const mGetPhoneNumber = (ev) => {
|
|
if (ev.detail?.code) {
|
|
getPhoneNumber(ev.detail.code);
|
|
} else {
|
|
alert.none("绑定失败!");
|
|
}
|
|
}
|
|
const ModifyIcknameEl = useRef(null);
|
|
const ModifyCompanyNameEl = useRef(null);
|
|
// 获取企业类型
|
|
const { fetchData: companyTypeFetch, state: companyTypeData } = companyTypeApi();
|
|
const getCompanyTypeData = async () => {
|
|
const reuslt = await companyTypeFetch();
|
|
if (reuslt.success) {
|
|
reuslt.data?.list?.every((item, index) => {
|
|
if (item.id == (adminUserInfo as any).purchaser_type) {
|
|
setFormData({
|
|
...adminUserInfo as any,
|
|
company_type_index: index
|
|
});
|
|
return false;
|
|
}
|
|
return true;
|
|
})
|
|
}
|
|
}
|
|
// 修改企业类型
|
|
const handleCompanyType = async (ev) => {
|
|
const { value } = ev.detail;
|
|
const item = companyTypeData.data.list && companyTypeData.data.list[value];
|
|
if (item) {
|
|
const params = await getCompanyFetch();
|
|
const result = await saveFetch({
|
|
...params.data,
|
|
purchaser_type: item.id
|
|
});
|
|
if (result.success) {
|
|
getAdminUserInfo();
|
|
alert.success("保存成功")
|
|
} else {
|
|
alert.none(result.msg);
|
|
}
|
|
}
|
|
}
|
|
|
|
return (
|
|
<View className="user-edit">
|
|
<View onClick={handleSelectRortrait} className="user-edit-portrait">
|
|
<Image src={(formData as any)?.avatar_url} />
|
|
<View>点击编辑头像</View>
|
|
</View>
|
|
<View className="user-edit-content">
|
|
<View className="user-edit-content-title"><Text /> 个人资料</View>
|
|
<UserEditList onClick={() => (ModifyIcknameEl.current as any).setModalShow(true)} data={(formData as any)?.user_name} label="昵称" placeholder="请输入" icon="" />
|
|
<UserEditList label="手机号" placeholder="去绑定" icon="">
|
|
{((formData as any)?.phone) ? <View className="user-edit-content-phone">
|
|
<View>{(formData as any)?.phone}</View>
|
|
<Text>已绑定</Text>
|
|
</View> :
|
|
<Button className="user-edit-content-bindphone" openType="getPhoneNumber" onGetPhoneNumber={mGetPhoneNumber}>去绑定</Button>
|
|
}
|
|
</UserEditList>
|
|
</View>
|
|
<View className="user-edit-content">
|
|
<View className="user-edit-content-title"><Text /> 组织资料</View>
|
|
<UserEditList onClick={() => (ModifyCompanyNameEl.current as any).setModalShow(true)} data={(formData as any)?.company_name} label="名称" placeholder="待绑定" icon="" />
|
|
<UserEditList label="类型" placeholder="完善公司/组织信息" icon="">
|
|
<Picker mode="selector" range={(companyTypeData.data as any).list as any} rangeKey="name" value={(formData as any)?.company_type_index} onChange={handleCompanyType}>
|
|
{(companyTypeData.data as any).list && (companyTypeData.data as any).list[(formData as any)?.company_type_index].name}
|
|
</Picker>
|
|
</UserEditList>
|
|
<UserEditList onClick={() => onNavigate("/pages/certification/index")} label="我的认证" placeholder="待绑定" icon="">
|
|
<View className={`user-edit-content-company ${(formData as any)?.authentication_status == 4 && "user-edit-content-company-adopt"}`}>
|
|
<Text className="iconfont " /> {(formData as any)?.authentication_status == 4 ? "已认证" : "未认证"}
|
|
</View>
|
|
</UserEditList>
|
|
<UserEditList label="创建人" data={(formData as any)?.founder_user_name} placeholder="完善公司/组织信息" icon="" useIcon="true" />
|
|
</View>
|
|
{/* <Button hoverClass="none" className="user-edit-logout">退出当前账号</Button> */}
|
|
|
|
<ModifyModal title="修改昵称" ref={ModifyIcknameEl} value={(formData as any)?.user_name} save={(value) => handleTextareaSave(value, "Ickname")} />
|
|
<ModifyModal title="修改名称" ref={ModifyCompanyNameEl} value={(formData as any)?.company_name} save={(value) => handleTextareaSave(value, "companyName")} />
|
|
</View>
|
|
)
|
|
}
|
|
|
|
// 列表
|
|
const UserEditList = memo((props: any) => {
|
|
return (
|
|
<View onClick={props.onClick} className="user-edit-list">
|
|
<View className="user-edit-list-left">
|
|
{props.label}
|
|
</View>
|
|
<View className="user-edit-list-right">
|
|
<View>
|
|
{
|
|
props.children ? props.children :
|
|
props.data ? props.data :
|
|
<View className="user-edit-list-right-placeholder">{props.placeholder}</View>
|
|
}
|
|
</View>
|
|
{
|
|
!props.useIcon &&
|
|
<Text className="iconfont icon-a-moreback"></Text>
|
|
}
|
|
</View>
|
|
</View>
|
|
)
|
|
})
|