<template>
   <div>
       <CprStepCell 
           :key="proofName.labelText" 
           :cellData="proofName" 
           @onTextChange="(value)=>onDataChange(value, 'proofName')"
           :contentText="pageData.proofName"></CprStepCell>
       <CprStepCell 
           :key="proofType.labelText" 
           :cellData="proofType" 
           @onActionSelect="(value)=>onDataChange(value, 'proofType')"
           :contentText="pageData.proofType.name"></CprStepCell>
       <CprStepCell 
           :key="proofFeature.labelText" 
           :cellData="proofFeature" 
           @onActionSelect="(value)=>onDataChange(value, 'proofFeature')"
           :contentText="pageData.proofFeature.name"></CprStepCell>
       <CprStepCell 
           :key="proofDesc.labelText" 
           :cellData="proofDesc" 
           @onTextChange="(value)=>onDataChange(value, 'proofDesc')"
           :contentText="pageData.proofDesc"></CprStepCell>
       <CprStepCell 
           :key="proofCreateProgress.labelText" 
           :cellData="proofCreateProgress" 
           @onTextChange="(value)=>onDataChange(value, 'proofCreateProgress')"
           :contentText="pageData.proofCreateProgress"></CprStepCell>
       <CprStepCell 
           :key="proofFinishDate.labelText" 
           :cellData="proofFinishDate" 
           @onTimeSelect="(value)=>onDataChange(value, 'proofFinishDate')"
           :contentText="proofFinishDateText"></CprStepCell>
       <CprStepCell 
           :key="proofFinishPlace.labelText" 
           :cellData="proofFinishPlace" 
           @onPlaceSelect="(value)=>onDataChange(value, 'proofFinishPlace')"
           :contentText="proofFinishPlaceText"></CprStepCell>
       <CprStepCell 
           :key="proofPublishStatus.labelText" 
           :cellData="proofPublishStatus" 
           @onSingleSelectChange="(value)=>onDataChange(value, 'proofPublishStatus')"
           :contentText="pageData.proofPublishStatus"></CprStepCell>
       <CprStepCell 
           v-if="pageData.proofPublishStatus == 1" 
           :key="proofPublishDate.labelText" 
           :cellData="proofPublishDate" 
           @onTimeSelect="(value)=>onDataChange(value, 'proofPublishDate')"
           :contentText="proofPublishDateText"></CprStepCell>
       <CprStepCell 
           v-if="pageData.proofPublishStatus == 1" 
           :key="proofPublishPlace.labelText" 
           :cellData="proofPublishPlace" 
           @onPlaceSelect="(value)=>onDataChange(value, 'proofPublishPlace')"
           :contentText="proofPublishPlaceText"></CprStepCell>
   </div>
</template>

<script lang='ts'>
/**框架*/
import Vue from 'vue'
/**工具库*/
import moment from 'moment'
/**类型*/
/**组件*/
/**自定义方法*/

export default Vue.extend({
   name:'',
   data(){
       return {
           proofName: {
                labelText: '作品名称',
                nessesary: true,
                tipText: '',
                placeHolder: '请输入作品名称',
                inputType: 'text',
           },
           proofType: {
                labelText: '作品类型',
                nessesary: true,
                tipText: 
`
文字作品（小说、论文、剧本、商业计划书、歌词等）
口述作品（即兴的演说、授课、法庭辩论等）
音乐作品（词曲、器乐等）
戏剧作品（话剧、歌剧、地方戏剧、广播剧等）
曲艺作品（相声、大鼓、快书、评书等）
舞蹈作品（现代舞、民族舞、中国古典舞、爵士舞、肚皮舞、钢管舞等）
杂技艺术（柔术、顶碗、走钢丝、变戏法、舞狮子、车技等）
美术作品（包装图、效果图、玩具、商标标识、漫画、雕塑等）
建筑作品（民用建筑、工业建筑、农业建筑、公共建筑等）
摄影作品（人像摄影、记录摄影、艺术摄影、全息摄影、全景摄影、商业摄影等）
电影作品（纪录片、动画电影、动作电影、科幻电影、悬疑电影等）
以类似摄制电影的方法创作的作品（短片、录像、短视频、电视剧、动画片等）
工程设计图、产品设计图（平面设计图、立面图、剖面图、施工图、工业设计图纸、服装设计图纸等）
地图、示意图（地图、桌面图、立体图）
模型作品（立体模型）
录音制品（任何对表演的声音和其他声音的录制品）
录像制品（电影作品和以类似摄制电影的方法创作的作品以外的任何有伴音或无伴音的连续相关形象、图像的制品）
其他作品（法律、行政法律规定的其他作品等）
`,
                placeHolder: '请选择作品类型',
                inputType: 'choose',
                actions: [
                    {name:'文字作品', value: 1},
                    {name:'口述作品', value: 2},
                    {name:'音乐作品', value: 3},
                    {name:'戏剧作品', value: 4},
                    {name:'曲艺作品', value: 5},
                    {name:'舞蹈作品', value: 6},
                    {name:'杂技艺术', value: 7},
                    {name:'美术作品', value: 8},
                    {name:'建筑作品', value: 9},
                    {name:'摄影作品', value: 10},
                    {name:'电影作品', value: 11},
                    {name:'以类似摄制电影的方法创作的作品', value: 12},
                    {name:'工程设计图、产品设计图', value: 13},
                    {name:'地图、示意图', value: 14},
                    {name:'模型作品', value: 15},
                    {name:'录音制品', value: 16},
                    {name:'录像制品', value: 17},
                    {name:'其他作品', value: 18},
                ]
           },
           proofFeature: {
                labelText: '作品性质',
                nessesary: true,
                tipText: 
`原创：作者未使用其他已有作品创作的作品；
改编、翻译、汇编、注释、整理、其他：作者使用已有作品衍生创作的作品`,
                placeHolder: '请选择作品性质',
                inputType: 'choose',
                actions:[{name:'原创', value: 1},{name:'改编', value: 2},{name:'翻译', value: 3},{name:'汇编', value: 4},{name:'注释', value: 5},{name:'整理', value: 6},{name:'其他', value: 7}]
           },
           proofDesc: {
                labelText: '内容简介',
                nessesary: true,
                tipText: 
`请填写中心内容及作品特点：对作品进行简述，包括主要内容、章节编排、部分划分、与同类作品相比的独特之处等。如美术作品需对作品本身的表现形式和审美特征进行描述（颜色、形态、表情等）。（注：若提交的作品样本中含有外文请在内容简介中附中文解释。）`,
                placeHolder: 
`请填写作品的内容简介（限1000字）：
·作品简述：主要内容、章节编排、部分划分等；
·与同类作品相比的独特之处；`,
                inputType: 'textArea',
                maxCount: 1000,
           },
           proofCreateProgress: {
                labelText: '创作过程',
                nessesary: true,
                tipText: 
`（1）著作权人简介：著作权人为个人，须包含本人的工作单位相关情况，无工作单位者写明“无工作单位，现从事……”。著作权人为单位，写明单位的基本情况。 （2）创作过程：创作意图，策划和准备，创作开始时间，创作方式（手绘、使用电脑、具体的艺术手法、软件及具体操作等），经过几次修改，每次都修改了哪些内容，最终完成日期，页数，字数等。 （3）使用情况：发表情况、许可他人专有使用情况。 （注：1.摄影作品须在创作过程中写明具体拍摄设备、光圈值、快门等详细参数。2.如作品中有参考、引用他人作品的情况需说明，作品中的文字、图案与他人权利有关联的要做出说明、解释。）`,
                placeHolder: 
`请填写创作过程（限1000字）：
·著作权人简介：本人的工作情况等；
·创作过程：创作意图、策划和准备、创作开始时间、创作方式等；
·使用情况：发表情况、许可他人专有使用情况等。`,
                inputType: 'textArea',
                maxCount: 1000,
           },
           proofFinishDate: {
                labelText: '作品完成日期',
                nessesary: true,
                tipText: '',
                placeHolder: '请选择日期',
                inputType: 'timeSelect',
           },
           proofFinishPlace: {
                labelText: '作品完成地点',
                nessesary: true,
                tipText: '',
                placeHolder: '请选择省份市区',
                inputType: 'placeSelect',
           },
           proofPublishStatus: {
                labelText: '发表状态',
                nessesary: true,
                tipText: 
`作品如果已“已发表”，需要填写作品的首次发表的时间及地点。`,
                placeHolder: '',
                inputType: 'singleSelect',
                selectOption: [{value:0, text:'未发表'}, {value:1, text:'已发表'}]
           },
           proofPublishDate: {
                labelText: '首次发表日期',
                nessesary: true,
                tipText: '',
                placeHolder: '请选择日期',
                inputType: 'timeSelect',
           },
           proofPublishPlace: {
                labelText: '首次发表地点',
                nessesary: true,
                tipText: '',
                placeHolder: '请选择省份市区',
                inputType: 'placeSelect',
           }
       }
   },
   computed: {
       pageData(){
           return this.$store.state.copyright.eachPageData[1]
       },
       proofFinishDateText(){
           return this.$store.state.copyright.eachPageData[1].proofFinishDate? moment(this.$store.state.copyright.eachPageData[1].proofFinishDate).format('YYYY-MM-DD') : ''
       },
       proofFinishPlaceText(){
           return this.$store.state.copyright.eachPageData[1].proofFinishPlace.reduce((res: string, item: {code: string, name: string})=>{ return res +' '+ item.name}, '')
       },
       proofPublishDateText(){
           return this.$store.state.copyright.eachPageData[1].proofPublishDate? moment(this.$store.state.copyright.eachPageData[1].proofPublishDate).format('YYYY-MM-DD') : ''
       },
       proofPublishPlaceText(){
           return this.$store.state.copyright.eachPageData[1].proofPublishPlace.reduce((res: string, item: {code: string, name: string})=>{ return res +' '+ item.name}, '')
       },
   },
   components: {
       CprStepCell: ()=>import('@/view/NFT/Copyright/component/CprStepCell.vue'),
   },
   methods: {
       onDataChange(value: any, type: string){
           console.log(value)
           this.$store.commit('copyright/updataSecondPageData', {type, value})
       },
   },
})
</script>

<style scoped lang=''>

</style>