新增文档创建和编辑

src/apis/document.js

@@ -8,22 +8,22 @@ export default {
   },
 
   getDocNew: {
-    url: '/vue/ducument/get-new'
+    url: '/vue/document/get-new'
   },
 
   saveDocNew: {
-    url: '/vue/ducument/save-new'
+    url: '/vue/document/save-new'
   },
 
   getDocEdit: {
-    url: '/vue/ducument/get-edit'
+    url: '/vue/document/get-edit'
   },
 
   saveDocEdit: {
-    url: '/vue/ducument/save-edit'
+    url: '/vue/document/save-edit'
   },
 
   deleteDoc: {
-    url: '/vue/ducument/delete'
+    url: '/vue/document/delete'
   }
 }

src/assets/css/document-app.scss

-document-app {
+.document-app {
+  .el-button--cancel {
+    color:white;
+    background-color: #EB7567;
+    border-color: #e86150;
+  }
+  .el-button--confirm {
+    color:white;
+    background-color:#649FD7;
+    border-color:#5092d2;
+  }
+  .obear-app-frame__white {
+    border: 1px solid white;
+    border-radius:2px;
+    padding: 0 2px 0 2px;
+  }
+  .el-radio-button__inner, .el-radio-button:last-child .el-radio-button__inner, .el-radio-button:first-child .el-radio-button__inner{
+    border-left: 1px solid #DCDFE6;
+    margin: 0 2px 0 0;
+    border-radius: 3px;
+  }
+  .el-radio-button__inner:hover{
+    color: #333;
+    background-color: #e6e6e6;
+    border-color: #adadad;
+  }
+  .el-radio-button__orig-radio:checked+.el-radio-button__inner{
+    color: #fff;
+    background-color: #17a2b8;
+    border-color: #17a2b8;
+    box-shadow: 0 0 0 0 #17a2b8;
+  }
+  .el-radio-button__orig-radio:checked+.el-radio-button__inner:hover{
+    color: #333;
+    background-color: #d4d4d4;
+    border-color: #8c8c8c;
+  }
+  .ec-page-wrapper .el-form-item__label {
+    color: white;
+  }
+
+  .mb10 {
+    margin-bottom:10px;
+  }
+
+  .single {
+    & .el-radio-button__inner, .el-radio-button:last-child .el-radio-button__inner, .el-radio-button:first-child .el-radio-button__inner{
+      border-left: 1px solid #DCDFE6;
+      margin: 0 10px 5px 0;
+      border-radius: 3px;
+    }
+    & .el-radio-button__inner:hover{
+      color: #333;
+      background-color: #e6e6e6;
+      border-color: #adadad;
+    }
+    & .el-radio-button__orig-radio:checked+.el-radio-button__inner{
+      color: #fff;
+      background-color: #3c3c3c;
+      border-color: #373737;
+      box-shadow: 0 0 0 0 #373737;
+    }
+    & .el-radio-button__orig-radio:checked+.el-radio-button__inner:hover{
+      color: #333;
+      background-color: #d4d4d4;
+      border-color: #8c8c8c;
+    }
+  }
 }

src/components/common/settingMixin.js

@@ -63,6 +63,21 @@ export default {
     taskGroupsUArray () {
       let ret = this.getArrayByKey('TaskGroups', 'taskGroupUsers')
       return ret && [].concat(ret.value)
+    },
+
+    docIsTemplateArray () {
+      let ret = this.getArrayByKey('Documents', 'is_template')
+      return ret && [].concat(ret.value)
+    },
+
+    docTypeTagsArray () {
+      let ret = this.getArrayByKey('Documents', 'documentTypeTags')
+      return ret && [].concat(ret.value)
+    },
+
+    docDepartmentIdArray () {
+      let ret = this.getArrayByKey('Documents', 'department_id')
+      return ret && [].concat(ret.value)
     }
   },
 
@@ -86,6 +101,26 @@ export default {
       })
     },
 
+    initEditSetting (params, id) {
+      let methods = this.$options && this.$options.methods
+      return methods[params].call(this, id)
+    },
+
+    getDocEdit (id) {
+      return requestAPI(api.getDocEdit, { id })
+        .then((res) => {
+          this.retNewArray = res.options
+          return res.model
+        })
+    },
+
+    getDocNew () {
+      requestAPI(api.getDocNew)
+        .then((res) => {
+          this.retNewArray = res.options
+        })
+    },
+
     getTaskGroupNew () {
       requestAPI(api.getTaskGroupNew)
         .then((res) => {

src/components/document/documentForm.vue

+<template>
+  <section class="ec-page-wrapper" style="overflow: hidden; padding-bottom: 0px;">
+    <el-form label-width="120px" ref="form" :rules="rules" :model="model" class="ec-create-form">
+      <el-form-item label="标题：" prop="title" class="ec-form-item ec-clear-left is-required">
+        <el-input
+          class="ec-input-normal"
+          size="mini"
+          v-model.trim="model.title">
+        </el-input>
+      </el-form-item>
+        <el-form-item label="备注：" prop="description" class="ec-clear-left ec-form-item-lg">
+        <el-input
+          class="ec-input-normal"
+          type="textarea"
+          :rows="3"
+          v-model.trim="model.description">
+        </el-input>
+      </el-form-item>
+      <el-form-item label="是否为模版：" prop="is_template" class="ec-clear-left is-required">
+        <single-radio
+          :form-item="model.is_template"
+          :options-list="docIsTemplateArray"
+          @update:item="val => {model.is_template = val}">
+        </single-radio>
+      </el-form-item>
+      <el-form-item label="文档类型：" prop="documentTypeTag" class="ec-clear-left is-required">
+        <single-radio
+          :form-item="model.documentTypeTag"
+          :options-list="docTypeTagsArray"
+          @update:item="val => {model.documentTypeTag = val}">
+        </single-radio>
+      </el-form-item>
+      <el-form-item label="文档部门：" prop="department_id" class="ec-clear-left is-required">
+        <single-radio
+          :form-item="model.department_id"
+          :options-list="docDepartmentIdArray"
+          @update:item="val => {model.department_id = val}">
+        </single-radio>
+      </el-form-item>
+      <el-form-item label="文档分类：" prop="documentType" class="ec-clear-left ec-form-item-lg is-required">
+        <el-select v-model="model.documentType" size="small" placeholder="请选择">
+        <el-option v-for="(option, optKey) in options.documentTypeArray"
+                   :key="optKey"
+                   :label="option.name"
+                   :value="option.key"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="文档：" prop="attachment_id" class="ec-clear-left ec-form-item-lg is-required">
+        <el-input
+          class="ec-input-normal"
+          size="mini"
+          v-model.trim="model.attachment_id">
+        </el-input>
+      </el-form-item>
+    </el-form>
+  </section>
+</template>
+<script>
+import singleRadio from '../common/singleRadio'
+import settingMixin from '../common/settingMixin'
+import {
+  requestAPI,
+  api
+} from '@/lib/commonMixin'
+export default {
+  name: 'documentForm',
+
+  mixins: [settingMixin],
+
+  props: {
+    model: Object
+  },
+
+  components: {
+    singleRadio
+  },
+
+  data () {
+    return {
+      options: {
+        documentTypeArray: []
+      },
+      rules: {
+        'title': [
+          {required: true, message: '标题不能为空', trigger: 'blur'}
+        ],
+        'documentTypeTag': [
+          {required: true, message: '文档类型不能为空', trigger: 'change'}
+        ],
+        'department_id': [
+          {required: true, message: '部门不能为空', trigger: 'change'}
+        ],
+        'documentType': [
+          {required: true, message: '文档分类不能为空', trigger: 'blur'}
+        ],
+        'attachment_id': [
+          {required: true, message: '未上传 ', trigger: 'blur'}
+        ]
+      },
+      query: {}
+    }
+  },
+
+  created () {
+    this.$watch('model.task_group_id', function (val) {
+      this.getHeadOfArray(val)
+    })
+  },
+
+  mounted () {
+  },
+
+  computed: {
+  },
+
+  methods: {
+    getNew () {
+      this.initSetting(['getDocNew'])
+    },
+
+    getEdit (id) {
+      return this.initEditSetting('getDocEdit', id)
+    },
+
+    _validate (cb) {
+      this.$refs['form'].validate((valid) => {
+        if (valid) {
+          cb && cb()
+        }
+      })
+    },
+
+    _resetFields () {
+      this.$refs['form'].resetFields()
+    },
+
+    getHeadOfArray (id) {
+      requestAPI(api.getMembersById, {
+        id: id
+      }).then(res => {
+        this.options.headOfArray = res
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.ec-create-form .el-form-item {
+  width: 70%;
+}
+// .ec-create-form .el-form-item {
+//   width: 100%;
+// }
+</style>

src/components/document/documentModal.vue

+<template>
+  <section>
+    <sidePopup ref="sidePopup" title="新建文档" :width="50">
+      <DocumentForm
+        ref="docForm"
+        :model="model">
+      </DocumentForm>
+      <div class="mt20" style="margin-left: 150px;">
+        <el-button type="cancel" @click.stop.prevent="handleClose" size="mini">取 消</el-button>
+        <el-button type="confirm" @click.stop.prevent="save" size="mini">确 定</el-button>
+      </div>
+    </sidePopup>
+  </section>
+</template>
+<script>
+import {
+  requestAPI,
+  api,
+  UTIL
+} from '@/lib/commonMixin'
+import DocumentForm from './documentForm'
+import { setModule } from '@/lib/viewHelper'
+export default {
+
+  components: {
+    DocumentForm
+  },
+
+  data () {
+    return {
+      diaVis: false,
+      model: {
+        id: '',
+        title: '',
+        description: '',
+        is_template: 0,
+        documentTypeTag: '',
+        department_id: '',
+        documentType: '',
+        attachment_id: ''
+      }
+    }
+  },
+
+  methods: {
+    show (model) {
+      if (model) {
+        this.$refs.docForm.getEdit(model.id)
+          .then((_model) => {
+            UTIL.flatten(this.model, _model)
+            this.model.documentTypeTag = _model.documentTypeTag.key
+          })
+      } else {
+        this.$refs.docForm.getNew()
+      }
+      this.$refs.sidePopup.show()
+    },
+
+    handleClose () {
+      this.$refs.sidePopup.close(() => {
+        this.$refs.docForm._resetFields()
+      })
+    },
+
+    save () {
+      let _params = Object.assign({}, setModule(this.model, 'Documents'))
+      let _apiUrl = !this.model.id ? api.saveDocNew : api.saveDocEdit
+      !this.model.id && delete _params['Documents[id]']
+      this.$refs['docForm']._validate(() => {
+        requestAPI(Object.assign(_apiUrl, { method: 'POST' }), _params)
+          .then((res) => {
+            this.$refs.sidePopup.close()
+            this.$message.success('操作成功')
+            this.$parent.reload()
+          }) // save
+      }) // validate
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/components/document_list/documentHome.vue

@@ -34,7 +34,7 @@
               type="primary"
               size="mini"
               @click.prevent.stop="editSch(item)"
-              :disabled="!item.can_update">
+              :disabled="item.can_update">
               <i class="fa fa-edit animated"></i>编辑
             </el-button>
             <el-button
@@ -65,7 +65,7 @@
         </leave-message>
       </div>
     </div>
-    <FormModal ref="fromModal"></FormModal>
+    <FormModal ref="formModal"></FormModal>
   </section>
 </template>