feat(contract): 替换产品内容组件为订单详情组件并优化表单字段

重构合同预览和订单详情展示，使用新的OrderDetail组件替代原有的ProductContent组件
调整订单详情表单字段，增加宽度、厚度等必要字段，移除不必要字段
优化表单验证规则和显示逻辑

klp-ui/src/views/crm/contract/components/ContractPreview.vue

@@ -27,12 +27,12 @@
       
       <div style="margin-top: 20px;">
         <h4 style="margin-bottom: 10px; color: #606266;">一、产品内容</h4>
-        <ProductContent v-model="contract.productContent" readonly />
+        <OrderDetail :orderId="contract.orderId" :remark="contract.remark" readonly />
+        <!-- <ProductContent v-model="contract.productContent" readonly /> -->
         <!-- <div v-html="contract.productContent" style="border: 1px solid #e4e7ed; padding: 10px; border-radius: 4px;"></div> -->
       </div>
       
       <div>
-        <!-- <h4 style="margin-bottom: 10px; color: #606266;">合同内容</h4> -->
         <div v-html="contract.contractContent" style="border: 1px solid #e4e7ed; padding: 10px; border-radius: 4px;"></div>
       </div>
 
@@ -61,11 +61,13 @@
 
 <script>
 import ProductContent from './ProductContent.vue';
+import OrderDetail from './OrderDetail.vue';
 
 export default {
   name: "ContractPreview",
   components: {
-    ProductContent
+    ProductContent,
+    OrderDetail
   },
   props: {
     contract: {