工单管理

base-vue/src/views/modules/contract/contract-add-or-update.vue

@@ -1,162 +1,37 @@
 <template>
   <el-dialog
-    title="合同基本信息"
+    :title="!dataForm.contractId ? '新增' : '修改'"
     :close-on-click-modal="false"
     :visible.sync="visible">
-    <el-form :model="dataForm" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="114px">
-      <el-row>
-        <el-col :span="9">
-          <el-form-item label="合同类型">
-            <el-select v-model="dataForm.type" placeholder="合同类型">
-              <el-option label="区域一" value="shanghai"></el-option>
-              <el-option label="区域二" value="beijing"></el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
-        <el-col :span="9">
-          <el-form-item label="工单编号">
-            <el-input v-model="dataForm.code" placeholder="工单编号"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="6">
-          <el-form-item label="是否主合同">
-            <el-switch
-              v-model="dataForm.isS"
-              active-color="#13ce66"
-              inactive-color="#ff4949">
-            </el-switch>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="9">
-          <el-form-item label="关联主合同编号">
-            <el-input v-model="dataForm.code" placeholder="关联主合同编号"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="9">
-          <el-form-item label="客户">
-            <el-select v-model="dataForm.type" placeholder="客户">
-              <el-option label="区域一" value="shanghai"></el-option>
-              <el-option label="区域二" value="beijing"></el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="9">
-          <el-form-item label="保修期">
-            <el-input v-model="dataForm.code" placeholder="保修期"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="9">
-          <el-form-item label="付款方式">
-            <el-select v-model="dataForm.type" placeholder="付款方式">
-              <el-option label="区域一" value="shanghai"></el-option>
-              <el-option label="区域二" value="beijing"></el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row type="flex" justify="space-between">
-        <el-col :span="6">
-          <el-button type="primary">新增一行</el-button>
-        </el-col>
-        <el-col :span="9">
-          <el-form-item label="总计">
-            <el-input v-model="dataForm.code" placeholder="总计"></el-input>
-          </el-form-item>
-        </el-col>
-      </el-row>
+    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
+    <el-form-item label="合同类型" prop="contractType">
+      <el-input v-model="dataForm.contractType" placeholder="合同类型"></el-input>
+    </el-form-item>
+    <el-form-item label="是否是主合同" prop="isMaster">
+      <el-input v-model="dataForm.isMaster" placeholder="是否是主合同"></el-input>
+    </el-form-item>
+    <el-form-item label="合同编号" prop="contractNumber">
+      <el-input v-model="dataForm.contractNumber" placeholder="合同编号"></el-input>
+    </el-form-item>
+    <el-form-item label="客户id" prop="clientId">
+      <el-input v-model="dataForm.clientId" placeholder="客户id"></el-input>
+    </el-form-item>
+    <el-form-item label="物料信息" prop="materialJson">
+      <el-input v-model="dataForm.materialJson" placeholder="物料信息"></el-input>
+    </el-form-item>
+    <el-form-item label="是否验收" prop="isAcceptance">
+      <el-input v-model="dataForm.isAcceptance" placeholder="是否验收"></el-input>
+    </el-form-item>
+    <el-form-item label="创建日期" prop="createTime">
+      <el-input v-model="dataForm.createTime" placeholder="创建日期"></el-input>
+    </el-form-item>
+    <el-form-item label="创建日期" prop="acceptanceTime">
+      <el-input v-model="dataForm.acceptanceTime" placeholder="创建日期"></el-input>
+    </el-form-item>
+    <el-form-item label="备注" prop="remarks">
+      <el-input v-model="dataForm.remarks" placeholder="备注"></el-input>
+    </el-form-item>
     </el-form>
-    <el-table
-      :data="dataList"
-      border
-      style="width: 100%;"
-      max-height="200">
-      <el-table-column
-        type="selection"
-        header-align="center"
-        align="center"
-        width="50">
-      </el-table-column>
-      <el-table-column
-        prop="code"
-        header-align="center"
-        align="center"
-        label="物料编号">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="物料名称">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="型号">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="单价">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="价格系数">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="价格系数">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="对外价格">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="数量">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="总价">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="总价">
-      </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="备注">
-      </el-table-column>
-      <el-table-column
-        fixed="right"
-        header-align="center"
-        align="center"
-        width="70"
-        label="操作">
-        <template slot-scope="scope">
-          <el-button type="text" size="small">删除行</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
     <span slot="footer" class="dialog-footer">
       <el-button @click="visible = false">取消</el-button>
       <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
@@ -165,27 +40,117 @@
 </template>
 
 <script>
-export default {
-  data () {
-    return {
-      visible: false,
-      dataForm: {
-        type: '',
-        code: '',
-        isS: true
-      },
-      dataList: [{code: '100010'}, {code: '100010'}, {code: '100010'}]
-    }
-  },
-  methods: {
-    init (id) {
-      this.visible = true
-      this.$nextTick(() => {
-        this.$refs['dataForm'].resetFields()
-      })
+  export default {
+    data () {
+      return {
+        visible: false,
+        dataForm: {
+          contractId: 0,
+          contractType: '',
+          isMaster: '',
+          contractNumber: '',
+          clientId: '',
+          materialJson: '',
+          isAcceptance: '',
+          createTime: '',
+          acceptanceTime: '',
+          remarks: ''
+        },
+        dataRule: {
+          contractType: [
+            { required: true, message: '合同类型不能为空', trigger: 'blur' }
+          ],
+          isMaster: [
+            { required: true, message: '是否是主合同不能为空', trigger: 'blur' }
+          ],
+          contractNumber: [
+            { required: true, message: '合同编号不能为空', trigger: 'blur' }
+          ],
+          clientId: [
+            { required: true, message: '客户id不能为空', trigger: 'blur' }
+          ],
+          materialJson: [
+            { required: true, message: '物料信息不能为空', trigger: 'blur' }
+          ],
+          isAcceptance: [
+            { required: true, message: '是否验收不能为空', trigger: 'blur' }
+          ],
+          createTime: [
+            { required: true, message: '创建日期不能为空', trigger: 'blur' }
+          ],
+          acceptanceTime: [
+            { required: true, message: '创建日期不能为空', trigger: 'blur' }
+          ],
+          remarks: [
+            { required: true, message: '备注不能为空', trigger: 'blur' }
+          ]
+        }
+      }
     },
-    // 表单提交
-    dataFormSubmit () {}
+    methods: {
+      init (id) {
+        this.dataForm.contractId = id || 0
+        this.visible = true
+        this.$nextTick(() => {
+          this.$refs['dataForm'].resetFields()
+          if (this.dataForm.contractId) {
+            this.$http({
+              url: this.$http.adornUrl(`/tickets/contract/info/${this.dataForm.contractId}`),
+              method: 'get',
+              params: this.$http.adornParams()
+            }).then(({data}) => {
+              if (data && data.code === 0) {
+                this.dataForm.contractType = data.contract.contractType
+                this.dataForm.isMaster = data.contract.isMaster
+                this.dataForm.contractNumber = data.contract.contractNumber
+                this.dataForm.clientId = data.contract.clientId
+                this.dataForm.materialJson = data.contract.materialJson
+                this.dataForm.isAcceptance = data.contract.isAcceptance
+                this.dataForm.createTime = data.contract.createTime
+                this.dataForm.acceptanceTime = data.contract.acceptanceTime
+                this.dataForm.remarks = data.contract.remarks
+              }
+            })
+          }
+        })
+      },
+      // 表单提交
+      dataFormSubmit () {
+        this.$refs['dataForm'].validate((valid) => {
+          if (valid) {
+            this.$http({
+              url: this.$http.adornUrl(`/tickets/contract/${!this.dataForm.contractId ? 'save' : 'update'}`),
+              method: 'post',
+              data: this.$http.adornData({
+                'contractId': this.dataForm.contractId || undefined,
+                'contractType': this.dataForm.contractType,
+                'isMaster': this.dataForm.isMaster,
+                'contractNumber': this.dataForm.contractNumber,
+                'clientId': this.dataForm.clientId,
+                'materialJson': this.dataForm.materialJson,
+                'isAcceptance': this.dataForm.isAcceptance,
+                'createTime': this.dataForm.createTime,
+                'acceptanceTime': this.dataForm.acceptanceTime,
+                'remarks': this.dataForm.remarks
+              })
+            }).then(({data}) => {
+              if (data && data.code === 0) {
+                this.$message({
+                  message: '操作成功',
+                  type: 'success',
+                  duration: 1500,
+                  onClose: () => {
+                    this.visible = false
+                    this.$emit('refreshDataList')
+                  }
+                })
+              } else {
+                this.$message.error(data.msg)
+              }
+            })
+          }
+        })
+      }
+    }
   }
-}
-</script>
+</script>

base-vue/src/views/modules/contract/contract-add-or-update_back.vue

@@ -0,0 +1,191 @@
+<template>
+  <el-dialog
+    title="合同基本信息"
+    :close-on-click-modal="false"
+    :visible.sync="visible">
+    <el-form :model="dataForm" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="114px">
+      <el-row>
+        <el-col :span="9">
+          <el-form-item label="合同类型">
+            <el-select v-model="dataForm.type" placeholder="合同类型">
+              <el-option label="区域一" value="shanghai"></el-option>
+              <el-option label="区域二" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item label="工单编号">
+            <el-input v-model="dataForm.code" placeholder="工单编号"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="是否主合同">
+            <el-switch
+              v-model="dataForm.isS"
+              active-color="#13ce66"
+              inactive-color="#ff4949">
+            </el-switch>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="9">
+          <el-form-item label="关联主合同编号">
+            <el-input v-model="dataForm.code" placeholder="关联主合同编号"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item label="客户">
+            <el-select v-model="dataForm.type" placeholder="客户">
+              <el-option label="区域一" value="shanghai"></el-option>
+              <el-option label="区域二" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="9">
+          <el-form-item label="保修期">
+            <el-input v-model="dataForm.code" placeholder="保修期"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item label="付款方式">
+            <el-select v-model="dataForm.type" placeholder="付款方式">
+              <el-option label="区域一" value="shanghai"></el-option>
+              <el-option label="区域二" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between">
+        <el-col :span="6">
+          <el-button type="primary">新增一行</el-button>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item label="总计">
+            <el-input v-model="dataForm.code" placeholder="总计"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <el-table
+      :data="dataList"
+      border
+      style="width: 100%;"
+      max-height="200">
+      <el-table-column
+        type="selection"
+        header-align="center"
+        align="center"
+        width="50">
+      </el-table-column>
+      <el-table-column
+        prop="code"
+        header-align="center"
+        align="center"
+        label="物料编号">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="物料名称">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="型号">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="单价">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="价格系数">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="价格系数">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="对外价格">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="数量">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="总价">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="总价">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="备注">
+      </el-table-column>
+      <el-table-column
+        fixed="right"
+        header-align="center"
+        align="center"
+        width="70"
+        label="操作">
+        <template slot-scope="scope">
+          <el-button type="text" size="small">删除行</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">取消</el-button>
+      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      visible: false,
+      dataForm: {
+        type: '',
+        code: '',
+        isS: true
+      },
+      dataList: [{code: '100010'}, {code: '100010'}, {code: '100010'}]
+    }
+  },
+  methods: {
+    init (id) {
+      this.visible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].resetFields()
+      })
+    },
+    // 表单提交
+    dataFormSubmit () {}
+  }
+}
+</script>

base-vue/src/views/modules/contract/contract.vue

@@ -1,22 +1,13 @@
 <template>
-  <div class="mod-order">
+  <div class="mod-config">
     <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
-      <el-form-item label="合同类型">
-        <el-select v-model="dataForm.type" placeholder="合同类型">
-          <el-option label="区域一" value="shanghai"></el-option>
-          <el-option label="区域二" value="beijing"></el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="合同编号">
-        <el-input v-model="dataForm.number" placeholder="合同编号" clearable></el-input>
-      </el-form-item>
-      <el-form-item label="客户名称">
-        <el-input v-model="dataForm.name" placeholder="客户名称" clearable></el-input>
+      <el-form-item>
+        <el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
       </el-form-item>
       <el-form-item>
         <el-button @click="getDataList()">查询</el-button>
-        <el-button type="primary" @click="addOrUpdateHandle">新增</el-button>
-        <el-button type="danger">删除</el-button>
+        <el-button v-if="isAuth('tickets:contract:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+        <el-button v-if="isAuth('tickets:contract:delete')" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">批量删除</el-button>
       </el-form-item>
     </el-form>
     <el-table
@@ -32,65 +23,65 @@
         width="50">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="contractId"
         header-align="center"
         align="center"
-        label="合同编号">
+        label="id">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="contractType"
         header-align="center"
         align="center"
         label="合同类型">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="isMaster"
         header-align="center"
         align="center"
-        label="是否主合同">
+        label="是否是主合同">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="contractNumber"
         header-align="center"
         align="center"
-        label="客户名称">
+        label="合同编号">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="clientId"
         header-align="center"
         align="center"
-        label="关联主合同号">
+        label="客户id">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="materialJson"
+        header-align="center"
+        align="center"
+        label="物料信息">
+      </el-table-column>
+      <el-table-column
+        prop="isAcceptance"
         header-align="center"
         align="center"
         label="是否验收">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="createTime"
         header-align="center"
         align="center"
-        label="生成时间">
+        label="创建日期">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="acceptanceTime"
         header-align="center"
         align="center"
-        label="验收时间">
+        label="创建日期">
       </el-table-column>
       <el-table-column
-        prop="roleName"
+        prop="remarks"
         header-align="center"
         align="center"
         label="备注">
       </el-table-column>
-      <el-table-column
-        prop="roleName"
-        header-align="center"
-        align="center"
-        label="质保期限(月)">
-      </el-table-column>
       <el-table-column
         fixed="right"
         header-align="center"
@@ -98,8 +89,8 @@
         width="150"
         label="操作">
         <template slot-scope="scope">
-          <el-button type="text" size="small" @click="addTempHandle(scope.row.id)">模板生成</el-button>
-          <el-button type="text" size="small">上传附件</el-button>
+          <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.contractId)">修改</el-button>
+          <el-button type="text" size="small" @click="deleteHandle(scope.row.contractId)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -114,90 +105,107 @@
     </el-pagination>
     <!-- 弹窗, 新增 / 修改 -->
     <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
-    <temp-add v-if="tempVisible" ref="tempAdd"></temp-add>
   </div>
 </template>
 
 <script>
-import AddOrUpdate from './contract-add-or-update'
-import TempAdd from './temp-add'
-export default {
-  components: {
-    AddOrUpdate,
-    TempAdd
-  },
-  data () {
-    return {
-      dataForm: {
-        type: '',
-        number: '',
-        name: ''
-      },
-      dataList: [],
-      pageIndex: 1,
-      pageSize: 10,
-      totalPage: 0,
-      dataListLoading: false,
-      dataListSelections: [],
-      addOrUpdateVisible: false,
-      tempVisible: false
-    }
-  },
-  activated () {
-    this.getDataList()
-  },
-  methods: {
-    // 获取数据列表
-    getDataList () {
-      this.dataListLoading = true
-      this.$http({
-        url: this.$http.adornUrl('/sys/role/list'),
-        method: 'get',
-        params: this.$http.adornParams({
-          'page': this.pageIndex,
-          'limit': this.pageSize,
-          'roleName': this.dataForm.roleName
+  import AddOrUpdate from './contract-add-or-update'
+  export default {
+    data () {
+      return {
+        dataForm: {
+          key: ''
+        },
+        dataList: [],
+        pageIndex: 1,
+        pageSize: 10,
+        totalPage: 0,
+        dataListLoading: false,
+        dataListSelections: [],
+        addOrUpdateVisible: false
+      }
+    },
+    components: {
+      AddOrUpdate
+    },
+    activated () {
+      this.getDataList()
+    },
+    methods: {
+      // 获取数据列表
+      getDataList () {
+        this.dataListLoading = true
+        this.$http({
+          url: this.$http.adornUrl('/tickets/contract/list'),
+          method: 'get',
+          params: this.$http.adornParams({
+            'page': this.pageIndex,
+            'limit': this.pageSize,
+            'key': this.dataForm.key
+          })
+        }).then(({data}) => {
+          if (data && data.code === 0) {
+            this.dataList = data.page.list
+            this.totalPage = data.page.totalCount
+          } else {
+            this.dataList = []
+            this.totalPage = 0
+          }
+          this.dataListLoading = false
         })
-      }).then(({data}) => {
-        if (data && data.code === 0) {
-          this.dataList = data.page.list
-          this.totalPage = data.page.totalCount
-        } else {
-          this.dataList = []
-          this.totalPage = 0
-        }
-        this.dataListLoading = false
-      })
-    },
-    // 每页数
-    sizeChangeHandle (val) {
-      this.pageSize = val
-      this.pageIndex = 1
-      this.getDataList()
-    },
-    // 当前页
-    currentChangeHandle (val) {
-      this.pageIndex = val
-      this.getDataList()
-    },
-    // 多选
-    selectionChangeHandle (val) {
-      this.dataListSelections = val
-    },
-    // 新增
-    addOrUpdateHandle (id) {
-      this.addOrUpdateVisible = true
-      this.$nextTick(() => {
-        this.$refs.addOrUpdate.init(id)
-      })
-    },
-    // 生成模板
-    addTempHandle (id) {
-      this.tempVisible = true
-      this.$nextTick(() => {
-        this.$refs.tempAdd.init(id)
-      })
+      },
+      // 每页数
+      sizeChangeHandle (val) {
+        this.pageSize = val
+        this.pageIndex = 1
+        this.getDataList()
+      },
+      // 当前页
+      currentChangeHandle (val) {
+        this.pageIndex = val
+        this.getDataList()
+      },
+      // 多选
+      selectionChangeHandle (val) {
+        this.dataListSelections = val
+      },
+      // 新增 / 修改
+      addOrUpdateHandle (id) {
+        this.addOrUpdateVisible = true
+        this.$nextTick(() => {
+          this.$refs.addOrUpdate.init(id)
+        })
+      },
+      // 删除
+      deleteHandle (id) {
+        var ids = id ? [id] : this.dataListSelections.map(item => {
+          return item.contractId
+        })
+        this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.$http({
+            url: this.$http.adornUrl('/tickets/contract/delete'),
+            method: 'post',
+            data: this.$http.adornData(ids, false)
+          }).then(({data}) => {
+            if (data && data.code === 0) {
+              this.$message({
+                message: '操作成功',
+                type: 'success',
+                duration: 1500,
+                onClose: () => {
+                  this.getDataList()
+                }
+              })
+            } else {
+              this.$message.error(data.msg)
+            }
+          })
+        })
+      }
     }
   }
-}
-</script>
+</script>

base-vue/src/views/modules/contract/contract_back.vue

@@ -0,0 +1,246 @@
+<template>
+  <div class="mod-order">
+    <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+      <el-form-item label="合同类型">
+        <el-select v-model="dataForm.type" placeholder="合同类型">
+          <el-option label="区域一" value="shanghai"></el-option>
+          <el-option label="区域二" value="beijing"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="合同编号">
+        <el-input v-model="dataForm.number" placeholder="合同编号" clearable></el-input>
+      </el-form-item>
+      <el-form-item label="客户名称">
+        <el-input v-model="dataForm.name" placeholder="客户名称" clearable></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getDataList()">查询</el-button>
+        <el-button type="primary" @click="addOrUpdateHandle">新增</el-button>
+        <el-button type="primary" @click="addAndPrint">打印</el-button>
+        <el-button type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">删除</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      :data="dataList"
+      border
+      v-loading="dataListLoading"
+      @selection-change="selectionChangeHandle"
+      style="width: 100%;">
+      <el-table-column
+        type="selection"
+        header-align="center"
+        align="center"
+        width="50">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="合同编号">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="合同类型">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="是否主合同">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="客户名称">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="关联主合同号">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="是否验收">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="生成时间">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="验收时间">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="备注">
+      </el-table-column>
+      <el-table-column
+        prop="roleName"
+        header-align="center"
+        align="center"
+        label="质保期限(月)">
+      </el-table-column>
+      <el-table-column
+        fixed="right"
+        header-align="center"
+        align="center"
+        width="150"
+        label="操作">
+        <template slot-scope="scope">
+          <el-button type="text" size="small" @click="addTempHandle(scope.row.id)">模板生成</el-button>
+          <el-button type="text" size="small">上传附件</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      @size-change="sizeChangeHandle"
+      @current-change="currentChangeHandle"
+      :current-page="pageIndex"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="pageSize"
+      :total="totalPage"
+      layout="total, sizes, prev, pager, next, jumper">
+    </el-pagination>
+    <!-- 弹窗, 新增 / 修改 -->
+    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
+    <temp-add v-if="tempVisible" ref="tempAdd"></temp-add>
+  </div>
+</template>
+
+<script>
+import AddOrUpdate from './contract-add-or-update'
+import TempAdd from './temp-add'
+import { getLodop } from '@/utils/lodop/LodopFuncs'
+export default {
+  components: {
+    AddOrUpdate,
+    TempAdd
+  },
+  data () {
+    return {
+      dataForm: {
+        type: '',
+        number: '',
+        name: ''
+      },
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      addOrUpdateVisible: false,
+      tempVisible: false
+    }
+  },
+  activated () {
+    this.getDataList()
+  },
+  methods: {
+    // 获取数据列表
+    getDataList () {
+      this.dataListLoading = true
+      this.$http({
+        url: this.$http.adornUrl('/sys/role/list'),
+        method: 'get',
+        params: this.$http.adornParams({
+          'page': this.pageIndex,
+          'limit': this.pageSize,
+          'roleName': this.dataForm.roleName
+        })
+      }).then(({data}) => {
+        if (data && data.code === 0) {
+          this.dataList = data.page.list
+          this.totalPage = data.page.totalCount
+        } else {
+          this.dataList = []
+          this.totalPage = 0
+        }
+        this.dataListLoading = false
+      })
+    },
+    // 每页数
+    sizeChangeHandle (val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.getDataList()
+    },
+    // 当前页
+    currentChangeHandle (val) {
+      this.pageIndex = val
+      this.getDataList()
+    },
+    // 多选
+    selectionChangeHandle (val) {
+      this.dataListSelections = val
+    },
+    // 新增
+    addOrUpdateHandle (id) {
+      this.addOrUpdateVisible = true
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id)
+      })
+    },
+    // 打印
+    addAndPrint () {
+      const LODOP = getLodop()
+      LODOP.SET_SHOW_MODE('HIDE_DISBUTTIN_SETUP', 1)// 隐藏那些无效按钮
+      // 打印纸张大小设置https://www.it610.com/article/2094844.html
+      LODOP.SET_PRINT_PAGESIZE(1, '60mm', '40mm', '1')
+      // LODOP.ADD_PRINT_RECT('0mm', '0mm', '50mm', '30mm', 0, 1)
+      LODOP.ADD_PRINT_BARCODE('4.3mm', '8mm', '50mm', '30mm', '128Auto', {a: 1})
+      LODOP.PREVIEW()// 预览
+      // LODOP.PRINT()// 打印
+    },
+    // 删除
+    deleteHandle (id) {
+      var ids = id ? [id] : this.dataListSelections.map(item => {
+        return item.roleId
+      })
+      this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$http({
+          url: this.$http.adornUrl('/sys/role/delete'),
+          method: 'post',
+          data: this.$http.adornData(ids, false)
+        }).then(({data}) => {
+          if (data && data.code === 0) {
+            this.$message({
+              message: '操作成功',
+              type: 'success',
+              duration: 1500,
+              onClose: () => {
+                this.getDataList()
+              }
+            })
+          } else {
+            this.$message.error(data.msg)
+          }
+        })
+      }).catch(() => {})
+    },
+    // 生成模板
+    addTempHandle (id) {
+      this.tempVisible = true
+      this.$nextTick(() => {
+        this.$refs.tempAdd.init(id)
+      })
+    }
+  }
+}
+</script>

base-vue/src/views/modules/contract/temp-add.vue

@@ -3,94 +3,92 @@
   title="产品供应合同"
   :close-on-click-modal="false"
   :visible.sync="visible">
-    <section class="content">
-      <el-descriptions :column="2">
-        <el-descriptions-item label="需方">kooriookami</el-descriptions-item>
-        <el-descriptions-item label="合同编号">18100000000</el-descriptions-item>
-        <el-descriptions-item label="供方">上海诺力智能科技有限公司</el-descriptions-item>
-        <el-descriptions-item label="签订时间">2025年1月14日</el-descriptions-item>
-      </el-descriptions>
-      <h2>一、产品明细单</h2>
-      <el-table
-      :data="dataList"
-      border
-      style="width: 100%;">
-        <el-table-column
-          type="index"
-          width="50"/>
-        <el-table-column
-          prop="materialCode"
-          header-align="center"
-          align="center"
-          label="物料编号"/>
-        <el-table-column
-          prop="materialName"
-          header-align="center"
-          align="center"
-          label="物料名称"/>
-        <el-table-column
-          prop="materialName"
-          header-align="center"
-          align="center"
-          label="型号"/>
-        <el-table-column
-          prop="materialName"
-          header-align="center"
-          align="center"
-          label="数量"/>
-        <el-table-column
-          prop="materialName"
-          header-align="center"
-          align="center"
-          label="单位"/>
-        <el-table-column
-          prop="materialName"
-          header-align="center"
-          align="center"
-          label="单价（元）"/>
-        <el-table-column
-          prop="materialName"
-          header-align="center"
-          align="center"
-          label="总价（元）"/>
-        <el-table-column
-          prop="materialName"
-          header-align="center"
-          align="center"
-          label="备注"/>
-      </el-table>
-      <el-row>
-        <el-col :span="12">共计人民币金额：（大写） XXXXXXX</el-col>
-        <el-col :span="12">含13%增值税</el-col>
-      </el-row>
-      <p class="tip_p">二、质量要求、技术标准、供方对质量负责的条件和期限:技术标准符合行业标准。</p>
-      <p class="tip_p">三、售后服务:保修期6个月，人为造成的损坏不在质保范围内。</p>
-      <p class="tip_p">四、交货时间、地点:货期:待定;交货地:待客户通知。</p>
-      <p class="tip_p">五、运输方式及到达站和费用负担:由供方负担。</p>
-      <p class="tip_p">六、包装标准:按国内标准包装。</p>
-      <p class="tip_p">八、结算方式:款到发货，付款方式:电汇。</p>
-      <p class="tip_p">八、违约责任:按《中华人民共和国民法典》执行。</p>
-      <p class="tip_p">九、解决合同纠纷的方式:买卖双方首先友好协商解决，协商不成，任何一方均可向有管辖权法院起诉。</p>
-      <p class="tip_p">十、其它约定事项:合同扫描件有效，签字盖章之日起生效。</p>
-      <el-descriptions direction="vertical" :column="2" border>
-        <el-descriptions-item label="需方">
-          <div>单位名称:</div>
-          <div>地址:</div>
-          <div>委托代理电话:</div>
-          <div>传真:</div>
-          <div>开户银行:</div>
-          <div>帐号:</div>
-        </el-descriptions-item>
-        <el-descriptions-item label="供方">
-          <div>单位名称:上海诺力智能科技有限公司(盖章)</div>
-          <div>地址:上海青浦区徐泾镇高光路215弄99号4号楼302室</div>
-          <div>委托代理电话:</div>
-          <div>传真:</div>
-          <div>开户银行:招商银行虹桥支行</div>
-          <div>帐号:12191702501091</div>
-        </el-descriptions-item>
-      </el-descriptions>
-    </section>
+    <el-descriptions :column="2">
+      <el-descriptions-item label="需方">kooriookami</el-descriptions-item>
+      <el-descriptions-item label="合同编号">18100000000</el-descriptions-item>
+      <el-descriptions-item label="供方">上海诺力智能科技有限公司</el-descriptions-item>
+      <el-descriptions-item label="签订时间">2025年1月14日</el-descriptions-item>
+    </el-descriptions>
+    <h2>一、产品明细单</h2>
+    <el-table
+    :data="dataList"
+    border
+    style="width: 100%;">
+      <el-table-column
+        type="index"
+        width="50"/>
+      <el-table-column
+        prop="materialCode"
+        header-align="center"
+        align="center"
+        label="物料编号"/>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="物料名称"/>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="型号"/>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="数量"/>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="单位"/>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="单价（元）"/>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="总价（元）"/>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="备注"/>
+    </el-table>
+    <el-row>
+      <el-col :span="12">共计人民币金额：（大写） XXXXXXX</el-col>
+      <el-col :span="12">含13%增值税</el-col>
+    </el-row>
+    <p class="tip_p">二、质量要求、技术标准、供方对质量负责的条件和期限:技术标准符合行业标准。</p>
+    <p class="tip_p">三、售后服务:保修期6个月，人为造成的损坏不在质保范围内。</p>
+    <p class="tip_p">四、交货时间、地点:货期:待定;交货地:待客户通知。</p>
+    <p class="tip_p">五、运输方式及到达站和费用负担:由供方负担。</p>
+    <p class="tip_p">六、包装标准:按国内标准包装。</p>
+    <p class="tip_p">八、结算方式:款到发货，付款方式:电汇。</p>
+    <p class="tip_p">八、违约责任:按《中华人民共和国民法典》执行。</p>
+    <p class="tip_p">九、解决合同纠纷的方式:买卖双方首先友好协商解决，协商不成，任何一方均可向有管辖权法院起诉。</p>
+    <p class="tip_p">十、其它约定事项:合同扫描件有效，签字盖章之日起生效。</p>
+    <el-descriptions direction="vertical" :column="2" border>
+      <el-descriptions-item label="需方" label-class-name="my-label">
+        <div>单位名称:</div>
+        <div>地址:</div>
+        <div>委托代理电话:</div>
+        <div>传真:</div>
+        <div>开户银行:</div>
+        <div>帐号:</div>
+      </el-descriptions-item>
+      <el-descriptions-item label="供方" label-class-name="my-label">
+        <div>单位名称:上海诺力智能科技有限公司(盖章)</div>
+        <div>地址:上海青浦区徐泾镇高光路215弄99号4号楼302室</div>
+        <div>委托代理电话:</div>
+        <div>传真:</div>
+        <div>开户银行:招商银行虹桥支行</div>
+        <div>帐号:12191702501091</div>
+      </el-descriptions-item>
+    </el-descriptions>
     <span slot="footer" class="dialog-footer">
       <el-button @click="visible = false">取消</el-button>
       <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
@@ -114,4 +112,11 @@ export default {
     dataFormSubmit () {}
   }
 }
-</script>
+</script>
+
+<style scoped>
+>>>.my-label {
+  width: 50%;
+  background: #fff;
+}
+</style>