feat: 更新签署合同弹窗样式，添加合同信息表格，提升用户体验

src/assets/css/public/contract.css

+.sign-contract-content {
+  color: #000;
+}
+.sign-contract-content .title h2 {
+  font-size: 30px;
+  font-weight: bold;
+  color: #000;
+}
+.sign-contract-content .title h4 {
+  font-size: 20px;
+  font-weight: bold;
+  color: #000;
+}
+.sign-contract-content .sign-table {
+  border-collapse: collapse;
+  width: 100%;
+}
+.sign-contract-content .sign-table tr th {
+  padding: 7px;
+  text-align: center;
+  border: 1px solid #000;
+  font-size: 13px;
+  font-weight: bold;
+}
+.sign-contract-content .sign-table tr td {
+  padding: 8px;
+  text-align: center;
+  border: 1px solid #000;
+  font-size: 13px;
+  white-space: normal;
+  word-break: break-all;
+  word-wrap: break-word;
+  word-break: normal;
+}
+.sign-contract-content .sign-table tr td .letter {
+  letter-spacing: 6px;
+}
+.sign-contract-content .sign-table.norder tr td {
+  border: none;
+}
+.sign-contract-content .sign-table.sign-table-left tr td {
+  text-align: left;
+}

src/assets/css/public/contract.less

+.sign-contract-content {
+    color: #000;
+
+    .title {
+
+        h2 {
+            font-size: 30px;
+            font-weight: bold;
+            color: #000;
+        }
+
+        h4 {
+            font-size: 20px;
+            font-weight: bold;
+            color: #000;
+        }
+    }
+
+    .sign-table {
+        border-collapse: collapse;
+        width: 100%;
+
+        tr {
+            th {
+                padding: 7px;
+                text-align: center;
+                border: 1px solid #000;
+                font-size: 13px;
+                font-weight: bold;
+            }
+
+            td {
+                padding: 8px;
+                text-align: center;
+                border: 1px solid #000;
+                font-size: 13px;
+                white-space: normal;
+                word-break: break-all;
+                word-wrap: break-word;
+                word-break: normal;
+
+                .letter {
+                    letter-spacing: 6px;
+                }
+            }
+        }
+
+        &.norder {
+            tr {
+                td {
+                    border: none;
+                }
+            }
+        }
+
+        &.sign-table-left {
+            tr {
+                td {
+                    text-align: left;
+                }
+            }
+        }
+    }
+}
\ No newline at end of file

src/views/OrderTrack/goodsDetail.vue

@@ -110,9 +110,90 @@
     </div>
     </div>
 
 
     <!-- 签署合同弹窗 -->
     <!-- 签署合同弹窗 -->
-    <el-dialog title="签署合同" :visible.sync="signDialogVisible" width="80%" :before-close="closeSignDialog">
+    <el-dialog title="签署合同" :visible.sync="signDialogVisible" width="900px" :before-close="closeSignDialog">
       <div class="sign-contract-content">
       <div class="sign-contract-content">
-
+        <div class="title column rowCenter verCenter">
+          <h2>深圳市猎芯科技有限公司</h2>
+          <h4>采购合同</h4>
+        </div>
+        <table class="sign-table norder sign-table-left">
+          <tr>
+            <td>
+              <span class="label letter">编号：</span>
+              <span class="value-text">PO-TESTPO-SZ202201210004</span>
+            </td>
+            <td>
+              <span class="label letter">日期：</span>
+              <span class="value-text">2022-01-21</span>
+            </td>
+          </tr>
+          <tr>
+            <td>
+              <span class="label letter">甲方：</span>
+              <span class="value-text">深圳市猎芯科技有限公司</span>
+            </td>
+            <td>
+              <span class="label letter">乙方：</span>
+              <span class="value-text">猎芯网自营库存</span>
+            </td>
+          </tr>
+          <tr>
+            <td>
+              <span class="label">联系人：</span>
+              <span class="value-text">&nbsp;测试采购员</span>
+            </td>
+            <td>
+              <span class="label">联系人：</span>
+              <span class="value-text">&nbsp;厉飞雨</span>
+            </td>
+          </tr>
+          <tr>
+            <td>
+              <span class="label letter">地址：</span>
+              <span class="value-text">深圳市龙岗区坂田街道清丽路1号宝能科技园12栋11楼</span>
+            </td>
+            <td>
+              <span class="label letter">地址：</span>
+              <span class="value-text">广东深圳罗湖区玉龙新村文清路22号</span>
+            </td>
+          </tr>
+          <tr>
+            <td>
+              <span class="label letter">电话：</span>
+              <span class="value-text">86-755-82560956</span>
+            </td>
+            <td>
+              <span class="label letter">电话：</span>
+              <span class="value-text">180999999999</span>
+            </td>
+          </tr>
+        </table>
+        <table class="sign-table">
+          <tr>
+            <th>项次</th>
+            <th>物料名称</th>
+            <th>品牌</th>
+            <th>数量</th>
+            <th>批次</th>
+            <th>单价</th>
+            <th>金额</th>
+            <th>交货日期</th>
+            <th>入仓单号</th>
+            <th>备注</th>
+          </tr>
+          <tr>
+            <td>1</td>
+            <td>SLSD-71N200</td>
+            <td>LUNA OPTOELECTRONICS</td>
+            <td>50</td>
+            <td>666+</td>
+            <td>0.58978</td>
+            <td>100.00</td>
+            <td>2022-01-21</td>
+            <td>1234567890</td>
+            <td>备注</td>
+          </tr>
+        </table>
       </div>
       </div>
       <div slot="footer" class="dialog-footer">
       <div slot="footer" class="dialog-footer">
         <el-button @click="closeSignDialog">取消</el-button>
         <el-button @click="closeSignDialog">取消</el-button>
@@ -280,4 +361,5 @@ export default {
 </script>
 </script>
 <style scoped>
 <style scoped>
 @import "../../assets/css/goods/goods.min.css";
 @import "../../assets/css/goods/goods.min.css";
+@import "../../assets/css/public/contract.css";
 </style>
 </style>
\ No newline at end of file