|
@@ -8,20 +8,24 @@
|
|
|
</span>
|
|
</span>
|
|
|
</div>
|
|
</div>
|
|
|
<div style="margin-left: 31px;">
|
|
<div style="margin-left: 31px;">
|
|
|
- <el-checkbox-group v-model="form.answers[index].value" size="mini" :disabled="true">
|
|
|
|
|
- <el-checkbox v-for="dict in getSelectedOptions(answer)" :key="dict.value" :label="dict.value">
|
|
|
|
|
- {{ dict.name }}
|
|
|
|
|
- </el-checkbox>
|
|
|
|
|
- </el-checkbox-group>
|
|
|
|
|
|
|
+ <!-- 改为自定义渲染,以便显示备注 -->
|
|
|
|
|
+ <div v-for="(option, optIdx) in getSelectedOptionsWithRemarks(answer)" :key="optIdx"
|
|
|
|
|
+ style="margin-bottom: 8px;">
|
|
|
|
|
+ <el-checkbox :value="true" disabled>{{ option.name }}</el-checkbox>:
|
|
|
|
|
+ <span v-if="option.remarkText"
|
|
|
|
|
+ style="margin-left: 6px; display: inline-block; color: #606266; font-size: 13px; border-bottom: 1px dashed #dcdfe6; padding-bottom: 2px;">
|
|
|
|
|
+ {{ option.remarkText }}
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div>
|
|
|
|
|
|
|
+ <div v-if="form.allergy || form.remark">
|
|
|
<el-form-item label="过敏情况" prop="allergy">
|
|
<el-form-item label="过敏情况" prop="allergy">
|
|
|
- <el-input type="textarea" :rows="2" placeholder="请输入过敏情况" v-model="form.allergy">
|
|
|
|
|
|
|
+ <el-input type="textarea" :rows="2" placeholder="请输入过敏情况" v-model="form.allergy" disabled>
|
|
|
</el-input>
|
|
</el-input>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item label="备注" prop="remark">
|
|
<el-form-item label="备注" prop="remark">
|
|
|
- <el-input type="textarea" :rows="2" placeholder="请输入备注" v-model="form.remark">
|
|
|
|
|
|
|
+ <el-input type="textarea" :rows="2" placeholder="请输入备注" v-model="form.remark" disabled>
|
|
|
</el-input>
|
|
</el-input>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</div>
|
|
</div>
|
|
@@ -40,11 +44,11 @@ export default {
|
|
|
props: {
|
|
props: {
|
|
|
userId: {
|
|
userId: {
|
|
|
type: [String, Number],
|
|
type: [String, Number],
|
|
|
- default: null // 改为非必填,因为可能使用thirdPartyUserId
|
|
|
|
|
|
|
+ default: null
|
|
|
},
|
|
},
|
|
|
thirdPartyUserId: {
|
|
thirdPartyUserId: {
|
|
|
type: [String, Number],
|
|
type: [String, Number],
|
|
|
- default: null // 新增thirdPartyUserId属性
|
|
|
|
|
|
|
+ default: null
|
|
|
},
|
|
},
|
|
|
prescribeId: {
|
|
prescribeId: {
|
|
|
type: [String, Number],
|
|
type: [String, Number],
|
|
@@ -62,7 +66,6 @@ export default {
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
watch: {
|
|
watch: {
|
|
|
- // 监听userId变化
|
|
|
|
|
userId: {
|
|
userId: {
|
|
|
handler(newVal) {
|
|
handler(newVal) {
|
|
|
if (newVal) {
|
|
if (newVal) {
|
|
@@ -71,10 +74,8 @@ export default {
|
|
|
},
|
|
},
|
|
|
immediate: true
|
|
immediate: true
|
|
|
},
|
|
},
|
|
|
- // 监听thirdPartyUserId变化
|
|
|
|
|
thirdPartyUserId: {
|
|
thirdPartyUserId: {
|
|
|
handler(newVal) {
|
|
handler(newVal) {
|
|
|
- // 只有当userId不存在且thirdPartyUserId有值时,才使用thirdPartyUserId查询
|
|
|
|
|
if (!this.userId && newVal) {
|
|
if (!this.userId && newVal) {
|
|
|
this.fetchCollectionInfo();
|
|
this.fetchCollectionInfo();
|
|
|
}
|
|
}
|
|
@@ -83,18 +84,30 @@ export default {
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
|
- getSelectedOptions(answer) {
|
|
|
|
|
|
|
+ // 获取选中的选项,并附带备注信息
|
|
|
|
|
+ getSelectedOptionsWithRemarks(answer) {
|
|
|
if (!Array.isArray(answer.value) || !Array.isArray(answer.options)) {
|
|
if (!Array.isArray(answer.value) || !Array.isArray(answer.options)) {
|
|
|
return [];
|
|
return [];
|
|
|
}
|
|
}
|
|
|
const selectedValues = new Set(answer.value);
|
|
const selectedValues = new Set(answer.value);
|
|
|
- return answer.options.filter(option => selectedValues.has(option.value));
|
|
|
|
|
|
|
+ // 构建备注映射
|
|
|
|
|
+ const remarksMap = new Map();
|
|
|
|
|
+ if (Array.isArray(answer.remarksList)) {
|
|
|
|
|
+ answer.remarksList.forEach(remark => {
|
|
|
|
|
+ remarksMap.set(remark.value, remark.text);
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ // 过滤出选中的选项,并附加备注
|
|
|
|
|
+ return answer.options
|
|
|
|
|
+ .filter(option => selectedValues.has(option.value))
|
|
|
|
|
+ .map(option => ({
|
|
|
|
|
+ ...option,
|
|
|
|
|
+ remarkText: remarksMap.get(option.value) || ''
|
|
|
|
|
+ }));
|
|
|
},
|
|
},
|
|
|
|
|
|
|
|
fetchCollectionInfo() {
|
|
fetchCollectionInfo() {
|
|
|
- // 确定使用哪个ID进行查询
|
|
|
|
|
const queryId = this.userId || this.thirdPartyUserId;
|
|
const queryId = this.userId || this.thirdPartyUserId;
|
|
|
-
|
|
|
|
|
if (!queryId) {
|
|
if (!queryId) {
|
|
|
console.warn('没有可用的用户ID');
|
|
console.warn('没有可用的用户ID');
|
|
|
this.form.answers = [];
|
|
this.form.answers = [];
|
|
@@ -103,13 +116,10 @@ export default {
|
|
|
|
|
|
|
|
this.loading = true;
|
|
this.loading = true;
|
|
|
|
|
|
|
|
- // 根据ID类型选择不同的接口
|
|
|
|
|
let apiCall;
|
|
let apiCall;
|
|
|
if (this.userId) {
|
|
if (this.userId) {
|
|
|
- // 使用系统用户ID查询
|
|
|
|
|
apiCall = getCollectionByUserId(this.userId);
|
|
apiCall = getCollectionByUserId(this.userId);
|
|
|
} else {
|
|
} else {
|
|
|
- // 使用第三方用户ID查询,信息来源固定为2表示超拼网用户
|
|
|
|
|
apiCall = getCollectionByInfoSourceAndThirdPartyUserId(2, this.thirdPartyUserId);
|
|
apiCall = getCollectionByInfoSourceAndThirdPartyUserId(2, this.thirdPartyUserId);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -117,7 +127,6 @@ export default {
|
|
|
.then(res => {
|
|
.then(res => {
|
|
|
const data = res.data;
|
|
const data = res.data;
|
|
|
if (data) {
|
|
if (data) {
|
|
|
- // 赋值
|
|
|
|
|
this.form.answers = data.answers || [];
|
|
this.form.answers = data.answers || [];
|
|
|
this.form.allergy = data.allergy || '';
|
|
this.form.allergy = data.allergy || '';
|
|
|
this.form.remark = data.remark || '';
|
|
this.form.remark = data.remark || '';
|
|
@@ -139,17 +148,16 @@ export default {
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
<style scoped>
|
|
|
-.app-container>>>.el-checkbox.is-disabled .el-checkbox__input.is-checked .el-checkbox__inner {
|
|
|
|
|
|
|
+.app-container >>> .el-checkbox.is-disabled .el-checkbox__input.is-checked .el-checkbox__inner {
|
|
|
background-color: #409eff !important;
|
|
background-color: #409eff !important;
|
|
|
border-color: #409eff !important;
|
|
border-color: #409eff !important;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-.app-container>>>.el-checkbox.is-disabled .el-checkbox__input.is-checked .el-checkbox__inner::after {
|
|
|
|
|
|
|
+.app-container >>> .el-checkbox.is-disabled .el-checkbox__input.is-checked .el-checkbox__inner::after {
|
|
|
border-color: #fff !important;
|
|
border-color: #fff !important;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-/*让已选中禁用状态的文字也高亮为蓝色 */
|
|
|
|
|
-.app-container>>>.el-checkbox.is-disabled .el-checkbox__input.is-checked+.el-checkbox__label {
|
|
|
|
|
|
|
+.app-container >>> .el-checkbox.is-disabled .el-checkbox__input.is-checked + .el-checkbox__label {
|
|
|
color: #409eff !important;
|
|
color: #409eff !important;
|
|
|
}
|
|
}
|
|
|
</style>
|
|
</style>
|