You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

single.vue 7.4 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. <template>
  2.   <view class="page">
  3.     <view v-if="ready">
  4.       <l-input
  5.         @input="setValue('JournalSend.JTitle', $event)"
  6.         :value="getValue('JournalSend.JTitle')"
  7.         :disabled="!edit"
  8.         title="日志主题"
  9.       />
  10.       <l-select
  11.         @input="setValue('JournalSend.JTypeId', $event)"
  12.         :value="getValue('JournalSend.JTypeId')"
  13.         :disabled="!edit"
  14.         :range="dataSource.JournalSend.JTypeId"
  15.         title="日志类型"
  16.       />
  17.       <l-organize-picker
  18.         @input="setValue('JournalSend.JReceiveId', $event)"
  19.         :value="getValue('JournalSend.JReceiveId')"
  20.         :readonly="!edit"
  21.         type="user"
  22.         title="接收人"
  23.       />
  24.       <l-textarea
  25.         @input="setValue('JournalSend.JContent', $event)"
  26.         :value="getValue('JournalSend.JContent')"
  27.         :readonly="!edit"
  28.         title="日志内容"
  29.       />
  30.     </view>
  31.   
  32.     <view v-if="ready" class="bg-white margin-tb padding" style="padding-top: 0; overflow: hidden;">
  33.       <l-button v-if="edit" @click="action('save')" size="lg" color="green" class="block margin-top" block>
  34.         提交保存
  35.       </l-button>
  36.       <l-button v-if="!edit && mode !== 'create'" @click="action('edit')" size="lg" line="orange" class="block margin-top" block>
  37.         编辑本页
  38.       </l-button>
  39.       <l-button v-if="edit && mode !== 'create'" @click="action('reset')" size="lg" line="red" class="block margin-top" block>
  40.         取消编辑
  41.       </l-button>
  42.       <l-button v-if="!edit && mode !== 'create'" @click="action('delete')" size="lg" line="red" class="block margin-top" block>
  43.         删除
  44.       </l-button>
  45.     </view>
  46.   </view>
  47. </template>
  48.   
  49.   
  50. <script>
  51. /*
  52.  * 版 本 Learun-ADMS V7.0.3 力软敏捷开发框架(http://www.learun.cn)
  53.  * Copyright (c) 2013-2020 上海力软信息技术有限公司
  54.  * 创建人:超级管理员
  55.  * 日  期:2020-10-16 15:39
  56.  * 描  述:工作日志
  57.  */
  58.   
  59. /**
  60.  * 本段代码由移动端代码生成器输出,移动端须 2.2.0 版本及以上可以使用
  61.  * 请在移动端 /pages.json 中的 pages 字段中添加一条记录:
  62.  * { "path": "pages/EducationalAdministration/JournalSend/single", "style": { "navigationBarTitleText": "表单详情页" } }
  63.  * 
  64.  * (navigationBarTitleText 字段为本页面的标题文本,可以修改)
  65.  * (必须自行操作该步骤,力软代码生成器不会自动帮您修改 /pages.json 文件)
  66.  */
  67.   
  68. import get from 'lodash/get'
  69. import set from 'lodash/set'
  70. import moment from 'moment'
  71. import customPageMixins from '@/common/custompage.js'
  72.   
  73. export default {
  74.   mixins: [customPageMixins],
  75.   
  76.   data() {
  77.     return {
  78.       // 页面相关参数
  79.       id: null,
  80.       mode: null,
  81.       edit: null,
  82.       ready: false,
  83.   
  84.       // 表单数据
  85.       current: {},
  86.       origin: {},
  87.   
  88.       // 表单项数据结构
  89.       scheme: {
  90.         JournalSend: {
  91.           JTitle: { type: 'text', title: '日志主题' },
  92.           JTypeId: { type: 'select', title: '日志类型', dataSource: '0' },
  93.           JReceiveId: { type: 'organize', title: '接收人', dataType: 'user' },
  94.           JContent: { type: 'textarea', title: '日志内容' },
  95.         },
  96.   
  97.       },
  98.   
  99.       // 数据源
  100.       dataSource: {
  101.         JournalSend: {
  102.           JTypeId: [],
  103.         },
  104.   
  105.       }
  106.     }
  107.   },
  108.   
  109.   async onLoad({ type, id }) {
  110.     await this.init(type, id)
  111.   },
  112.   
  113.   methods: {
  114.     // 页面初始化
  115.     async init(type, id) {
  116.       this.LOADING('加载数据中...')
  117.   
  118.       this.id = id
  119.       this.mode = type
  120.       this.edit = ['create', 'edit'].includes(this.mode)
  121.   
  122.       // 拉取表单数据,同时拉取所有来自数据源的选单数据
  123.       await Promise.all([
  124.   
  125.   
  126.         () => {}
  127.       ])
  128.       await this.fetchForm()
  129.   
  130.       this.ready = true
  131.       this.HIDE_LOADING()
  132.     },
  133.   
  134.     // 加载表单数据
  135.     async fetchForm() {
  136.       if (this.mode === 'create') {
  137.         this.origin = await this.getDefaultForm()
  138.       } else {
  139.         const result = await this.HTTP_GET('/EducationalAdministration/Journal/form', this.id)
  140.         this.origin = await this.formatFormData(result)
  141.       }
  142.       this.current = this.COPY(this.origin)
  143.     },
  144.   
  145.     // 点击 「编辑」、「重置」、「保存」、「删除」 按钮
  146.     async action(type) {
  147.       switch (type) {
  148.         case 'edit':
  149.           this.edit = true
  150.           break
  151.   
  152.         case 'reset':
  153.           this.current = this.COPY(this.origin)
  154.           this.edit = false
  155.           break
  156.   
  157.         case 'save':
  158.           const verifyResult = this.verifyForm()
  159.           if (verifyResult.length > 0) {
  160.             this.CONFIRM('表单验证失败', verifyResult.join('\n'))
  161.             return
  162.           }
  163.   
  164.           if (!(await this.CONFIRM('提交确认', '确定要提交本页表单内容吗?', true))) {
  165.             return
  166.           }
  167.   
  168.           this.LOADING('正在提交...')
  169.           const postData = await this.getPostData(this.id)
  170.   
  171.           this.HTTP_POST('/EducationalAdministration/Journal/save', postData, '表单提交保存失败').then(success => {
  172.             this.HIDE_LOADING()
  173.             if (!success) {
  174.               return
  175.             }
  176.   
  177.             this.EMIT('EducationalAdministrationJournalSend-list-change')
  178.             this.NAV_BACK()
  179.             this.TOAST('提交保存成功')
  180.           })
  181.           break
  182.   
  183.         case 'delete':
  184.           if (!(await this.CONFIRM('删除项目', '确定要删除本项吗?', true))) {
  185.             return
  186.           }
  187.   
  188.           this.LOADING('提交删除中...')
  189.           this.HTTP_POST('/EducationalAdministration/Journal/delete', this.id, '删除失败').then(success => {
  190.             this.HIDE_LOADING()
  191.             if (!success) {
  192.               return
  193.             }
  194.   
  195.             this.EMIT('EducationalAdministrationJournalSend-list-change')
  196.             this.NAV_BACK()
  197.             this.this.TOAST('删除成功', 'success')
  198.           })
  199.           break
  200.   
  201.         default: break
  202.       }
  203.     },
  204.   
  205.     // 获取表单值
  206.     getValue(path) {
  207.       return get(this.current, path)
  208.     },
  209.   
  210.     // 设置表单值
  211.     setValue(path, val) {
  212.       set(this.current, path, val)
  213.     }
  214.   }
  215. }
  216. </script>