客户新建文档

src/apis/document.js

@@ -34,5 +34,21 @@ export default {
   /* 客户新建文档 */
   getListDocument: {
     url: '/vue/client/list-document'
+  },
+
+  getClientById: {
+    url: '/vue/client/get-edit'
+  },
+
+  getEditDocument: {
+    url: '/vue/client/get-edit-document'
+  },
+
+  saveNewDocument: {
+    url: '/vue/client/save-new-document'
+  },
+
+  saveEditDocument: {
+    url: '/vue/client/save-edit-document'
   }
 }

src/components/document_client/clientForm.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>
+  </section>
+</template>
+<script>
+import settingMixin from '../common/settingMixin'
+import {
+  requestAPI,
+  api
+} from '@/lib/commonMixin'
+export default {
+  name: 'clientForm',
+
+  mixins: [settingMixin],
+
+  props: {
+    model: Object
+  },
+
+  components: {
+  },
+
+  data () {
+    return {
+      rules: {
+        'title': [
+          {required: true, message: '标题不能为空', trigger: 'blur'}
+        ]
+      },
+      query: {}
+    }
+  },
+
+  created () {
+  },
+
+  mounted () {
+  },
+
+  computed: {
+  },
+
+  methods: {
+    getEdit (id) {
+      return this.getClientDoc(id)
+    },
+
+    _validate (cb) {
+      this.$refs['form'].validate((valid) => {
+        if (valid) {
+          cb && cb()
+        }
+      })
+    },
+
+    _resetFields () {
+      this.$refs['form'].resetFields()
+    },
+
+    getClientDoc (id) {
+      return requestAPI(api.getEditDocument, {
+        id: id
+      }).then(res => {
+        return 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_client/clientModal.vue

+<template>
+  <section>
+    <sidePopup ref="sidePopup" title="新建客户文档" :width="50" @update:close="() => btnClose()">
+      <DocumentForm
+        ref="docForm"
+        :model="model">
+      </DocumentForm>
+      <div class="mt20" style="margin-left: 150px;">
+        <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 './clientForm'
+import { setModule } from '@/lib/viewHelper'
+export default {
+
+  components: {
+    DocumentForm
+  },
+
+  data () {
+    return {
+      diaVis: false,
+      model: {
+        id: '',
+        client_id: '',
+        attachment_id: '',
+        title: '',
+        description: ''
+      }
+    }
+  },
+
+  methods: {
+    show (model) {
+      if (typeof model === 'number' || typeof model === 'string') {
+        this.model.client_id = model
+      } else {
+        this.$refs.docForm.getEdit(model.id)
+          .then((res) => {
+            UTIL.flatten(this.model, res.model)
+          })
+      }
+      this.$refs.sidePopup.show()
+    },
+
+    handleClose () {
+      this.$refs.sidePopup.close(() => {
+        this.$refs.docForm._resetFields()
+      })
+    },
+
+    btnClose () {
+      this.$refs.docForm._resetFields()
+    },
+
+    save () {
+      let _params = Object.assign({}, setModule(this.model, 'ClientDocuments'))
+      let _apiUrl = !this.model.id ? api.saveNewDocument : api.saveEditDocument
+      !this.model.id && delete _params['ClientDocuments[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_client/documentView.vue

@@ -4,12 +4,12 @@
       <div>
         <el-row :gutter="10" class="header-title">
           <el-col :span="12">
-            <h2>客户名称：{{ (result.list[0] && result.list[0].client && result.list[0].client.name) || '未知' }}</h2>
+            <h2>客户名称：{{ title }}</h2>
           </el-col>
         </el-row>
       </div>
       <div class="page-body-content leaveMessage">
-        <client-nav :trigger="addSchedule" trigger-text="新建客户文档"></client-nav>
+        <client-nav :trigger="addSch" trigger-text="新建客户文档"></client-nav>
         <Item
           v-for="item in result.list"
           :item="item"
@@ -63,7 +63,7 @@
 
 <script>
 import Item from './documentItem'
-import FormModal from '../document/documentModal'
+import FormModal from './clientModal'
 import Pagenation from '../document_list/documentPagenation'
 import {
   requestAPI,
@@ -80,6 +80,8 @@ export default {
 
   data () {
     return {
+      id: '', // 客户id
+      title: '',
       lmTemplate: [
         {
           name: '文档名称',
@@ -129,6 +131,14 @@ export default {
         client_id: id,
         page: this.pagenation.thispage
       })
+      this.getClientById(id)
+    },
+
+    getClientById (id) {
+      requestAPI(api.getClientById, { id })
+        .then((res) => {
+          this.title = res.model.name
+        })
     },
 
     // 2.列表数据
@@ -157,7 +167,7 @@ export default {
 
     // 6.1新增
     addSch () {
-      this.$refs.formModal.show()
+      this.$refs.formModal.show(this.id)
     },
 
     // 6.2编辑
@@ -194,9 +204,7 @@ export default {
     lmClose () {
       this.$refs.leaveMessage &&
       this.$refs.leaveMessage.btnClose()
-    },
-
-    addSchedule () {}
+    }
   }
 }
 </script>