服务指令：增加预览图片、即时指令图片项

服务指令包：调整样式

src/views/services/directivePackage/DirectivePackageList.vue

@@ -24,19 +24,21 @@
         </a-row>
       </a-form>
     </div>
-    <div style="background-color: #000;padding: 20px;">
-      <a-card :title="directive.packageName" :key="directive.id" :bordered="false" style="width: 300px;margin: 10px;"
-        v-for="directive of tableData.records">
-        <div>{{ directive.description }}</div>
-        <div>{{ directive.createTime }} - {{ directive.createBy }}</div>
-        <div>
-          <a type="primary" @click="packageEdit(directive)" style="margin-right: 8px">编辑</a>
-          <a-popconfirm title="是否确认删除？" ok-text="确认" cancel-text="取消" @confirm="remove(directive)">
-            <a href="#">删除</a>
-          </a-popconfirm>
-        </div>
-      </a-card>
-    </div>
+    <a-row>
+      <a-col :span="8" v-for="directive of tableData.records" :key="directive.id">
+        <a-card :title="directive.packageName" :bordered="false" style="margin: 5px;">
+          <div>{{ directive.description }}</div>
+          <div>{{ directive.createTime }} - {{ directive.createBy }}</div>
+          <template #actions>
+            <a-button type="link" @click="packageEdit(directive)" preIcon="tabler:settings"></a-button>
+            <a-popconfirm title="是否确认删除？" ok-text="确认" cancel-text="取消" @confirm="remove(directive)">
+              <a-button type="link" danger preIcon="ant-design:delete-twotone"></a-button>
+            </a-popconfirm>
+          </template>
+        </a-card>
+      </a-col>
+    </a-row>
+
   </div>
   <!-- 表单区域 -->
   <DirectivePackageModal ref="registerModal" @success="handleSuccess"></DirectivePackageModal>

src/views/services/directivePackage/components/DirectivePackageModal.vue

@@ -11,21 +11,29 @@
           </DirectivePackageForm>
         </a-card>
       </div>
-      <div>
-        <a-card title="服务指令" style="width: 27vw">
-          <template #extra>
-            <a href="#" @click="handleQuoteDirectives">引用 </a>
-            <a href="#" @click="handleAddDirectives">新增</a>
-          </template>
-          <div style="padding:10px;margin-top:10px;border:1px solid red;" v-for="directive of seletedRecord.directives"
-            :class="{ 'selected': selectedDirective === directive.id }" @click="directiveInfo(directive)">
-            {{ directive.directiveName + handleTags('（', directive, '）') }}
-            <div style="float:right;">
-              <a href="#" @click="deleteDirective(directive.id)">移除</a>
-            </div>
-          </div>
-        </a-card>
-      </div>
+      <a-card title="服务指令" style="width: 27vw">
+        <template #extra>
+          <a href="#" @click="handleQuoteDirectives">引用 </a>
+          <a href="#" @click="handleAddDirectives">新增</a>
+        </template>
+        <div class="scrollable-content">
+          <a-row>
+            <a-col :span="11" v-for="directive of seletedRecord.directives" :key="directive.id" style="margin: 5px;"
+              @click="directiveInfo(directive)">
+              <a-card>
+                <span :class="{ 'selected': selectedDirective === directive.id }">
+                  {{ directive.directiveName + handleTags('（', directive, '）') }}
+                </span>
+                <template #actions>
+                  <a-popconfirm title="是否确认移除？" ok-text="确认" cancel-text="取消" @confirm="deleteDirective(directive.id)">
+                    <a-button type="link" danger preIcon="ic:baseline-remove-circle"></a-button>
+                  </a-popconfirm>
+                </template>
+              </a-card>
+            </a-col>
+          </a-row>
+        </div>
+      </a-card>
       <div>
         <a-card title="服务指令详情" style="width: 27vw">
           <div class="">分类标签：{{ filterDictTextByCache('instruction_tag', derectiveInfo.instructionTagId) }}</div>
@@ -113,7 +121,7 @@ function handleTags(prefix, directive_, suffix) {
     let str = directive_.tagList.map(item => item.tagName).join('、 ');
     return prefix + str + suffix
   } else {
-    return ' - '
+    return ''
   }
 }
 
@@ -264,10 +272,21 @@ defineExpose({
 </style>
 <style lang="less" scoped>
 .selected {
-  background-color: lightgreen;
+  color: rgb(0, 156, 0);
+  font-weight: bold;
 }
 
 .directiveInfoClass {
   margin-top: 10px;
 }
+
+.scrollable-content {
+  height: 70vh;
+  /* 设置固定高度为视口的50% */
+  overflow-y: auto;
+  /* 垂直方向超出时显示滚动条 */
+  padding-right: 8px;
+  /* 防止滚动条遮挡内容 */
+}
+
 </style>

src/views/services/serviceDirective/ConfigServiceDirective.data.ts

@@ -45,13 +45,13 @@ export const columns: BasicColumn[] = [
     title: '指令标签',
     align: 'center',
     dataIndex: 'tagList',
-    width:150,
+    width: 150,
     ellipsis: false,
     format(text, record, index) {
-      if(!!text){
-        return text.map(item => item.tagName).join('、');
-      }else{
-        return '-'
+      if (!!text) {
+        return text.map((item) => item.tagName).join('、');
+      } else {
+        return '-';
       }
     },
   },
@@ -63,8 +63,8 @@ export const columns: BasicColumn[] = [
   },
   {
     title: '提成价格',
-    align: "center",
-    dataIndex: 'comPrice'
+    align: 'center',
+    dataIndex: 'comPrice',
   },
   {
     title: '医保报销',
@@ -113,12 +113,12 @@ export const columns: BasicColumn[] = [
   },
   {
     title: '语音文件',
-    align: "center",
+    align: 'center',
     dataIndex: 'mp3File',
   },
   {
     title: '视频文件',
-    align: "center",
+    align: 'center',
     dataIndex: 'mp4File',
   },
   // {
@@ -143,6 +143,18 @@ export const columns: BasicColumn[] = [
   //   sorter: true,
   //   dataIndex: 'updateTime'
   // },
+  {
+    title: '预览图片',
+    align: 'center',
+    dataIndex: 'previewFile',
+    customRender: render.renderImage,
+  },
+  {
+    title: '即时指令图片',
+    align: 'center',
+    dataIndex: 'immediateFile',
+    customRender: render.renderImage,
+  },
 ];
 
 // 高级查询数据

src/views/services/serviceDirective/components/ConfigServiceDirectiveForm.vue

@@ -136,17 +136,29 @@
               </a-form-item>
             </a-col> -->
           </a-row>
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="预览图片" v-bind="validateInfos.previewFile">
+                <JImageUpload :fileMax="1" v-model:value="formData.previewFile"></JImageUpload>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="即时指令图片" v-bind="validateInfos.immediateFile">
+                <JImageUpload :fileMax="1" v-model:value="formData.immediateFile"></JImageUpload>
+              </a-form-item>
+            </a-col>
+          </a-row>
           <a-row>
             <a-col :span="12">
               <a-form-item label="语音文件" v-bind="validateInfos.mp3File" id="ConfigServiceDirectiveForm-mp3File"
                 name="mp3File">
-                <j-upload v-model:value="formData.mp3File" accept=".mp3" :maxCount="1"></j-upload>
+                <j-upload v-model:value="formData.mp3File" accept=".mp3" :disabled="true" :maxCount="1" ></j-upload>
               </a-form-item>
             </a-col>
             <a-col :span="12">
               <a-form-item label="视频文件" v-bind="validateInfos.mp4File" id="ConfigServiceDirectiveForm-mp4File"
                 name="mp4File">
-                <j-upload v-model:value="formData.mp4File" accept=".mp4" :maxCount="1"></j-upload>
+                <j-upload v-model:value="formData.mp4File" accept=".mp4" :disabled="true" :maxCount="1"></j-upload>
               </a-form-item>
             </a-col>
           </a-row>
@@ -186,11 +198,13 @@ import { useMessage } from '/@/hooks/web/useMessage';
 import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
 import { JCheckbox } from '/@/components/Form';
 import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
+import JImageUpload from '/@/components/Form/src/jeecg/components/JImageUpload.vue';
 import { getValueType } from '/@/utils';
 import { saveOrUpdate } from '../ConfigServiceDirective.api';
 import { Form } from 'ant-design-vue';
 import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
 import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
+
 const props = defineProps({
   formDisabled: { type: Boolean, default: false },
   formData: { type: Object, default: () => ({}) },
@@ -221,6 +235,8 @@ const formData = reactive<Record<string, any>>({
   updateTime: '',
   mp3File: '',
   mp4File: '',
+  previewFile: '',
+  immediateFile: '',
 });
 const { createMessage } = useMessage();
 const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 6 } });
@@ -350,7 +366,7 @@ async function submitForm() {
   }
 
   //提成价格不能高于收费价格
-  if (model.tollPrice <= model.comPrice) {
+  if (model.comPrice != 0 && model.tollPrice <= model.comPrice) {
     createMessage.warning('提成价格不能高于收费价格！');
     confirmLoading.value = false;
     retrun;