|
@@ -3,11 +3,11 @@ import { View, Input, Picker, Label, Button } from '@tarojs/components'
|
|
|
import { Loading } from '@components'
|
|
|
import { connect } from '@tarojs/redux'
|
|
|
import * as actions from '@actions/template'
|
|
|
-import { getWindowHeight } from '@utils/style'
|
|
|
+import * as report from '@actions/report'
|
|
|
import ImagePicker from '../../components/imagePicker'
|
|
|
import './templatedetail.scss'
|
|
|
|
|
|
-@connect(state => state.home, { ...actions, })
|
|
|
+@connect(state => state.home, { ...actions, ...report })
|
|
|
class TemplateDetail extends Component {
|
|
|
|
|
|
config = {
|
|
@@ -15,14 +15,16 @@ class TemplateDetail extends Component {
|
|
|
}
|
|
|
|
|
|
state = {
|
|
|
+ loading: true,
|
|
|
selector: [
|
|
|
{ name: "文本项", type: "text" },
|
|
|
{ name: "日期项", type: "date" },
|
|
|
{ name: "起止时间", type: "dateRange" },
|
|
|
],
|
|
|
-
|
|
|
visible: "",
|
|
|
- data: {},
|
|
|
+ data: {
|
|
|
+ tags: [],
|
|
|
+ },
|
|
|
metadata: [],
|
|
|
chapterType: [
|
|
|
{ title: "立项背景与意义", key: "BACKGROUND", keywords: ['必要性'] },
|
|
@@ -36,14 +38,19 @@ class TemplateDetail extends Component {
|
|
|
{ title: "项目风险分析和对策", key: "RISK", keywords: ['风险分析', '风险对策'] },
|
|
|
{ title: "自定义章节", key: "USER_DEFINED", keywords: [] },
|
|
|
],
|
|
|
- chapterData: [],
|
|
|
-
|
|
|
+ chapters: [],
|
|
|
+ aeList: [],
|
|
|
+ name: "",
|
|
|
+ newvb: false,
|
|
|
+ popup: false,
|
|
|
}
|
|
|
|
|
|
componentDidMount() {
|
|
|
- // this.getData()
|
|
|
+ this.getData()
|
|
|
+ this.getQuery()
|
|
|
}
|
|
|
|
|
|
+ // 详情
|
|
|
getData() {
|
|
|
this.setState({ loading: true })
|
|
|
let payload = {
|
|
@@ -52,14 +59,49 @@ class TemplateDetail extends Component {
|
|
|
this.props.reportTemplate(payload).then((data) => {
|
|
|
this.setState({
|
|
|
loading: false,
|
|
|
- data: data.data,
|
|
|
+ data: data,
|
|
|
+ metadata: data.metadata,
|
|
|
+ chapters: data.chapters,
|
|
|
+ }, () => {
|
|
|
+ !!data.companyId && this.getCompany(data.companyId)
|
|
|
})
|
|
|
}).catch(() => {
|
|
|
+ // setInterval(function () {
|
|
|
+ // Taro.navigateBack()
|
|
|
+ // }, 800)
|
|
|
this.setState({ loading: false })
|
|
|
})
|
|
|
+ }
|
|
|
|
|
|
+ // 获取企业列表
|
|
|
+ getQuery() {
|
|
|
+ let payload = {
|
|
|
+ name: "",
|
|
|
+ size: 99,
|
|
|
+ }
|
|
|
+ this.props.query(payload).then((data) => {
|
|
|
+ this.setState({
|
|
|
+ aeList: data,
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+
|
|
|
+ })
|
|
|
}
|
|
|
+ // 获取企业名
|
|
|
+ getCompany(id) {
|
|
|
+ const obj = this.state.data
|
|
|
+ let payload = {
|
|
|
+ id,
|
|
|
+ }
|
|
|
+ this.props.selcompany(payload).then((data) => {
|
|
|
+ obj.companyName = data.name
|
|
|
+ this.setState({
|
|
|
+ data: obj,
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
|
|
|
+ })
|
|
|
+ }
|
|
|
// 添加新项
|
|
|
onChange = e => {
|
|
|
this.setState({
|
|
@@ -68,16 +110,101 @@ class TemplateDetail extends Component {
|
|
|
visible: "add"
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+ // 阿拉伯数字转中文
|
|
|
+ numberToChinese(num) {
|
|
|
+ var arr1 = new Array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九');
|
|
|
+ var arr2 = new Array('', '十', '百', '千', '万', '十', '百', '千', '亿', '十', '百', '千', '万', '十', '百', '千', '亿');//可继续追加更高位转换值
|
|
|
+ if (!num || isNaN(num)) {
|
|
|
+ return "零";
|
|
|
+ }
|
|
|
+ var english = num.toString().split("");
|
|
|
+ var result = "";
|
|
|
+ for (var i = 0; i < english.length; i++) {
|
|
|
+ var des_i = english.length - 1 - i;//倒序排列设值
|
|
|
+ result = arr2[i] + result;
|
|
|
+ var arr1_index = english[des_i];
|
|
|
+ result = arr1[arr1_index] + result;
|
|
|
+ }
|
|
|
+ //将【零千、零百】换成【零】 【十零】换成【十】
|
|
|
+ result = result.replace(/零(千|百|十)/g, '零').replace(/十零/g, '十');
|
|
|
+ //合并中间多个零为一个零
|
|
|
+ result = result.replace(/零+/g, '零');
|
|
|
+ //将【零亿】换成【亿】【零万】换成【万】
|
|
|
+ result = result.replace(/零亿/g, '亿').replace(/零万/g, '万');
|
|
|
+ //将【亿万】换成【亿】
|
|
|
+ result = result.replace(/亿万/g, '亿');
|
|
|
+ //移除末尾的零
|
|
|
+ result = result.replace(/零+$/, '');
|
|
|
+ //将【零一十】换成【零十】
|
|
|
+ //result = result.replace(/零一十/g, '零十');//貌似正规读法是零一十
|
|
|
+ //将【一十】换成【十】
|
|
|
+ result = result.replace(/^一十/g, '十');
|
|
|
+ return result;
|
|
|
+ }
|
|
|
+ // 字符串拼接
|
|
|
+ getTitleWithChineseNum(index, title) {
|
|
|
+ return this.numberToChinese(index + 1) + '、' + title
|
|
|
+ }
|
|
|
+ // 章节添加
|
|
|
onChapterChange = e => {
|
|
|
- let list = this.state.chapterData
|
|
|
- list.push(this.state.chapterType[e.detail.value])
|
|
|
+ let list = this.state.chapters
|
|
|
+ let obj = this.state.chapterType[e.detail.value]
|
|
|
+ let data = {
|
|
|
+ chapterType: obj.key,
|
|
|
+ content: "",
|
|
|
+ fullTitle: this.getTitleWithChineseNum(list.length, obj.title),
|
|
|
+ keywords: obj.keywords,
|
|
|
+ title: obj.title,
|
|
|
+ }
|
|
|
+ list.push(data)
|
|
|
+ this.setState({
|
|
|
+ chapters: list
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 选中关联企业
|
|
|
+ onAeChange = e => {
|
|
|
+ const { aeList } = this.state
|
|
|
+ let obj = aeList[e.detail.value]
|
|
|
+ let list = this.state.data
|
|
|
+ list.companyName = obj.name
|
|
|
+ list.companyId = obj.id
|
|
|
+ this.setState({
|
|
|
+ data: list,
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 企业添加
|
|
|
+ onAeCancel = () => {
|
|
|
this.setState({
|
|
|
- chapterData: list
|
|
|
+ name: "",
|
|
|
+ newvb: false,
|
|
|
})
|
|
|
}
|
|
|
+ // 企业添加
|
|
|
+ onAeOk = () => {
|
|
|
+ if (!this.state.name) {
|
|
|
+ Taro.showToast({
|
|
|
+ title: "请输入新企业名称",
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const payload = {
|
|
|
+ name: this.state.name,
|
|
|
+ }
|
|
|
+ this.props.company(payload).then((data) => {
|
|
|
+ let obj = this.state.data
|
|
|
+ obj.companyName = data.name
|
|
|
+ obj.companyId = data.id
|
|
|
+ this.setState({
|
|
|
+ data: obj,
|
|
|
+ newvb: false,
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
|
|
|
+ })
|
|
|
|
|
|
+ }
|
|
|
+ // 添加新项弹窗
|
|
|
onCancel = () => {
|
|
|
this.setState({
|
|
|
inputName: undefined,
|
|
@@ -90,7 +217,7 @@ class TemplateDetail extends Component {
|
|
|
visible: "",
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+ // 添加新项弹窗
|
|
|
onOk = () => {
|
|
|
const { visible, metadata, inputName, inputText, type, indx, dateSel, dataStart, dataEnd } = this.state
|
|
|
// if (visible == "add") {
|
|
@@ -152,14 +279,81 @@ class TemplateDetail extends Component {
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
+ // 修改章节名
|
|
|
+ onChapTitle = (i, e) => {
|
|
|
+ const data = this.state.chapters
|
|
|
+ data.forEach(function (item, index) {
|
|
|
+ if (index == i) {
|
|
|
+ item.title = e.detail.value
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.setState({
|
|
|
+ chapters: data
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 修改章节关键词
|
|
|
+ onChapKeywords = (i, e) => {
|
|
|
+ const data = this.state.chapters
|
|
|
+ data.forEach(function (item, index) {
|
|
|
+ if (index == i) {
|
|
|
+ let val = e.detail.value.replace(/[\uff0c]/g, ",")
|
|
|
+ item.keywords = val.split(",")
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.setState({
|
|
|
+ chapters: data
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 二级确认
|
|
|
+ toggleVisible = () => {
|
|
|
+ this.setState({
|
|
|
+ popup: !this.state.popup,
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 删除章节
|
|
|
+ delChap = () => {
|
|
|
+ const list = this.state.chapters
|
|
|
+ list.splice(this.state.delIndex, 1)
|
|
|
+ for (var i = 0; i < list.length; i++) {
|
|
|
+ list[i].fullTitle = this.getTitleWithChineseNum(i, list[i].title)
|
|
|
+ }
|
|
|
+ this.setState({
|
|
|
+ chapters: list
|
|
|
+ })
|
|
|
+ this.toggleVisible()
|
|
|
+ }
|
|
|
+ // 保存
|
|
|
+ onSubsmit = () => {
|
|
|
+ const { data, metadata, chapters } = this.state
|
|
|
+ if (!data.name) {
|
|
|
+ Taro.showToast({
|
|
|
+ title: "请填写报告模板名称!",
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ data.metadata = metadata
|
|
|
+ data.chapters = chapters
|
|
|
+ let payload = data
|
|
|
+ this.props.updateTemplate(payload).then((data) => {
|
|
|
+ Taro.showToast({
|
|
|
+ title: "保存成功",
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ setTimeout(function () {
|
|
|
+ Taro.navigateBack()
|
|
|
+ }, 400)
|
|
|
+ }).catch(() => {
|
|
|
+
|
|
|
+ })
|
|
|
+ }
|
|
|
|
|
|
|
|
|
render() {
|
|
|
- // if (!this.state.loaded) {
|
|
|
+ // if (this.state.loading) {
|
|
|
// return <Loading />
|
|
|
// }
|
|
|
-
|
|
|
- const { data, visible, metadata, type, chapterType, chapterData } = this.state
|
|
|
+ const { data, visible, metadata, type, chapterType, chapters, aeList } = this.state
|
|
|
return (
|
|
|
<View className='home'>
|
|
|
<View className='home-item'>
|
|
@@ -167,23 +361,74 @@ class TemplateDetail extends Component {
|
|
|
<Input
|
|
|
value={data.name}
|
|
|
className='home-item-val'
|
|
|
+ placeholder='请输入项目名称'
|
|
|
+ onChange={e => {
|
|
|
+ let obj = data
|
|
|
+ obj.name = e.detail.value
|
|
|
+ this.setState({
|
|
|
+ data: obj,
|
|
|
+ })
|
|
|
+ }}
|
|
|
/>
|
|
|
</View>
|
|
|
<View className='home-item'>
|
|
|
<View className='home-item-tit'>报告模板标签</View>
|
|
|
+ <Input
|
|
|
+ value={data.tags.toString().replace(/,/g, ",")}
|
|
|
+ className='home-item-val'
|
|
|
+ placeholder='模板标签,输入逗号分割'
|
|
|
+ onChange={e => {
|
|
|
+ let obj = data
|
|
|
+ let val = e.detail.value.replace(/[\uff0c]/g, ",")
|
|
|
+ obj.tags = val.split(",")
|
|
|
+ this.setState({
|
|
|
+ data: obj,
|
|
|
+ })
|
|
|
+ }}
|
|
|
+ />
|
|
|
</View>
|
|
|
<View className='home-item'>
|
|
|
<View className='home-item-tit'>关联企业</View>
|
|
|
+ <View className='home-item-vals'>
|
|
|
+ <Picker mode='selector' range={aeList} rangeKey="name"
|
|
|
+ onChange={this.onAeChange}
|
|
|
+ >
|
|
|
+ <View className='home-item-vals-txt'>{data.companyName || "请选择关联企业"}</View>
|
|
|
+ </Picker>
|
|
|
+ <View className='home-item-vals-bt'>
|
|
|
+ <Button size='mini' type='primary' onClick={() => { this.setState({ newvb: true }) }}>+新增企业</Button>
|
|
|
+ </View>
|
|
|
+ </View>
|
|
|
</View>
|
|
|
<View className='home-item'>
|
|
|
<View className='home-item-tit'>企业LOGO</View>
|
|
|
- <ImagePicker id={397} />
|
|
|
+ <ImagePicker
|
|
|
+ id={data.id}
|
|
|
+ keyId="templateId"
|
|
|
+ api='/gw/user/reportTemplate/logo'
|
|
|
+ urls={data.logoPath}
|
|
|
+ onChange={(path) => {
|
|
|
+ let obj = data
|
|
|
+ obj.logoPath = path
|
|
|
+ this.setState({
|
|
|
+ data: obj,
|
|
|
+ })
|
|
|
+ }}
|
|
|
+ />
|
|
|
</View>
|
|
|
<View className='home-item'>
|
|
|
<View className='home-item-tit'>项目名称</View>
|
|
|
<Input
|
|
|
value={data.reportName}
|
|
|
className='home-item-val'
|
|
|
+ placeholder='请输入项目名称'
|
|
|
+ onChange={e => {
|
|
|
+ let obj = data
|
|
|
+ obj.reportName = e.detail.value
|
|
|
+ this.setState({
|
|
|
+ data: obj,
|
|
|
+ })
|
|
|
+ }}
|
|
|
/>
|
|
|
</View>
|
|
|
{
|
|
@@ -202,7 +447,21 @@ class TemplateDetail extends Component {
|
|
|
})
|
|
|
}}
|
|
|
>
|
|
|
- <View className='home-item-tit'>{item.name}</View>
|
|
|
+ <View className='home-item-tits'>
|
|
|
+ <View className='home-item-tits-txt'>{item.name}</View>
|
|
|
+ <View className='home-item-tits-bt'>
|
|
|
+ <Button size='mini' type='warn'
|
|
|
+ onClick={e => {
|
|
|
+ e.stopPropagation()
|
|
|
+ let list = this.state.metadata
|
|
|
+ list.splice(index, 1)
|
|
|
+ this.setState({
|
|
|
+ metadata: list
|
|
|
+ })
|
|
|
+ }}
|
|
|
+ >删除</Button>
|
|
|
+ </View>
|
|
|
+ </View>
|
|
|
{item.type == "text" && <View className='home-item-val'>{item.value}</View>}
|
|
|
{item.type == "date" && <View className='home-item-val'>{item.value}</View>}
|
|
|
{item.type == "dateRange" && <View className='home-item-val'>{item.value.replace(" ", " → ")}</View>}
|
|
@@ -216,20 +475,40 @@ class TemplateDetail extends Component {
|
|
|
<Button>+添加新项</Button>
|
|
|
</Picker>
|
|
|
</View>
|
|
|
-
|
|
|
+ <View className='home-line' />
|
|
|
{
|
|
|
- chapterData.map((item, index) =>
|
|
|
- <View className='home-item' key={index}>
|
|
|
- <Input
|
|
|
- value={item.title}
|
|
|
- className='home-item-tit'
|
|
|
- />
|
|
|
+ chapters.map((item, index) =>
|
|
|
+ <View className='home-item' key={index} style={{ marginBottom: 10, }}>
|
|
|
+ <View className='home-item-tits'>
|
|
|
+ <Input
|
|
|
+ value={item.title}
|
|
|
+ className='home-item-tits-txt'
|
|
|
+ style={{ borderBottom: "1px solid #d9d9d9" }}
|
|
|
+ onChange={(e) => {
|
|
|
+ this.onChapTitle(index, e)
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ <View className='home-item-tits-bt'>
|
|
|
+ <Button size='mini' type='warn'
|
|
|
+ onClick={e => {
|
|
|
+ e.stopPropagation()
|
|
|
+ this.setState({
|
|
|
+ delIndex: index
|
|
|
+ })
|
|
|
+ this.toggleVisible()
|
|
|
+ }}
|
|
|
+ >删除</Button>
|
|
|
+ </View>
|
|
|
+ </View>
|
|
|
<View className='home-item-text'>
|
|
|
<View>章节关键词:</View>
|
|
|
<Input
|
|
|
- value={item.keywords.toString()}
|
|
|
+ value={item.keywords.toString().replace(/,/g, ",")}
|
|
|
className='home-item-text-val'
|
|
|
placeholder='输入逗号分割'
|
|
|
+ onChange={(e) => {
|
|
|
+ this.onChapKeywords(index, e)
|
|
|
+ }}
|
|
|
/>
|
|
|
</View>
|
|
|
</View>
|
|
@@ -237,23 +516,16 @@ class TemplateDetail extends Component {
|
|
|
}
|
|
|
|
|
|
<View className='home-item'>
|
|
|
- <Picker mode='chapterType' range={chapterType} rangeKey="title"
|
|
|
+ <Picker mode='selector' range={chapterType} rangeKey="title"
|
|
|
onChange={this.onChapterChange}
|
|
|
>
|
|
|
<Button>+添加章节</Button>
|
|
|
</Picker>
|
|
|
</View>
|
|
|
-
|
|
|
-
|
|
|
- <View className='home-item'>
|
|
|
- <View className='home-item-editor' contenteditable="true">请填写内容...</View>
|
|
|
+ <View className='home-item' style={{ marginTop: 60, paddingBottom: 30 }}>
|
|
|
+ <Button type='primary' onClick={this.onSubsmit}>保存</Button>
|
|
|
</View>
|
|
|
-
|
|
|
-
|
|
|
- <View className='home-item'>
|
|
|
- <Button type='primary'>保存</Button>
|
|
|
- </View>
|
|
|
-
|
|
|
+ {/* 新增项 */}
|
|
|
{visible != "" &&
|
|
|
<View className='mask'>
|
|
|
<View className='count'>
|
|
@@ -317,6 +589,40 @@ class TemplateDetail extends Component {
|
|
|
</View>
|
|
|
</View>
|
|
|
</View>}
|
|
|
+ {/* 新增企业 */}
|
|
|
+ {this.state.newvb &&
|
|
|
+ <View className='mask'>
|
|
|
+ <View className='count'>
|
|
|
+ <View className='title'>新增企业名称</View>
|
|
|
+ <View className='count_top'>
|
|
|
+ <Input
|
|
|
+ value={this.state.name}
|
|
|
+ className='count_top_input'
|
|
|
+ placeholder='请输入新企业名称'
|
|
|
+ onChange={e => { this.setState({ name: e.detail.value }) }}
|
|
|
+ />
|
|
|
+ </View>
|
|
|
+ <View className='count_foot'>
|
|
|
+ <Button onClick={this.onAeCancel}>取消</Button>
|
|
|
+ <Button style={{ marginTop: 0 }}
|
|
|
+ onClick={this.onAeOk}
|
|
|
+ >确认</Button>
|
|
|
+ </View>
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 二级确认 */}
|
|
|
+ {this.state.popup &&
|
|
|
+ <View className='mask'>
|
|
|
+ <View className='count'>
|
|
|
+ <View className='title' style={{ margin: "60px 0" }}>确认删除吗?</View>
|
|
|
+ <View className='count_foot'>
|
|
|
+ <Button onClick={this.toggleVisible}>取消</Button>
|
|
|
+ <Button style={{ marginTop: 0 }}
|
|
|
+ onClick={this.delChap}
|
|
|
+ >确认</Button>
|
|
|
+ </View>
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
</View>
|
|
|
)
|
|
|
}
|