合同

base-vue/src/utils/lodop/LodopFuncs.js

@@ -5,11 +5,11 @@ var head = document.head || document.getElementsByTagName('head')[0] || document
 var oscript = document.createElement('script')
 // 让本机的浏览器打印(更优先一点)：
 oscript = document.createElement('script')
-oscript.src = 'http://192.168.10.30:8000/CLodopfuncs.js?priority=2'
+oscript.src = 'http://localhost:8000/CLodopfuncs.js?priority=2'
 head.insertBefore(oscript, head.firstChild)
 // 加载双端口(8000和18000）避免其中某个端口被占用：
 oscript = document.createElement('script')
-oscript.src = 'http://192.168.10.30:18000/CLodopfuncs.js?priority=1'
+oscript.src = 'http://localhost:18000/CLodopfuncs.js?priority=1'
 head.insertBefore(oscript, head.firstChild)
 
 // 下载loadLodop

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

@@ -3,39 +3,230 @@
     :title="!dataForm.contractId ? '新增' : '修改'"
     :close-on-click-modal="false"
     :visible.sync="visible">
-    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
+    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="100px" size="mini" label-position="left">
+      <el-row type="flex" justify="space-between">
+        <el-col :span="11">
           <el-form-item label="合同类型" prop="contractType">
-      <el-input v-model="dataForm.contractType" placeholder="合同类型"></el-input>
+            <el-select v-model="dataForm.contractType" placeholder="合同类型" style="width: 100%;">
-    </el-form-item>
+              <el-option
-    <el-form-item label="是否是主合同" prop="isMaster">
+                v-for="item in contractTypeOpt"
-      <el-input v-model="dataForm.isMaster" placeholder="是否是主合同"></el-input>
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
           </el-form-item>
+        </el-col>
+        <el-col :span="11">
           <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-col>
-      <el-input v-model="dataForm.clientId" placeholder="客户id"></el-input>
+      </el-row>
+      <el-form-item label="是否是主合同" prop="isMaster">
+        <el-switch
+          v-model="dataForm.isMaster"
+          active-color="#409EFF"
+          inactive-color="#F56C6C"
+          :active-value="1"
+          :inactive-value="0"
+        />
       </el-form-item>
-    <el-form-item label="物料信息" prop="materialJson">
+      <el-row type="flex" justify="space-between">
-      <el-input v-model="dataForm.materialJson" placeholder="物料信息"></el-input>
+        <el-col :span="11">
+          <el-form-item label="客户" prop="clientId">
+            <el-select v-model="dataForm.clientId" placeholder="客户" style="width: 100%;">
+              <el-option
+                v-for="item in clientIdOpt"
+                :key="item.clientId"
+                :label="item.clientName"
+                :value="item.clientId">
+              </el-option>
+            </el-select>
           </el-form-item>
+        </el-col>
+        <el-col :span="11">
           <el-form-item label="是否验收" prop="isAcceptance">
-      <el-input v-model="dataForm.isAcceptance" placeholder="是否验收"></el-input>
+            <el-switch
-    </el-form-item>
+              v-model="dataForm.isAcceptance"
-    <el-form-item label="创建日期" prop="createTime">
+              active-color="#409EFF"
-      <el-input v-model="dataForm.createTime" placeholder="创建日期"></el-input>
+              inactive-color="#F56C6C"
-    </el-form-item>
+              :active-value="1"
-    <el-form-item label="创建日期" prop="acceptanceTime">
+              :inactive-value="0"
-      <el-input v-model="dataForm.acceptanceTime" placeholder="创建日期"></el-input>
+            />
           </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="11">
           <el-form-item label="备注" prop="remarks">
             <el-input v-model="dataForm.remarks" placeholder="备注"></el-input>
           </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between">
+        <el-col :span="11">
+          <el-button size="mini" type="primary" @click="addMaterial">选择物料</el-button>
+        </el-col>
+        <el-col :span="11">
+          <el-form-item label="总计">
+            <el-input v-model="dataForm.code" placeholder="总计"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    <!-- <el-form-item label="物料信息" prop="materialJson">
+      <el-input v-model="dataForm.materialJson" placeholder="物料信息"></el-input>
+    </el-form-item> -->
     </el-form>
+    <el-table
+      :data="materData"
+      border
+      size="mini"
+      max-height="200"
+      style="width: 100%;">
+      <el-table-column
+        prop="materialCode"
+        header-align="center"
+        align="center"
+        label="物料编码">
+      </el-table-column>
+      <el-table-column
+        prop="materialName"
+        header-align="center"
+        align="center"
+        label="物料名称">
+      </el-table-column>
+      <el-table-column
+        prop="materialType"
+        header-align="center"
+        align="center"
+        label="物料类型">
+      </el-table-column>
+      <el-table-column
+        prop="isOn"
+        header-align="center"
+        align="center"
+        label="单价">
+      </el-table-column>
+      <el-table-column
+        prop="createTime"
+        header-align="center"
+        align="center"
+        label="价格系数">
+      </el-table-column>
+      <el-table-column
+        prop="createTime"
+        header-align="center"
+        align="center"
+        label="对外价格">
+      </el-table-column>
+      <el-table-column
+        header-align="center"
+        align="center"
+        width="120"
+        label="数量">
+        <template slot-scope="scope">
+          <el-input size="mini" v-model="scope.row.num"></el-input>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="createTime"
+        header-align="center"
+        align="center"
+        label="总价">
+      </el-table-column>
+      <el-table-column
+        fixed="right"
+        header-align="center"
+        align="center"
+        width="80"
+        label="操作">
+        <template slot-scope="scope">
+          <el-button type="text" size="small" @click="deleteHandle(scope.$index)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
     <span slot="footer" class="dialog-footer">
-      <el-button @click="visible = false">取消</el-button>
+      <el-button size="mini" @click="visible = false">取消</el-button>
-      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+      <el-button size="mini" type="primary" @click="dataFormSubmit()">确定</el-button>
     </span>
+    <el-dialog
+      title="选择物料"
+      :visible.sync="innerVisible"
+      append-to-body>
+        <el-form size="mini" :inline="true" :model="innerDataForm" @keyup.enter.native="getDataList()">
+          <el-form-item>
+            <el-input v-model="innerDataForm.key" placeholder="参数名" clearable></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="getDataList()">查询</el-button>
+          </el-form-item>
+        </el-form>
+        <el-table
+          :data="dataList"
+          border
+          size="mini"
+          max-height="400"
+          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="materialId"
+            header-align="center"
+            align="center"
+            label="id">
+          </el-table-column>
+          <el-table-column
+            prop="materialCode"
+            header-align="center"
+            align="center"
+            label="物料编码">
+          </el-table-column>
+          <el-table-column
+            prop="materialName"
+            header-align="center"
+            align="center"
+            label="物料名称">
+          </el-table-column>
+          <el-table-column
+            prop="materialType"
+            header-align="center"
+            align="center"
+            label="物料类型">
+          </el-table-column>
+          <el-table-column
+            prop="isOn"
+            header-align="center"
+            align="center"
+            label="是否启用">
+          </el-table-column>
+          <el-table-column
+            prop="createTime"
+            header-align="center"
+            align="center"
+            label="创建时间">
+          </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>
+        <span slot="footer" class="dialog-footer">
+          <el-button size="mini" @click="innerVisible = false">取消</el-button>
+          <el-button size="mini" type="primary" @click="innerSubmit">确定</el-button>
+        </span>
+    </el-dialog>
   </el-dialog>
 </template>
 
@@ -44,50 +235,63 @@
     data () {
       return {
         visible: false,
+        innerVisible: false,
+        contractTypeOpt: [],
+        clientIdOpt: [],
         dataForm: {
           contractId: 0,
           contractType: '',
-          isMaster: '',
+          isMaster: 0,
           contractNumber: '',
           clientId: '',
           materialJson: '',
-          isAcceptance: '',
+          isAcceptance: 0,
-          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' }
+            { required: true, message: '客户不能为空', 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' }
           ]
-        }
+        },
+        innerDataForm: {
+          key: ''
+        },
+        dataList: [],
+        pageIndex: 1,
+        pageSize: 10,
+        totalPage: 0,
+        dataListLoading: false,
+        dataListSelections: [],
+        materData: [{materialName: 'aaa'}]
       }
     },
+    created () {
+      this.getDictDetail()
+    },
     methods: {
+      getDictDetail () {
+        this.$http({
+          url: this.$http.adornUrl('/api/dict/dictDetail?code=contract_type&page=0&size=9999'),
+          method: 'get'
+        }).then(({data}) => {
+          this.contractTypeOpt = [...data.content]
+        })
+        this.$http({
+          url: this.$http.adornUrl('/client/client/list?page=0&limit=9999'),
+          method: 'get'
+        }).then(({data}) => {
+          this.clientIdOpt = data.page.list
+        })
+      },
       init (id) {
         this.dataForm.contractId = id || 0
         this.visible = true
@@ -106,14 +310,16 @@
                 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
               }
             })
           }
         })
       },
+      addMaterial () {
+        this.innerVisible = true
+        this.getDataList()
+      },
       // 表单提交
       dataFormSubmit () {
         this.$refs['dataForm'].validate((valid) => {
@@ -129,8 +335,6 @@
                 '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}) => {
@@ -150,7 +354,58 @@
             })
           }
         })
+      },
+      // 获取数据列表
+      getDataList () {
+        this.dataListLoading = true
+        this.$http({
+          url: this.$http.adornUrl('/material/material/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
+        })
+      },
+      // 每页数
+      sizeChangeHandle (val) {
+        this.pageSize = val
+        this.pageIndex = 1
+        this.getDataList()
+      },
+      // 当前页
+      currentChangeHandle (val) {
+        this.pageIndex = val
+        this.getDataList()
+      },
+      // 多选
+      selectionChangeHandle (val) {
+        this.dataListSelections = val
+      },
+      innerSubmit () {
+        this.innerVisible = false
+        this.materData = [...this.materData, ...this.dataListSelections]
+      },
+      deleteHandle(index) {
+        this.materData.splice(index, 1)
       }
     }
   }
 </script>
+
+<style scoped>
+.el-pagination {
+  margin-top: 15px;
+  text-align: right;
+}
+</style>

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

@@ -1,6 +1,6 @@
 <template>
   <div class="mod-config">
-    <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+    <el-form size="mini" :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
       <el-form-item>
         <el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
       </el-form-item>
@@ -8,13 +8,13 @@
         <el-button @click="getDataList()">查询</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-button type="primary" @click="addAndPrint">打印</el-button>
         <el-button type="primary" @click="addTempHandle">模板生成</el-button>
       </el-form-item>
     </el-form>
     <el-table
       :data="dataList"
       border
+      size="mini"
       v-loading="dataListLoading"
       @selection-change="selectionChangeHandle"
       style="width: 100%;">
@@ -114,7 +114,6 @@
 <script>
   import AddOrUpdate from './contract-add-or-update'
   import TempAddOrUpdate from './temp-add-or-update'
-  import { getLodop } from '@/utils/lodop/LodopFuncs'
   export default {
     data () {
       return {
@@ -213,18 +212,6 @@
           })
         })
       },
-      // 打印
-      addAndPrint () {
-        const LODOP = getLodop()
-        LODOP.SET_SHOW_MODE('HIDE_DISBUTTIN_SETUP', 1)// 隐藏那些无效按钮
-        // 设置纸张大小为 A4
-        LODOP.SET_PRINT_PAGESIZE(1, 0, 0, "A4")
-        // 获取弹窗内容并转换为 HTML 字符串
-        const popupContent = this.$refs.tempAdd.innerHTML
-        // 添加弹窗内容到打印任务
-        LODOP.ADD_PRINT_HTM(0, 0, "100%", "100%", popupContent)
-        LODOP.PREVIEW()// 预览
-      },
       // 生成模板
       addTempHandle (id) {
         this.tempVisible = true

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

@@ -4,6 +4,7 @@
   :close-on-click-modal="false"
   :visible.sync="visible">
   <div class="dialog_content" id="popupContent">
+    <div style="width: 100%;">
       <div class="zd-row">
         <div class="zd-col-12 item_p">需方：kooriookami</div>
         <div class="zd-col-12 item_p">合同编号：18100000000</div>
@@ -15,8 +16,8 @@
       <p class="tip_p">一、产品明细单</p>
       <table class="det_table">
         <tr>
-        <th width="20%">物料编号</th>
+          <th width="18%">物料编号</th>
-        <th width="20%">物料名称</th>
+          <th width="18%">物料名称</th>
           <th width="10%">型号</th>
           <th width="10%">数量</th>
           <th width="10%">单位</th>
@@ -48,7 +49,7 @@
       <p class="tip_p">八、违约责任:按《中华人民共和国民法典》执行。</p>
       <p class="tip_p">九、解决合同纠纷的方式:买卖双方首先友好协商解决，协商不成，任何一方均可向有管辖权法院起诉。</p>
       <p class="tip_p">十、其它约定事项:合同扫描件有效，签字盖章之日起生效。</p>
-    <table class="det_table">
+      <table class="det_table det_table_1">
         <tr>
           <th width="50%">需方：</th>
           <th width="50%">供方：</th>
@@ -73,6 +74,7 @@
         </tr>
       </table>
     </div>
+  </div>
     <span slot="footer" class="dialog-footer">
       <el-button @click="visible = false">取消</el-button>
       <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
@@ -99,7 +101,7 @@ export default {
     // 打印
     addAndPrint () {
       const LODOP = getLodop()
-      LODOP.PRINT_INITA("0mm", "0mm", "210mm", "297mm", "打印合同模板")
+      LODOP.PRINT_INITA("0mm", "0mm", "213mm", "297mm", "打印合同模板")
       LODOP.SET_PRINT_PAGESIZE(1, 0, 0, "A4")
       LODOP.ADD_PRINT_TEXT(0, 0, 700, 50, "产品供应合同")
       // 获取弹窗内容并转换为 HTML 字符串
@@ -109,13 +111,16 @@ export default {
           .zd-row {width: 100%;display: flex;}
           .zd-col-12 {width: 50%;}
           .dialog_content {width: 100%;}
+          .item_p {font-size: 14px;line-height: 1.5;padding-bottom: 12px;}
+          .tip_p {font-size: 14px;font-weight: 700;line-height: 1.5;margin: 0;}
           .det_table {width: 100%; border-collapse: collapse;border: 1px solid #000;}
-          .det_table th, .det_table td {border: 1px solid #000;font-size: 10px; line-height: 23px; padding: 0;}
+          .det_table th, .det_table td {border: 1px solid #000;font-size: 10px; line-height: 23px; padding: 0; text-align: center}
+          .det_table_1 th, .det_table_1 td {text-align:left}
         </style>
         ${popupContent}
       `
       // 添加弹窗内容到打印任务
-      LODOP.ADD_PRINT_HTM("0mm", "0mm", "RightMargin:0mm", "BottomMargin:0mm", printHtml)
+      LODOP.ADD_PRINT_HTM("30mm", "10mm", "RightMargin:10mm", "BottomMargin:10mm", printHtml)
       LODOP.PREVIEW()// 预览
     },
   }
@@ -140,10 +145,10 @@ export default {
   padding-bottom: 12px;
 }
 .tip_p {
-  font-size: 16px;
+  font-size: 14px;
   font-weight: 700;
   color: #606266;
-  line-height: 1.8;
+  line-height: 1.5;
   margin: 0;
 }
 .num_p {
@@ -158,19 +163,23 @@ export default {
   margin-top: 10px;
 }
 .det_table th {
-  font-size: 14px;
+  font-size: 12px;
   line-height: 23px;
   color: #909399;
+  padding: 4px;
   font-weight: 700;
   border: 1px solid #EBEEF5;
   text-align: center;
 }
 .det_table td {
-  font-size: 14px;
+  font-size: 13px;
   line-height: 23px;
   color: #606266;
-  padding: 12px 0;
+  padding: 4px;
   border: 1px solid #EBEEF5;
   text-align: center;
 }
+.det_table_1 th, .det_table_1 td {
+  text-align: left;
+}
 </style>